:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f4f1ff;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--bg:#0d0d12;--panel:#15141c;--panel-2:#1b1924;--line:#ffffff1c;--muted:#aaa4b8;--text:#f4f1ff;--accent:#a77cff;--accent-2:#6ee7f9;--danger:#ff6b8b;--shadow:0 24px 90px #00000057;background:#0d0d12;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:radial-gradient(circle at 20% 0,#a77cff1f,#0000 34rem),linear-gradient(#101018 0%,#0d0d12 58%)}button,input,select{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-shell{flex-direction:column;gap:18px;min-height:100vh;padding:24px;display:flex}.app-header,.app-footer{justify-content:space-between;align-items:center;gap:16px;display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-mark{width:44px;height:44px;color:var(--accent);background:#211b33;border:1px solid #a77cff6b;border-radius:8px;place-items:center;display:grid}h1{letter-spacing:0;margin:0;font-size:clamp(1.65rem,3vw,2.65rem);line-height:1}.showcase-label,.status-label{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.76rem;display:block}.header-actions,.toolbar-row{flex-wrap:wrap;align-items:center;gap:9px;display:flex}.workspace{flex:1;grid-template:"studio toolbar""status toolbar"/minmax(0,1fr) 300px;align-items:start;gap:16px;display:grid}.studio{border:1px solid var(--line);min-width:0;box-shadow:var(--shadow);background:#15141cc2;border-radius:8px;grid-area:studio;overflow:hidden}.stage-header{border-bottom:1px solid var(--line);background:#0d0d12c7;justify-content:space-between;align-items:center;gap:12px;min-height:58px;padding:12px 14px;display:flex}.stage-header strong{font-size:.98rem;display:block}.stage-header span{color:var(--muted);font-size:.9rem}.gesture-badge{color:#fff;white-space:nowrap;background:#a77cff29;border:1px solid #a77cff6b;border-radius:8px;padding:8px 11px}.media-stage{touch-action:none;-webkit-user-select:none;user-select:none;background:#09090d;width:100%;min-height:340px;max-height:calc(100vh - 205px);position:relative;overflow:hidden}.media-stage.accepts-pointer{cursor:crosshair}.camera-feed,.drawing-canvas,.cursor-canvas,.camera-placeholder{width:100%;height:100%;position:absolute;inset:0}.camera-feed{object-fit:fill;background:#07070a;transform:scaleX(-1)}.drawing-canvas,.cursor-canvas{z-index:2}.cursor-canvas{z-index:3;pointer-events:none}.camera-placeholder{z-index:1;text-align:center;background:#0b0b10;place-items:center;padding:24px;display:grid}.camera-placeholder strong{margin-bottom:6px;font-size:1.35rem;display:block}.camera-placeholder span{color:var(--muted)}.toolbar{border:1px solid var(--line);box-shadow:var(--shadow);background:#15141ce6;border-radius:8px;flex-direction:column;grid-area:toolbar;gap:12px;padding:13px;display:flex}.toolbar-compact{grid-area:toolbar}.toolbar-group{border-bottom:1px solid var(--line);flex-direction:column;gap:9px;padding-bottom:12px;display:flex}.toolbar-group:last-child{border-bottom:0;padding-bottom:0}.toolbar-group:first-child{flex-direction:row}.icon-button,.primary-button,.secondary-button,.segmented button{border:1px solid var(--line);min-height:38px;color:var(--text);cursor:pointer;background:#1b1924;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:9px 11px;transition:border-color .14s,background-color .14s,transform .14s;display:inline-flex}.icon-button{width:42px;height:42px;padding:0}.icon-button:hover,.primary-button:hover,.secondary-button:hover,.segmented button:hover{background:#242132;border-color:#a77cff8c}.icon-button:disabled,.primary-button:disabled,.secondary-button:disabled{opacity:.45;cursor:not-allowed}.icon-button.is-active,.segmented .is-active{color:#fff;background:#a77cff38;border-color:#a77cffc2}.primary-button{background:#6f45c8;border-color:#8f68df}.field-label{color:var(--muted);align-items:center;gap:7px;font-size:.88rem;display:inline-flex}.color-input,select,input[type=range]{width:100%}.color-input{border:1px solid var(--line);background:#111019;border-radius:8px;height:38px;padding:2px}select{border:1px solid var(--line);min-height:38px;color:var(--text);background:#111019;border-radius:8px;padding:0 9px}.swatches{grid-template-columns:repeat(7,1fr);gap:7px;display:grid}.swatch{aspect-ratio:1;cursor:pointer;border:2px solid #ffffff2e;border-radius:8px;width:100%}.swatch.is-selected{border-color:#fff;box-shadow:0 0 0 2px #a77cff6b}.segmented{grid-template-columns:1fr;gap:7px;display:grid}.segmented button{width:100%}.status-panel{border:1px solid var(--line);background:#15141cc7;border-radius:8px;grid-area:status;padding:14px}.status-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:10px 0;display:grid}.status-card{border:1px solid var(--line);background:#ffffff09;border-radius:8px;align-items:center;gap:10px;min-width:0;padding:10px;display:flex}.status-card.featured{color:#fff;border-color:#a77cff6b}.status-card strong{text-overflow:ellipsis;white-space:nowrap;text-transform:capitalize;display:block;overflow:hidden}.status-message,.privacy-note{color:var(--muted);margin:8px 0 0;font-size:.92rem}.privacy-note{color:#d8d1e8;align-items:center;gap:8px;display:flex}.tutorial-overlay{z-index:4;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#0d0d12db;border:1px solid #ffffff29;border-radius:8px;width:min(320px,100% - 32px);padding:14px;position:absolute;top:16px;left:16px;box-shadow:0 16px 40px #0000004d}.tutorial-overlay ol{color:#ded9eb;margin:10px 0 0;padding-left:21px}.tutorial-overlay li+li{margin-top:5px}.close-button,.tutorial-reopen{border:1px solid var(--line);color:var(--text);cursor:pointer;background:#1b1924;border-radius:8px}.close-button{place-items:center;width:28px;height:28px;display:grid;position:absolute;top:8px;right:8px}.tutorial-reopen{z-index:4;padding:8px 10px;position:absolute;top:16px;left:16px}.app-footer{color:var(--muted);font-size:.86rem}.is-presentation{padding:14px}.is-presentation .workspace{grid-template:"studio toolbar"1fr/minmax(0,1fr) 230px}.is-presentation .media-stage{max-height:calc(100vh - 150px)}.is-presentation .stage-header{min-height:66px}@media (width<=1100px){.workspace,.is-presentation .workspace{grid-template-columns:1fr;grid-template-areas:"studio""toolbar""status"}.toolbar{flex-flow:wrap;align-items:stretch}.toolbar-group{flex:1;min-width:180px}.status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=720px){.app-shell{padding:14px}.app-header,.app-footer{flex-direction:column;align-items:flex-start}.media-stage{min-height:245px;max-height:none}.status-grid{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}