:root{color-scheme:dark;--bg: #111;--panel: #1c1c1e;--fg: #f4f4f5;--muted: #a1a1aa;--accent: #f6c7cf}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font:15px/1.4 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased}.app{display:flex;flex-direction:column;height:100%}.stage{position:relative;flex:1;min-height:0;background:#000;overflow:hidden}.stage video,.stage canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.stage video.mirrored{transform:scaleX(-1)}.stage canvas{pointer-events:none}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px;text-align:center;background:#0000008c}.overlay h1{font-size:24px;margin:0}.overlay p{margin:0;color:var(--muted);max-width:320px}.overlay .error{color:#fca5a5}.hint{position:absolute;top:16px;left:50%;transform:translate(-50%);padding:8px 14px;border-radius:999px;background:#0009;font-size:14px;white-space:nowrap}.debug{position:absolute;left:8px;bottom:8px;font:12px monospace;background:#0009;padding:4px 8px;border-radius:6px}.stage-actions{position:absolute;right:16px;bottom:16px;display:flex;flex-direction:column;align-items:center;gap:14px}.stage-actions button{width:44px;height:44px;border-radius:50%;border:0;background:#00000080;color:#fff;font-size:20px}.stage-actions .shutter{width:64px;height:64px;background:#fff;border:4px solid rgba(0,0,0,.3)}.panel{background:var(--panel);padding:12px 16px calc(12px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px}.row{display:flex;gap:10px;align-items:center}.designs{overflow-x:auto;padding-bottom:2px}.swatch{flex:0 0 auto;width:40px;height:40px;border-radius:50%;border:2px solid transparent;background-size:cover;background-position:center;padding:0}.swatch.active{border-color:#fff}.name{color:var(--muted);font-size:13px}.chip{border:1px solid #3f3f46;background:transparent;color:var(--fg);padding:6px 12px;border-radius:999px;font-size:13px}.chip.active{background:var(--fg);color:#111;border-color:var(--fg)}.length span{color:var(--muted);font-size:13px;width:52px}.length input{flex:1;accent-color:var(--accent)}button,a.primary{cursor:pointer;font:inherit}.primary{display:inline-block;padding:12px 24px;border-radius:999px;border:0;background:var(--accent);color:#111;font-weight:600;text-decoration:none}.primary:disabled{opacity:.5}.photo-modal{position:fixed;inset:0;background:#000000e6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:16px}.photo-modal img{max-width:100%;max-height:75vh;border-radius:8px}.photo-actions{display:flex;gap:12px}.photo-actions button{background:transparent;color:var(--fg);border:1px solid #3f3f46;border-radius:999px;padding:12px 20px}@media (min-width: 900px){.app{flex-direction:row}.stage{flex:1}.panel{width:320px;justify-content:center;gap:16px}}