:root{color:#17202a;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f5f7fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer;border:0}button:disabled,input:disabled{cursor:not-allowed;opacity:.48}.app-shell{grid-template-columns:minmax(0,1fr) 380px;min-height:100vh;display:grid}.preview-panel{background:#eef3f8;place-items:center;min-height:100vh;padding:34px;display:grid;position:relative;overflow:hidden}.compare-grid{grid-template-columns:repeat(2,minmax(240px,1fr));align-items:center;gap:18px;width:min(100%,920px);display:grid}.camera-card{aspect-ratio:4/5;background:#101820;border:1px solid #d5deea;border-radius:8px;min-width:0;position:relative;overflow:hidden;box-shadow:0 18px 40px #202d4024}.camera-label{z-index:2;color:#fff;background:#101820b3;border-radius:999px;padding:6px 9px;font-size:.78rem;font-weight:750;position:absolute;top:12px;left:12px}.original-video,.webar-view,.webar-view>canvas{width:100%;height:100%}.original-video,.webar-view>canvas{object-fit:cover}.original-video{display:block;transform:scaleX(-1)}.preview-placeholder{color:#ffffffc7;background:linear-gradient(135deg,#18232ea3,#101820db),repeating-linear-gradient(45deg,#ffffff14 0 1px,#0000 1px 18px);place-items:center;display:grid;position:absolute;inset:0}.preview-placeholder span{letter-spacing:0;font-size:.95rem}.controls-panel{background:#fff;border-left:1px solid #dde4ef;flex-direction:column;gap:22px;min-width:0;max-height:100vh;padding:34px 28px;display:flex;overflow-y:auto;box-shadow:-12px 0 34px #202d4014}.panel-header{gap:8px;display:grid}.eyebrow{color:#537188;text-transform:uppercase;margin:0;font-size:.75rem;font-weight:700}h1{color:#17202a;letter-spacing:0;margin:0;font-size:2rem;line-height:1.05}.status-copy{color:#52606d;min-height:42px;margin:0;font-size:.95rem;line-height:1.45}.status-pill{color:#52606d;text-align:center;text-transform:uppercase;background:#edf2f7;border-radius:999px;width:fit-content;min-width:72px;padding:6px 10px;font-size:.78rem;font-weight:700}.status-camera,.status-ready{color:#176a3a;background:#e6f4ea}.status-loading{color:#7a5200;background:#fff2cf}.status-error{color:#a32929;background:#fde8e8}.button-row{grid-template-columns:1fr 104px;gap:10px;display:grid}.primary-button,.secondary-button,.capture-button,.reset-button{border-radius:8px;min-height:44px;font-weight:750}.primary-button{color:#fff;background:#116466}.secondary-button{color:#17202a;background:#e9eef3}.capture-button{color:#0c5456;background:#d9f0ef;width:100%}.text-button{color:#116466;background:#eef3f8;border-radius:8px;min-height:32px;padding:0 10px;font-size:.82rem;font-weight:750}.reset-button{color:#fff;background:#182b3a;margin-top:auto}.control-group{gap:20px;padding-top:2px;display:grid}.preset-panel{background:#f7fbfb;border:1px solid #d8e6e5;border-radius:8px;gap:12px;padding:16px;display:grid}.preset-header{justify-content:space-between;align-items:center;gap:10px;display:flex}.preset-header h2{color:#243447;letter-spacing:0;margin:0;font-size:.9rem}.preset-save-row{grid-template-columns:minmax(0,1fr) 82px;gap:8px;display:grid}.preset-save-row input{color:#17202a;border:1px solid #cfd8e3;border-radius:8px;min-width:0;min-height:40px;padding:0 11px}.preset-list{gap:10px;display:grid}.preset-item{background:#fff;border:1px solid #e1e8f0;border-radius:8px;gap:10px;padding:11px;display:grid}.preset-item strong{color:#17202a;font-size:.92rem;display:block}.preset-item small,.empty-presets{color:#687684;font-size:.78rem}.empty-presets{margin:0}.preset-actions{flex-wrap:wrap;gap:6px;display:flex}.preset-actions button{color:#243447;background:#edf2f7;border-radius:8px;min-height:32px;padding:0 9px;font-size:.78rem;font-weight:750}.control-section{background:#fbfdff;border:1px solid #e1e8f0;border-radius:8px;gap:15px;padding:16px;display:grid}.control-section h2{color:#243447;letter-spacing:0;margin:0;font-size:.88rem}.color-effect{gap:10px;padding-top:2px;display:grid}.color-effect+.color-effect{border-top:1px solid #edf2f7;padding-top:15px}.toggle-row,.field-row,.slider-row{gap:8px;display:grid}.toggle-row{grid-template-columns:1fr auto;align-items:center}.toggle-row strong,.field-row span,.slider-row span{color:#17202a;font-size:.95rem;font-weight:750}.toggle-row small{color:#687684;margin-top:3px;font-size:.82rem;line-height:1.35;display:block}.toggle-row input{accent-color:#116466;width:42px;height:24px}.field-row{grid-template-columns:1fr 52px;align-items:center}.field-row input[type=color]{background:#fff;border:1px solid #cfd8e3;border-radius:8px;width:52px;height:36px;padding:2px}.slider-row{grid-template-columns:1fr auto;align-items:center}.slider-row output{color:#52606d;font-variant-numeric:tabular-nums;font-size:.86rem}.slider-row input[type=range]{accent-color:#116466;grid-column:1/-1;width:100%}.capture-modal{z-index:10;background:#0d1822a3;place-items:center;padding:28px;display:grid;position:fixed;inset:0}.capture-dialog{background:#fff;border-radius:8px;gap:18px;width:min(1120px,100%);max-height:min(860px,94vh);padding:22px;display:grid;overflow:auto;box-shadow:0 24px 80px #080f1752}.capture-header{justify-content:space-between;align-items:center;gap:16px;display:flex}.capture-header h2{color:#17202a;letter-spacing:0;margin:4px 0 0;font-size:1.35rem}.icon-button{color:#17202a;background:#e9eef3;border-radius:8px;min-height:38px;padding:0 14px;font-weight:750}.capture-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.capture-grid figure{gap:10px;margin:0;display:grid}.capture-grid figcaption{color:#243447;font-size:.92rem;font-weight:750}.capture-grid img{background:#101820;border:1px solid #d5deea;border-radius:8px;width:100%}@media (width<=860px){.app-shell{grid-template-rows:auto auto;grid-template-columns:1fr}.preview-panel{min-height:auto;padding:20px}.compare-grid{grid-template-columns:1fr;width:min(100%,420px)}.camera-card{aspect-ratio:4/3}.controls-panel{border-top:1px solid #dde4ef;border-left:0;min-height:42vh;max-height:none;padding:24px 20px;overflow:visible;box-shadow:0 -12px 28px #202d4012}.reset-button{margin-top:4px}.capture-modal{padding:14px}.capture-dialog{padding:16px}.capture-grid{grid-template-columns:1fr}}
