:root{font-family:Inter,system-ui,sans-serif;color:#e8eef1;background:#121b21;font-synthesis:none;color-scheme:dark;--accent:#b7dde5;--line:#33444e;--muted:#a9bcc5}
html.broadcast{background:transparent;color-scheme:normal}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,.file-button{touch-action:manipulation}button,.file-button{cursor:pointer;border:1px solid #536971;background:#263740;color:#e7f1f4;border-radius:9px;padding:10px 13px}button:hover,.file-button:hover{background:#304750}button:disabled{opacity:.5;cursor:wait}input,select{width:100%;min-width:0;background:#15242c;color:#e8f1f4;border:1px solid #425861;border-radius:8px;padding:9px 11px}input[type=range]{padding:0;accent-color:var(--accent);height:26px}input[type=checkbox]{width:auto;accent-color:var(--accent)}label{display:grid;gap:7px;font-size:13px;color:#c1d1d8}label.checkbox{display:flex;gap:8px;align-items:center}a{color:var(--accent)}output{float:right;color:var(--accent)}h1{font-size:23px;font-weight:500;margin:6px 0 0}h2{font-size:15px;font-weight:500;margin:0 0 16px}p{font-size:13px;line-height:1.6;color:var(--muted);margin:10px 0}.hint{font-size:12px;color:var(--muted)}.eyebrow{letter-spacing:.16em;color:var(--muted);font-size:11px}.app-header{padding:22px 28px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.status{font-size:12px;padding:8px 12px;border-radius:20px;background:#293b43;color:#c1d1d8}.status.connected{background:#243e35;color:#b5ebcb}.status.error{background:#4a3030;color:#f8c3bd}.editor-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:28px;padding:24px 28px;max-width:1560px;margin:auto}.preview-column{min-width:0;position:sticky;top:16px;align-self:start}.preview-bar{display:flex;gap:14px;margin-bottom:16px;align-items:end;flex-wrap:wrap}.preview-bar label{flex:1;min-width:160px}.controls{display:flex;flex-direction:column;gap:16px}.controls>section,.controls>form,.source-card{padding:20px;border:1px solid var(--line);background:#1b2931;border-radius:14px}.controls label{margin-bottom:13px}.controls form button{width:100%}.number-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.preview-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:14px 0 22px}.preview-actions span{font-size:12px;color:var(--muted);margin-left:auto}.preview-actions button{font-size:12px;padding:8px 10px}.source-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.source-row input{flex:1;min-width:180px;font-size:12px}.source-row a{font-size:12px}.source-card details{font-size:13px;color:var(--accent)}.action-row{display:flex;gap:9px;flex-wrap:wrap}.action-row button,.file-button{font-size:12px}label.file-button{display:block;margin:0;position:relative;overflow:hidden}.file-button input{position:absolute;inset:0;opacity:0;cursor:pointer}#error{color:#ffb8b1;overflow-wrap:anywhere}#preview-viewport{position:relative;overflow:hidden;border:1px solid #45616c;border-radius:12px;aspect-ratio:16/9;background:#14262f}#preview{position:absolute;left:0;top:0;border:0;transform-origin:top left;display:block}#saved{min-width:90px}
@media(max-width:900px){.editor-grid{grid-template-columns:1fr;padding:18px;gap:20px}.preview-column{position:static}.controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.app-header{padding:18px}}
@media(max-width:530px){.controls{display:flex;align-items:stretch}.preview-bar label{min-width:120px}.source-row input{flex-basis:100%}.preview-actions span{margin-left:0}.editor-grid{padding:14px}.status{max-width:130px}.source-card{padding:16px}}
.overlay #glass{border:0;border-radius:0;box-shadow:none;z-index:0}.overlay #glass:after{display:none}.overlay #glass-rim{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:var(--rim,.65);overflow:visible}.overlay #panel{z-index:2}.overlay #stage[data-design=cards] #glass-rim,.overlay #stage[data-design=wall] #glass-rim{display:none}
body.overlay{background:transparent;color:transparent;overflow:hidden;color-scheme:dark}.overlay #stage{position:relative;width:100vw;height:100vh;overflow:hidden;isolation:isolate}.overlay #panel{position:absolute;left:7%;top:11%;width:63.29%;height:62.51%;transform-origin:center;display:flex;flex-direction:column;padding:30px;gap:18px;color:var(--ink,#eef7fa);font-family:var(--font,Inter),system-ui,sans-serif;font-size:var(--text-size,38px);line-height:1.45;touch-action:none}.overlay .glass{position:absolute;inset:0;pointer-events:none;border-radius:var(--radius,40px);background:linear-gradient(135deg,rgba(240,253,255,.07),rgba(190,222,232,.015) 45%,rgba(231,249,255,.05)),var(--tint-color,rgba(20,40,49,.34));backdrop-filter:blur(var(--blur,12px)) saturate(140%) url(#lens);-webkit-backdrop-filter:blur(var(--blur,12px)) saturate(140%);box-shadow:inset 0 2px 2px rgba(236,255,255,.28),inset 0 -2px 3px rgba(243,255,255,.11),0 14px 35px rgba(0,19,25,.18);border:1px solid rgba(215,244,250,.35)}.overlay .glass:after{content:"";position:absolute;inset:2px;border-radius:inherit;border-top:2px solid rgba(236,253,255,.68);border-bottom:1px solid rgba(236,253,255,.36);box-shadow:inset 0 0 6px rgba(230,248,255,.16);opacity:var(--rim,.65)}.overlay .chat-heading{position:relative;z-index:1;color:var(--name,#c0e4ed);font-weight:500;font-size:.6em;letter-spacing:.025em;flex:none;line-height:1.3;padding:0 0 12px;border-bottom:1px solid rgba(169,221,235,.16)}.overlay .chat-heading:before{content:"";display:inline-block;width:.28em;height:.28em;border-radius:50%;background:currentColor;opacity:.75;margin:0 .55em .12em 0}.overlay .chat-heading[hidden]{display:none}.overlay #messages{position:relative;z-index:1;flex:1;min-height:0;display:flex;flex-direction:column;justify-content:end;gap:var(--gap,12px);overflow:hidden}.overlay .message{flex:none;overflow-wrap:anywhere;white-space:pre-wrap;text-shadow:0 1px 3px var(--text-shadow,rgba(0,15,24,.8));animation:message-in 200ms ease-out}.overlay .author{font-weight:600;color:var(--name,#c0e4ed);margin-right:.35em}.overlay .action .body{font-style:italic}.overlay .badge{display:inline-block;font-size:.45em;font-weight:600;letter-spacing:.03em;vertical-align:.18em;line-height:1.35;padding:.12em .3em;margin-right:.35em;border-radius:5px;color:var(--name,#c0e4ed);background:rgba(178,218,232,.1)}.overlay .test-marker{font-size:.4em;opacity:.7;margin-right:.5em;vertical-align:.4em}.overlay .emote-stack{display:inline-block;position:relative;vertical-align:-.25em;line-height:1;margin:0 .07em;white-space:nowrap}.overlay .emote{display:inline-block;width:auto;height:var(--emote-height,1.4em);max-width:6em;object-fit:contain;vertical-align:bottom;text-shadow:none}.overlay .emote.zero-width{position:absolute;left:50%;bottom:0;transform:translateX(-50%);max-width:none}.overlay #stage[data-theme=light]{--ink:#263d49;--name:#225464;--text-shadow:rgba(250,254,255,.7)}.overlay #stage[data-design=cards] .glass,.overlay #stage[data-design=wall] .glass{display:none}.overlay #stage[data-design=cards] .message{padding:10px 18px;background:var(--tint-color);border:1px solid rgba(205,236,243,.3);border-radius:var(--radius);backdrop-filter:blur(var(--blur));margin-left:var(--card-offset,0px)}.overlay #stage[data-design=cards] .message:nth-child(even){--card-offset:12px}.overlay #stage[data-design=wall] #panel{padding:0}.filter-defs{position:absolute;pointer-events:none}.overlay #handles{position:absolute;inset:0;z-index:3;pointer-events:none}.overlay #handles[hidden]{display:none}.overlay #handles button{position:absolute;transform:translate(-50%,-50%);width:44px;height:44px;padding:0;border:3px solid #bdebf0;border-radius:6px;background:#21414f;box-shadow:0 2px 10px rgba(0,0,0,.2);pointer-events:auto;touch-action:none}.overlay #handles button[data-corner="0"],.overlay #handles button[data-corner="2"]{cursor:nwse-resize}.overlay #handles button[data-corner="1"],.overlay #handles button[data-corner="3"]{cursor:nesw-resize}.overlay #stage[data-corner-mode=distort] #handles button{border-radius:50%;cursor:move}.overlay #preview-backdrop{display:none}.overlay.editor-preview #preview-backdrop{display:block;position:absolute;inset:0;background:linear-gradient(120deg,#233f4a,#bac9c2)}.overlay .preview-window{position:absolute;left:12%;top:14%;width:28%;height:57%;border:20px solid rgba(179,220,226,.35);background:linear-gradient(140deg,#9bbbd0,#d1d8bd 50%,#709ba6)}.overlay .preview-window:before{content:"";position:absolute;left:47%;width:16px;height:100%;background:#b6cace}.overlay .preview-window:after{content:"";position:absolute;top:45%;height:16px;width:100%;background:#b6cace}.overlay .preview-floor{position:absolute;inset:80% 0 0;background:rgba(18,48,56,.35)}.overlay.editor-preview #panel{cursor:grab}.overlay.editor-preview #panel:active{cursor:grabbing}@keyframes message-in{from{transform:translateY(8px)}to{transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.overlay .message{animation:none}}

.overlay #glass-light{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;object-fit:fill}.overlay #stage[data-design=cards] #glass-light,.overlay #stage[data-design=wall] #glass-light{display:none}.overlay.obs-composited #glass,.overlay.obs-composited #glass-rim,.overlay.obs-composited #glass-light{display:none}.material-presets{margin-bottom:14px}

.overlay .badge-icon{display:inline-block;width:.72em;height:.72em;vertical-align:-.035em;margin-right:.22em;object-fit:contain;text-shadow:none}

.studio-nav{display:flex;gap:18px;align-items:center;margin-left:auto;margin-right:24px;font-size:13px}.studio-nav a{color:#bce1ed;text-decoration:none}.studio-nav a:hover{color:#fff}.studio-nav [hidden]{display:none}@media(max-width:700px){.studio-nav{gap:10px;margin:0 8px;font-size:11px}}