:root{color:#263143;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#fbf5e9;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--panel: rgba(255, 255, 255, .82);--ink: #263143;--muted: #607083;--rose: #ff7a90;--aqua: #55d4c7;--yellow: #ffd56a;--blue: #74a8ff}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,a{font:inherit}button{border:0}#root{min-height:100vh}.start-screen,.booth-screen,.preview-screen{min-height:100vh;padding:24px;background:radial-gradient(circle at 15% 14%,rgba(255,213,106,.52),transparent 23%),radial-gradient(circle at 84% 18%,rgba(85,212,199,.42),transparent 25%),linear-gradient(135deg,#fbf5e9,#eff9ff 48%,#fff0f4)}.start-screen,.preview-screen{display:grid;place-items:center}.start-panel,.preview-panel,.status-panel{width:min(100%,780px);padding:clamp(28px,6vw,56px);border:3px solid rgba(255,255,255,.86);border-radius:8px;background:var(--panel);box-shadow:0 24px 60px #414f672e;text-align:center}.start-panel{position:relative;overflow:hidden}.start-panel:before,.start-panel:after{position:absolute;width:132px;height:132px;border-radius:999px;content:"";opacity:.72}.start-panel:before{top:-44px;left:-28px;background:var(--yellow)}.start-panel:after{right:-38px;bottom:-40px;background:var(--aqua)}.kicker{margin:0 0 10px;color:#b04e63;font-size:.82rem;font-weight:800;letter-spacing:0;text-transform:uppercase}h1{margin:0;color:var(--ink);font-size:clamp(2rem,8vw,4.6rem);line-height:.98}.controls-panel h1,.status-panel h1{font-size:clamp(2rem,5vw,3rem)}.start-copy{width:min(100%,560px);margin:22px auto 30px;color:var(--muted);font-size:clamp(1rem,2.5vw,1.2rem);line-height:1.55}.primary-action,.secondary-action{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:13px 22px;border-radius:8px;color:#fff;cursor:pointer;font-weight:800;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.primary-action{background:#e95874;box-shadow:0 12px 24px #e958743d}.secondary-action{background:#4d6fb8;box-shadow:0 12px 24px #4d6fb833}.primary-action:hover,.secondary-action:hover,.profession-button:hover{transform:translateY(-2px)}.primary-action:disabled,.secondary-action:disabled,.profession-button:disabled{cursor:wait;opacity:.62;transform:none}.primary-action:focus-visible,.secondary-action:focus-visible,.profession-button:focus-visible{outline:3px solid #263143;outline-offset:3px}.booth-screen{display:flex;align-items:flex-start;justify-content:center;padding-block:clamp(12px,2vw,24px)}.booth-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,390px);gap:clamp(14px,2vw,22px);width:min(100%,1320px);align-items:center}.canvas-area,.controls-panel,.ar-stage{border:3px solid rgba(255,255,255,.88);border-radius:8px;background:#ffffffc7;box-shadow:0 20px 50px #414f6729}.canvas-area{display:grid;min-height:320px;overflow:hidden;place-items:center;padding:10px}canvas{display:block;width:100%;max-height:min(72vh,720px);height:auto;aspect-ratio:16 / 9;border-radius:6px;background:#f8fbff;object-fit:contain}.ar-layout{grid-template-columns:minmax(0,1fr) minmax(310px,360px)}.ar-stage{position:relative;overflow:hidden;width:100%;aspect-ratio:16 / 9;min-height:300px;background:#f8fbff;touch-action:none}.ar-stage.calibrating{cursor:grab;outline:4px solid color-mix(in srgb,var(--accent-color) 62%,white);outline-offset:4px}.ar-stage.calibrating:active{cursor:grabbing}.ar-video,.segmented-canvas,.ar-canvas{position:absolute;inset:0;width:100%;height:100%}.ar-video{z-index:0;object-fit:cover;transform:scaleX(-1)}.source-video{opacity:0}.segmented-canvas{z-index:0;object-fit:cover}.ar-canvas{z-index:1;background:transparent;pointer-events:none}.ar-stage.calibrating .ar-canvas{pointer-events:auto}.face-message{position:absolute;z-index:3;top:50%;left:50%;width:min(72%,360px);padding:12px 16px;border:2px solid rgba(255,255,255,.78);border-radius:8px;background:#ffffffb3;color:#263143;font-weight:900;text-align:center;transform:translate(-50%,-50%)}.live-caption{position:absolute;z-index:2;right:16px;bottom:14px;left:16px;display:grid;gap:2px;min-height:52px;padding:8px 12px 8px 16px;border-left:6px solid var(--accent-color);border-radius:8px;background:#ffffffc2;color:#263143;box-shadow:0 12px 28px #26314324}.live-caption span{color:color-mix(in srgb,var(--accent-color) 70%,#263143);font-size:clamp(.86rem,1.3vw,1rem);font-weight:900}.live-caption strong{font-size:clamp(.82rem,1.2vw,1rem);line-height:1.15}.calibration-hud{position:absolute;z-index:4;top:16px;left:50%;width:min(92%,560px);padding:10px 14px;border-radius:8px;background:#263143c7;color:#fff;font-size:.92rem;font-weight:800;text-align:center;transform:translate(-50%)}.controls-panel{display:flex;flex-direction:column;gap:14px;padding:clamp(18px,2vw,24px);align-self:center}.controls-heading{display:grid;gap:8px}.profession-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.profession-button{min-height:44px;padding:8px 10px;border:2px solid color-mix(in srgb,var(--accent-color) 54%,white);border-radius:8px;background:#fff;color:var(--ink);cursor:pointer;font-weight:800;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease,background .15s ease}.profession-button.active{border-color:var(--accent-color);background:color-mix(in srgb,var(--accent-color) 24%,white);box-shadow:inset 0 0 0 2px #ffffffb8}.phrase-box{display:grid;min-height:74px;gap:5px;padding:12px 14px 12px 16px;border-left:8px solid var(--accent-color);border-radius:8px;background:#ffffffdb;color:var(--ink);line-height:1.2}.phrase-box span{color:color-mix(in srgb,var(--accent-color) 70%,#263143);font-size:1rem;font-weight:900}.phrase-box strong{font-size:clamp(1.1rem,2vw,1.25rem);font-weight:900}.full-width{width:100%}.debug-panel{display:grid;gap:10px;padding:14px;border:2px dashed rgba(38,49,67,.24);border-radius:8px;background:#ffffffa3}.debug-panel label{display:grid;grid-template-columns:112px minmax(0,1fr) 42px;gap:8px;align-items:center;color:#526173;font-size:.82rem;font-weight:800}.debug-panel input{width:100%;accent-color:#e95874}.debug-panel output{color:#263143;text-align:right}.active-tool{background:#263143}.debug-calibration-panel{display:grid;gap:12px;padding:14px;border:2px solid rgba(38,49,67,.12);border-radius:8px;background:#ffffffad}.debug-button-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.debug-button-row:first-child,.debug-button-row:nth-child(2){grid-template-columns:repeat(3,minmax(0,1fr))}.debug-button-row.two-columns{grid-template-columns:repeat(2,minmax(0,1fr))}.debug-calibration-panel button{min-height:40px;border:2px solid rgba(38,49,67,.14);border-radius:8px;background:#fff;color:#263143;cursor:pointer;font-weight:900}.debug-calibration-panel button.active,.debug-calibration-panel button:hover{border-color:#e95874;background:#fff3f6}.debug-calibration-panel label{display:flex;gap:8px;align-items:center;color:#263143;font-size:.9rem;font-weight:800}.segmentation-debug-controls{display:grid;gap:8px;padding:10px;border:1px solid rgba(38,49,67,.12);border-radius:8px;background:#ffffff85}.segmentation-debug-controls strong{color:#263143;font-size:.9rem}.segmentation-debug-controls label{display:grid;grid-template-columns:132px minmax(0,1fr) 42px}.segmentation-debug-controls input{width:100%}.segmentation-debug-controls output{text-align:right}.quick-calibration{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.quick-calibration button{min-height:42px;border:2px solid rgba(38,49,67,.14);border-radius:8px;background:#fff;color:#263143;cursor:pointer;font-weight:900}.quick-calibration button:hover{border-color:#e95874}.quick-adjust-panel{display:grid;gap:8px}.compact-action{min-height:42px;padding-block:9px;font-size:.92rem}.quick-adjust-controls{display:grid;gap:8px;padding:10px;border:2px solid rgba(38,49,67,.1);border-radius:8px;background:#ffffffa3}.quick-adjust-pad,.quick-adjust-actions{display:grid;gap:7px}.quick-adjust-pad{grid-template-columns:repeat(3,minmax(0,1fr))}.quick-adjust-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.quick-adjust-controls button{min-height:38px;padding:7px 8px;border:2px solid rgba(38,49,67,.13);border-radius:8px;background:#fff;color:#263143;cursor:pointer;font-size:.86rem;font-weight:900}.quick-adjust-controls button:hover,.quick-adjust-controls button:focus-visible{border-color:#e95874;background:#fff3f6}.debug-toggle-action{background:#4d6fb8}.calibration-readout{max-height:210px;margin:0;padding:14px;overflow:auto;border:2px solid rgba(38,49,67,.12);border-radius:8px;background:#ffffffc2;color:#263143;font-family:Cascadia Mono,Consolas,monospace;font-size:.78rem;line-height:1.45;white-space:pre-wrap}.error-message,.status-panel p{margin:0;color:#a3364c;font-weight:700;line-height:1.45}.status-panel{display:grid;gap:22px;justify-items:center}.photo-frame{overflow:hidden;border:3px solid #fff;border-radius:8px;background:#f8fbff;box-shadow:0 16px 32px #414f6726}.photo-frame img{display:block;width:100%;height:auto}.preview-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:22px}.debug-camera-screen{min-height:100vh;padding:18px;background:radial-gradient(circle at 18% 14%,rgba(255,213,106,.45),transparent 22%),radial-gradient(circle at 82% 18%,rgba(85,212,199,.36),transparent 24%),linear-gradient(135deg,#fbf5e9,#eff9ff 52%,#fff0f4)}.debug-camera-panel{display:grid;width:min(100%,880px);gap:14px;margin:0 auto;padding:clamp(14px,3vw,24px);border:3px solid rgba(255,255,255,.88);border-radius:8px;background:#ffffffd1;box-shadow:0 20px 50px #414f6729}.debug-camera-video{display:block;width:100%;min-height:260px;max-height:72vh;aspect-ratio:16 / 9;border:3px solid #fff;border-radius:8px;background:#111827;object-fit:cover;transform:scaleX(-1)}.debug-camera-actions{display:flex;flex-wrap:wrap;gap:10px}.debug-camera-readout{max-height:340px;margin:0;padding:14px;overflow:auto;border:2px solid rgba(38,49,67,.12);border-radius:8px;background:#ffffffc7;color:#263143;font-family:Cascadia Mono,Consolas,monospace;font-size:.82rem;line-height:1.45;white-space:pre-wrap}@media(max-width:860px){.booth-layout{grid-template-columns:1fr}}@media(max-width:560px){.start-screen,.booth-screen,.preview-screen{padding:14px}.start-panel,.preview-panel,.status-panel,.controls-panel{padding:18px}.canvas-area{padding:6px}canvas{max-height:none}.ar-stage{min-height:auto}.live-caption{right:8px;bottom:8px;left:8px;min-height:46px;padding:7px 10px 7px 12px}.debug-panel label,.profession-grid{grid-template-columns:1fr}.primary-action,.secondary-action,.preview-actions,.debug-camera-actions{width:100%}.debug-camera-video{min-height:220px;aspect-ratio:3 / 4}}@media(max-width:768px){.start-screen,.booth-screen,.preview-screen{padding:10px 12px calc(12px + env(safe-area-inset-bottom))}.booth-screen{align-items:flex-start}.booth-layout,.booth-layout.ar-layout{width:min(100%,430px);grid-template-columns:1fr;gap:10px;align-items:stretch}.ar-stage{min-height:0;aspect-ratio:4 / 5;border-width:2px;box-shadow:0 14px 34px #414f6724}.ar-video,.segmented-canvas,.ar-canvas{object-fit:cover}.live-caption{display:none}.face-message{width:min(80%,300px);padding:10px 12px;font-size:.92rem}.calibration-hud{top:8px;width:calc(100% - 16px);padding:8px 10px;font-size:.78rem}.controls-panel{gap:10px;padding:10px;border-width:2px;background:#ffffffd6;box-shadow:0 12px 28px #414f671f}.controls-heading{order:0;gap:4px}.controls-heading .kicker{margin-bottom:0;font-size:.72rem}.controls-heading h1{font-size:clamp(1.65rem,9vw,2.25rem);line-height:1}.phrase-box{order:1;min-height:0;gap:2px;padding:9px 11px 9px 13px;border-left-width:6px}.phrase-box span{font-size:.88rem}.phrase-box strong{font-size:1rem;line-height:1.15}.profession-grid{order:2;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.profession-button{min-height:42px;padding:7px 8px;font-size:.9rem;line-height:1.1}.controls-panel>.secondary-action{min-height:40px;padding:9px 12px;font-size:.9rem;background:#4d6fb8}.debug-toggle-action{order:4}.debug-calibration-panel{order:4;max-height:52vh;overflow:auto;padding:10px}.debug-button-row,.debug-button-row:first-child,.debug-button-row:nth-child(2),.debug-button-row.two-columns,.quick-calibration{grid-template-columns:repeat(2,minmax(0,1fr))}.debug-calibration-panel button{min-height:38px;padding:6px 8px;font-size:.82rem}.debug-calibration-panel label,.segmentation-debug-controls strong{font-size:.82rem}.segmentation-debug-controls label{grid-template-columns:1fr;gap:4px}.calibration-readout{max-height:150px;padding:10px;font-size:.72rem}.error-message{order:5;font-size:.9rem}.quick-adjust-panel{order:3}.quick-adjust-controls{padding:8px}.quick-adjust-controls button{min-height:40px;font-size:.82rem}.controls-panel>.primary-action{position:sticky;z-index:6;bottom:max(10px,env(safe-area-inset-bottom));order:6;width:100%;min-height:52px;padding:13px 16px;font-size:1rem;box-shadow:0 14px 28px #e9587447}.preview-panel,.status-panel,.start-panel{width:min(100%,430px);padding:20px}.preview-actions{gap:10px}}
