.device-warning[data-v-f5995b19]{position:fixed;top:0;left:0;right:0;background:linear-gradient(135deg,#ff9800,#f57c00);color:#fff;padding:12px;z-index:10000;box-shadow:0 2px 8px #0003;animation:slideDown-f5995b19 .3s ease-out}.warning-content[data-v-f5995b19]{display:flex;align-items:center;gap:12px;max-width:1200px;margin:0 auto;padding:0 20px}.warning-icon[data-v-f5995b19]{font-size:24px;flex-shrink:0}.warning-text[data-v-f5995b19]{flex:1}.warning-text p[data-v-f5995b19]{margin:0;font-size:14px;font-weight:500}.warning-subtext[data-v-f5995b19]{font-size:12px!important;opacity:.9;margin-top:2px!important}@keyframes slideDown-f5995b19{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}@media (min-width: 768px){.device-warning[data-v-f5995b19]{display:none}}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;min-height:100vh}:root{--color-primary: #1890ff;--color-primary-hover: #40a9ff;--color-primary-active: #096dd9;--color-primary-light: rgba(24, 144, 255, .2);--color-success: #52c41a;--color-success-hover: #73d13d;--color-warning: #faad14;--color-warning-hover: #ffc53d;--color-danger: #ff4d4f;--color-danger-hover: #ff7875;--color-text-primary: #333333;--color-text-secondary: #666666;--color-text-disabled: #999999;--color-text-placeholder: #bfbfbf;--color-bg-base: #ffffff;--color-bg-panel: #f8f9fa;--color-bg-hover: #f5f5f5;--color-border: #e9ecef;--color-border-input: #d9d9d9;--color-border-focus: var(--color-primary);--color-water: rgba(100, 180, 255, .5);--color-glass: rgba(180, 220, 240, .4);--color-glass-border: #5ba3d0;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 16px;--radius-round: 25px;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .1);--shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--shadow-lg: 0 10px 40px rgba(0, 0, 0, .2);--transition-fast: .15s ease;--transition-normal: .3s ease;--transition-slow: .5s ease}*{margin:0;padding:0;box-sizing:border-box}html,body,#app,.app-container{overflow-x:hidden!important;width:100%!important;max-width:100%!important}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;min-height:100vh;color:var(--color-text-primary);overflow-x:hidden;width:100%}#app{width:100%;min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}select,input[type=range]{width:100%;padding:var(--spacing-sm) 12px;border:1px solid var(--color-border-input);border-radius:var(--radius-md);font-size:14px;background:var(--color-bg-base);cursor:pointer}select:focus,input:focus{outline:none;border-color:var(--color-border-focus);box-shadow:0 0 0 2px var(--color-primary-light)}input[type=range]{padding:0;height:6px;-webkit-appearance:none;background:var(--color-border);border-radius:3px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;background:var(--color-primary);border-radius:50%;cursor:pointer;box-shadow:0 2px 6px #1890ff66}.btn{padding:10px 20px;border:none;border-radius:var(--radius-md);font-size:14px;font-weight:500;cursor:pointer;transition:all var(--transition-normal);display:inline-flex;align-items:center;justify-content:center;gap:6px}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-hover);transform:translateY(-1px)}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover{background:var(--color-danger-hover)}.btn-success{background:var(--color-success);color:#fff}.btn-success:hover{background:var(--color-success-hover)}@media (max-width: 768px){body{font-size:14px}.experiment-main{padding:5px!important;margin:5px!important;min-height:calc(100vh - 120px)!important}.control-panel{padding:10px!important}.btn{padding:8px 16px!important;font-size:13px!important}select,input[type=range]{font-size:13px!important;padding:6px 10px!important}.canvas-section{min-height:250px!important;height:250px!important}.sidebar{width:100%!important;min-width:auto!important}.main-content{gap:10px!important}h1{font-size:20px!important}h2{font-size:18px!important}h3{font-size:16px!important}p{font-size:14px!important}*{max-width:100%!important;overflow-x:hidden!important}button,select,input{min-height:44px!important;min-width:44px!important}.ph-scale-experiment .main-content,.density-experiment .main-content,.bending-light-experiment .main-content{padding:10px!important}.liquid-list{max-height:200px!important}.data-panel{max-height:150px!important}}
