:root{--bg: #150806;--ink: #21110d;--cream: #fff3d6;--cream-dim: rgba(255, 243, 214, .62);--yellow: #ffcf24;--yellow-bright: #ffe15f;--red: #e31f1f;--red-bright: #ff4a30;--green: #33b96f;--panel: rgba(31, 12, 8, .68);--border: rgba(255, 207, 36, .28)}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;background:var(--bg);color:var(--cream);font-family:Inter,system-ui,-apple-system,sans-serif;overflow:hidden;cursor:none}#overlay .dock,#overlay .dock *{cursor:pointer}.ring{position:fixed;top:0;left:0;width:120px;height:120px;border:1.5px solid rgba(255,207,36,.78);border-radius:50%;pointer-events:none;z-index:5;opacity:0;transition:opacity .2s ease,border-color .15s ease,background .15s ease;box-shadow:0 0 0 1px #21110d99,inset 0 0 18px #ffcf242e}.ring:after{content:"";position:absolute;top:50%;left:50%;width:4px;height:4px;border-radius:50%;background:var(--cream);transform:translate(-50%,-50%)}.ring--grab{border-color:var(--red-bright);background:#e31f1f1f;box-shadow:0 0 26px #e31f1f8c,inset 0 0 18px #ffcf2447}#stage{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;display:block;touch-action:none;z-index:0}#overlay{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2}#overlay button,#overlay a{pointer-events:auto}.brand{position:absolute;top:28px;left:32px;-webkit-user-select:none;user-select:none}.brand__text{display:flex;line-height:1}.brand__name{font-size:28px;font-weight:800;letter-spacing:-.02em;color:var(--cream);text-shadow:0 2px 14px rgba(0,0,0,.55)}.brand__name span{color:var(--yellow);text-transform:uppercase}.status{position:absolute;top:32px;right:32px;display:flex;align-items:center;gap:9px;padding:8px 14px;font-size:12px;letter-spacing:.04em;color:var(--cream-dim);background:var(--panel);border:1px solid var(--border);border-radius:999px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);-webkit-user-select:none;user-select:none}.status__dot{width:8px;height:8px;border-radius:50%;background:#b9b39f;transition:background .3s ease,box-shadow .3s ease}.status[data-state=live] .status__dot{background:var(--green);box-shadow:0 0 10px #33b96fcc}.status[data-state=connecting] .status__dot{background:var(--yellow);box-shadow:0 0 10px #ffcf24e6;animation:pulse 1s ease-in-out infinite}.status[data-state=down] .status__dot{background:#e5675b}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.wall-note{position:absolute;top:78px;right:32px;width:260px;color:var(--ink);background:#ffe6a6;border:3px solid var(--ink);border-radius:4px;box-shadow:7px 7px #00000073;pointer-events:none;-webkit-user-select:none;user-select:none}.wall-note__title{display:flex;align-items:center;justify-content:space-between;padding:4px 8px;color:var(--ink);background:var(--yellow);border-bottom:3px solid var(--ink);font-size:11px;font-weight:800;letter-spacing:-.02em}.wall-note__chrome{font-size:12px;letter-spacing:.02em}.wall-note__body{display:grid;gap:8px;padding:11px 12px 12px;font-size:12px;line-height:1.25}.wall-note__body p{padding:7px 9px;border:2px solid var(--ink);border-radius:4px;background:#fff8ec}.wall-note__body p:nth-child(1){background:#ff5a3c}.wall-note__body p:nth-child(2){background:#ffcf24}.wall-note__body p:nth-child(3){background:#33b96f}.wall-note__body strong{display:block;margin-bottom:2px}.presets{position:absolute;left:50%;bottom:116px;transform:translate(-50%);display:flex;gap:4px;max-width:min(86vw,760px);padding:4px;overflow-x:auto;scrollbar-width:none;background:#1f0c08a3;border:1px solid var(--border);border-radius:999px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.presets::-webkit-scrollbar{display:none}.preset{flex:0 0 auto;border:none;background:transparent;color:var(--cream-dim);font:inherit;font-size:11px;font-weight:500;padding:6px 10px;border-radius:999px;cursor:pointer;transition:background .18s ease,color .18s ease}.preset:hover{color:var(--cream);background:#ffcf2424}.preset--active{color:var(--ink);background:var(--yellow)}.hint{position:absolute;top:36px;left:50%;transform:translate(-50%) translateY(-8px);font-size:13px;letter-spacing:.03em;color:var(--cream-dim);background:var(--panel);border:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:9px 16px;border-radius:999px;opacity:0;transition:opacity .4s ease,transform .4s ease}.hint--show{opacity:1;transform:translate(-50%) translateY(0)}.dock{position:absolute;bottom:32px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--panel);border:1px solid var(--border);border-radius:999px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 18px 50px #00000080}.dock__btn{display:grid;place-items:center;width:46px;height:46px;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--cream);cursor:pointer;transition:background .18s ease,transform .18s ease,border-color .18s ease}.dock__btn:hover{background:#ffcf2424;transform:translateY(-1px)}.dock__btn:active{transform:translateY(0) scale(.96)}.dock__btn--primary{background:var(--yellow);border-color:transparent;color:var(--ink);box-shadow:0 6px 20px #ffcf247a}.dock__btn--primary:hover{background:var(--yellow-bright)}.dock__btn--camera{background:var(--red);border-color:transparent;color:#fff;box-shadow:0 6px 20px #ef3f3f75}.dock__btn--camera:hover{background:var(--red-bright)}.dock__divider{width:1px;height:28px;background:var(--border);margin:0 10px}.dock__meta{display:flex;flex-direction:column;align-items:center;min-width:96px;padding:0 6px;line-height:1.2}.dock__label{font-size:12px;font-weight:500;color:var(--cream);max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dock__counter{font-size:11px;color:var(--cream-dim);letter-spacing:.08em}.loading{position:fixed;top:0;right:0;bottom:0;left:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;pointer-events:none;opacity:0;transition:opacity .25s ease}.loading--show{opacity:1}.loading span{font-size:14px;font-weight:500;letter-spacing:.08em;color:var(--cream);text-shadow:0 2px 12px rgba(0,0,0,.7)}.loading__spin{width:54px;height:54px;border-radius:50%;border:3px solid rgba(240,237,228,.25);border-top-color:var(--blue-bright);box-shadow:0 0 24px #3b6fe573;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.viewfinder{position:fixed;top:0;right:0;bottom:0;left:0;z-index:6;display:none;flex-direction:column;align-items:center;justify-content:center;gap:24px;background:#000000d1;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto}.viewfinder--show{display:flex}.viewfinder__frame{width:min(80vw,70vh);aspect-ratio:16 / 9;border-radius:18px;overflow:hidden;border:1px solid var(--border);box-shadow:0 24px 80px #0009,0 0 0 1px #ffcf2452;background:#000}.viewfinder__frame video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.viewfinder__controls{display:flex;gap:12px}.vf-btn{font:inherit;font-size:15px;font-weight:600;color:var(--cream);background:#ffcf241f;border:1px solid var(--border);padding:12px 28px;border-radius:999px;cursor:pointer;transition:background .18s ease,transform .18s ease}.vf-btn:hover{background:#ffcf2433}.vf-btn:active{transform:scale(.97)}.vf-btn--primary{color:var(--ink);background:var(--yellow);border-color:transparent;box-shadow:0 6px 22px #ffcf2480}.vf-btn--primary:hover{background:var(--yellow-bright)}body.dropping:after{content:"Drop images to add";position:fixed;top:16px;right:16px;bottom:16px;left:16px;z-index:3;display:grid;place-items:center;font-size:18px;letter-spacing:.04em;color:var(--cream);border:2px dashed var(--yellow);border-radius:24px;background:#e31f1f1f;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:none}.fatal{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:40px;text-align:center;color:var(--cream);font-size:16px}@media(max-width:900px),(max-height:680px){.wall-note{top:auto;right:18px;bottom:198px;width:min(260px,calc(100vw - 36px));transform:scale(.86);transform-origin:bottom right}}@media(max-width:640px){.wall-note{display:none}}