*{box-sizing:border-box}body{margin:0;background:#0b0e14;color:#eee9df;font:14px/1.55 system-ui,sans-serif}button,select,textarea{font:inherit}button,a,select{touch-action:manipulation}button{cursor:pointer;border:1px solid #ffffff25;background:#ffffff06;color:inherit;border-radius:9px;padding:9px 13px}button:hover{background:#ffffff0e;border-color:#bfa87580}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #cfba89;outline-offset:3px}a{color:#d6bf87;text-underline-offset:4px}select{background:#151a24;color:#eee9df;border:1px solid #ffffff25;border-radius:8px;padding:8px;max-width:100%}textarea{background:#111620;color:#eee9df;border:1px solid #ffffff25;border-radius:12px;padding:16px;resize:vertical;width:100%;line-height:1.6}textarea::placeholder{color:#717887}[hidden]{display:none!important}.topbar{height:76px;padding:0 30px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12;gap:16px}.brand{font:23px Georgia,serif;text-decoration:none;white-space:nowrap;letter-spacing:.05em}.brand span{font:12px system-ui;color:#a4a9b4;letter-spacing:.02em}.connection{display:flex;align-items:center;gap:10px}.workshop{display:grid;grid-template-columns:245px minmax(0,1fr);min-height:calc(100dvh - 76px)}.library{padding:26px 20px;border-right:1px solid #ffffff12;display:flex;flex-direction:column;gap:12px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:6px}.section-head h1{font:24px Georgia;margin:0}.section-head button{font-size:22px;line-height:1}.muted{color:#8e95a3;font-size:12px;margin:0}.library-bottom{margin-top:auto;display:grid;gap:8px;padding-top:30px}.library-item{width:100%;text-align:left;display:block;margin:8px 0;padding:13px}.library-item.active{border-color:#baa573;background:#bfa87512}.library-item strong{font-weight:500;display:block;overflow:hidden;text-overflow:ellipsis}.library-item small{font-size:11px;color:#8e95a3}.builder{padding:32px clamp(22px,4vw,65px);max-width:1450px;width:100%;margin:auto}.eyebrow{font:10px ui-monospace,monospace;letter-spacing:.18em;color:#bda779}.builder-heading h2{font:40px/1.1 Georgia,serif;font-weight:400;letter-spacing:-.03em;margin:12px 0}.builder-heading p{color:#9ea5b2;margin:0 0 24px;max-width:700px}.starters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:22px 0 30px}.starters button{text-align:left;padding:17px;font:18px Georgia;min-height:110px}.starters span{display:block;font:10px ui-monospace,monospace;color:#bda779;margin-bottom:10px}.starters small{display:block;font:12px system-ui;color:#8e95a3;margin-top:9px}#build-form label{display:block;font-size:12px;color:#c7c4bb;margin-bottom:9px}.build-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:10px}.build-actions span{margin-right:auto;font-size:12px;color:#9ba4b3}#build,#save:not(:disabled){background:#c6ae79;color:#11151c;border-color:#c6ae79}#error{color:#efb5aa;background:#b3453012;border:1px solid #b3453035;padding:12px;border-radius:9px}.editor-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:28px;margin-bottom:12px}.tabs{display:flex;gap:4px}.tabs button{border-color:transparent;color:#8c95a4}.tabs button[aria-pressed=true]{background:#ffffff09;color:#eee9df}.save-actions{display:flex;gap:7px}.stage{height:480px;min-height:320px;border:1px solid #ffffff20;border-radius:15px;overflow:hidden;background:#10151f;position:relative}.stage iframe{display:block;width:100%;height:100%;border:0;background:#fff}.stage #code{display:block;width:100%;height:100%;resize:none;border:0;border-radius:0;background:#0c111b;font:12px/1.7 ui-monospace,Consolas,monospace;tab-size:2}#empty{height:100%;display:grid;align-content:center;justify-items:center;color:#667186}#empty span{font:40px Georgia;color:#b5a37d66}#empty p{font:18px Georgia}.stage-footer{display:flex;align-items:center;gap:16px;margin-top:12px;color:#8d96a6;font-size:11px}.stage-footer>span{margin-right:auto}.stage-footer select{font-size:11px;padding:4px;margin-left:5px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}dialog{background:#131925;color:#eee9df;border:1px solid #bca77760;border-radius:18px;max-width:560px;width:calc(100% - 36px);padding:26px;line-height:1.7}dialog::backdrop{background:#0009;backdrop-filter:blur(5px)}.dialog-head{display:flex;justify-content:space-between;align-items:center}.dialog-head h2{font:30px Georgia;margin:0}.dialog-head button{border:0;font-size:24px}dialog li{padding:6px 0}dialog .muted{margin-top:20px}.local-link{display:inline-block;margin:10px 0}@media(max-width:800px){.topbar{height:auto;min-height:76px;padding:18px;flex-wrap:wrap}.connection{flex:1;justify-content:flex-end;gap:6px}.workshop{grid-template-columns:1fr}.library{border-right:0;border-bottom:1px solid #ffffff12;padding:18px}.library .section-head h1{font-size:22px}.library-bottom{margin:0;padding:0;display:flex}.library-list{display:flex}.library-item{display:inline-block;width:auto;margin-right:8px}.builder{padding:26px 18px}.builder-heading h2{font-size:34px}.starters{gap:8px}.starters button{font-size:16px;padding:12px}.editor-toolbar{flex-wrap:wrap}.save-actions{gap:5px}.save-actions button{font-size:12px;padding:8px}.stage{height:460px}.build-actions{flex-wrap:wrap}.build-actions span{width:100%}.stage-footer{flex-wrap:wrap}}

.codex-settings{display:flex;gap:12px 20px;flex-wrap:wrap;margin:16px 0 20px}.codex-settings label{display:flex;align-items:center;gap:12px;font-size:12px;min-width:0}.codex-settings select{max-width:100%;min-height:44px;border-radius:24px;background:#ffffff08}.codex-settings p{flex-basis:100%;font-size:12px;color:#b0b8c3;margin:0}.codex-settings:has(label[hidden]):not(:has(label:not([hidden]))){display:none}

/* Shared palette with the workspace editor; opaque gadget previews keep their own theme. */
:root{color-scheme:dark;--bg:#101319;--ink:#f3efe6;--ink-soft:#d0c9bd;--gold:#d0b77f;--line:rgba(233,222,200,.2);--line-strong:rgba(233,222,200,.4);--panel:rgba(7,8,10,.38);--wash:rgba(10,16,25,.77);--field:rgba(7,8,10,.18);--active:rgba(222,205,164,.1);--option:#18202a;--error:#efb8ab}
:root[data-theme="light"]{color-scheme:light;--bg:#e3e3dc;--ink:#202c35;--ink-soft:#46515b;--gold:#745b2c;--line:rgba(62,51,35,.2);--line-strong:rgba(62,51,35,.4);--panel:rgba(248,245,235,.38);--wash:rgba(232,236,229,.84);--field:rgba(247,245,235,.22);--active:rgba(171,145,92,.12);--option:#eeeae0;--error:#873b30}
html{background:var(--bg)}body{min-height:100svh;isolation:isolate;background:transparent;color:var(--ink);font:300 18px/1.6 'Newsreader',Georgia,serif}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(var(--wash),var(--wash)),url('/assets/landing/world/media/ozymandias-v4-r1-poster.webp') center/cover}
.builder-heading h2,.section-head h1,.starters button{font-family:'Newsreader',Georgia,serif;font-weight:300}
.starters small,.brand span{font-family:'DM Mono',ui-monospace,monospace}
.builder-heading p{font-size:18px}.builder-heading h2{font-size:40px}.brand{font-family:'Newsreader',Georgia,serif}
.topbar{font-family:'DM Mono',ui-monospace,monospace;font-size:12px}
.starters button{border-radius:24px}
a,.eyebrow,.starters span{color:var(--gold)}
button,select,.codex-settings select{min-height:44px;border-radius:999px;background:var(--field);border-color:var(--line);color:var(--ink)}
button,select,label,.muted,.stage-footer,.build-actions,.codex-settings p{font-family:'DM Mono',ui-monospace,monospace;font-size:12px}
button:hover:not(:disabled),select:hover{background:var(--active);border-color:var(--line-strong)}
button:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:var(--gold)}
button,select,a{transition:background .3s,border-color .3s,color .3s}
option{background:var(--option);color:var(--ink)}
textarea,.stage #code{background:var(--field);color:var(--ink);border-color:var(--line)}
textarea{border-radius:22px}
textarea::placeholder{color:var(--ink-soft);opacity:1}
.brand span,.muted,.library-item small,.builder-heading p,.starters small,#build-form label,.build-actions span,.stage-footer,.codex-settings p,#empty{color:var(--ink-soft)}
.topbar,.library,.stage,.editor-toolbar{border-color:var(--line)}
.library-item.active,.tabs button[aria-pressed="true"]{background:var(--active);border-color:var(--line-strong);color:var(--ink)}
.tabs button[aria-pressed="false"]{color:var(--ink-soft)}
.stage{background:var(--field);border-radius:24px}
#build,#save:not(:disabled){background:var(--active);border-color:var(--gold);color:var(--ink)}
#error{color:var(--error);background:var(--field);border-color:var(--line)}
.topbar{height:auto;min-height:76px;flex-wrap:wrap;padding:16px 30px}.brand{margin-right:auto}
.connection,.save-actions,.stage-footer,.build-actions{flex-wrap:wrap}
#theme-toggle{width:44px;flex:0 0 44px;padding:0;display:grid;place-items:center}
#theme-toggle svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.2}
dialog{color:var(--ink);background:var(--panel);border:1px solid var(--line-strong);border-radius:28px;backdrop-filter:blur(12px);padding:28px;max-height:calc(100dvh - 32px);overflow:auto}
dialog::backdrop{background:rgba(7,8,10,.3)}
.dialog-head{display:flex;gap:20px;align-items:center;justify-content:space-between}
.dialog-head h2{font:300 30px/1.2 Newsreader,Georgia,serif;margin:0}
.dialog-head button{width:44px;flex:0 0 44px;padding:0;font-size:24px}
#share-title{font-weight:500;overflow-wrap:anywhere}
#share-space{width:100%;margin:8px 0}
#share-form>label{display:block;margin-top:24px;color:var(--ink-soft)}
#share-status{min-height:3em;color:var(--ink-soft);font-size:16px}
#share-result{display:block;min-height:44px;overflow-wrap:anywhere}
.share-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:24px}
.share-actions a{display:inline-flex;align-items:center;min-height:44px}
@media(max-width:800px){.topbar{padding:14px 18px;gap:12px}.connection{width:100%}.connection select{flex:1;min-width:0}.builder{min-width:0}.save-actions{display:flex;gap:8px}.stage-footer{gap:12px}.starters{grid-template-columns:1fr}.starters button{min-height:80px;border-radius:22px}.builder-heading h2{overflow-wrap:anywhere}.library-bottom{padding-top:8px}.build-actions button{flex:1}.build-actions span{flex-basis:100%}textarea,.stage #code,select{font-size:16px}dialog{padding:22px}.share-actions{align-items:stretch;flex-direction:column}}
@media(prefers-reduced-motion:reduce){button,select,a{transition:none}}

@media(prefers-reduced-motion:no-preference){dialog[open]{animation:workshop-reveal .35s cubic-bezier(.22,1,.36,1)}@keyframes workshop-reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}}
@font-face{font-family:Newsreader;src:url('/assets/fonts/newsreader/Newsreader-LatinExt.woff2') format('woff2');font-style:normal;font-weight:200 800;font-display:swap}
@font-face{font-family:'DM Mono';src:url('/assets/fonts/dm-mono/DMMono-Regular.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}

#keep-panel{margin:22px 0;padding:16px 20px;border:1px solid var(--line);border-radius:24px;background:var(--field)}#keep-panel summary{cursor:pointer;min-height:44px;color:var(--gold);font:12px/1.6 'DM Mono',monospace;display:flex;align-items:center}#keep-panel label{display:block;margin:12px 0}#keep-panel .muted{margin:12px 0}#workspace-return{max-width:1100px}.return-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.return-columns label{min-width:0}.return-columns textarea{height:180px;resize:vertical}#workspace-return textarea{font:12px/1.7 'DM Mono',monospace;margin:10px 0}#workspace-return label{display:block;color:var(--ink-soft)}#return-apply{margin-top:20px}@media(max-width:750px){.return-columns{grid-template-columns:1fr}.return-columns textarea{height:120px}.save-actions{gap:8px}}

#build-review{padding:20px;border:1px solid var(--line);border-radius:24px;background:var(--field);margin:20px 0}#build-review summary,#return-changes summary{min-height:44px;cursor:pointer;color:var(--gold)}summary:focus-visible{outline:2px solid var(--gold);outline-offset:4px}.build-comparison{display:grid;grid-template-columns:1fr 1fr;gap:16px}.build-comparison textarea{height:160px;font:12px/1.7 'DM Mono',monospace}#build-review label{display:block}#build-rule-checks label{display:flex;align-items:center;gap:12px;min-height:44px;color:var(--ink-soft);margin:8px 0}#build-rule-checks input{width:20px;height:20px;accent-color:var(--gold)}#return-changes details{margin:12px 0;padding:16px;border:1px solid var(--line);border-radius:22px}#return-changes pre{max-height:180px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.7 'DM Mono',monospace;color:var(--ink);background:var(--field);padding:12px;border-radius:16px}@media(max-width:750px){.build-comparison{grid-template-columns:1fr}}
