@import url('https://fonts.googleapis.com/css2?family=Fraunces:wght@500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
@font-face{font-family:RanchNunito;src:url('/fonts/nunito.ttf') format('truetype');font-weight:200 1000;font-style:normal;font-display:swap}
/* Shared interface language. Scene artwork and asset palettes stay independent. */
:root{--app-font:Manrope,'Trebuchet MS','Segoe UI',Arial,sans-serif;--app-heading:Fraunces,Georgia,serif;--app-paper:#fffcf0;--app-ink:#4c4330;--app-muted:#797058;--app-accent:#b64932;--app-border:#ded5b2;--app-radius:16px;--app-focus:#b64932}
html,body{font-family:var(--app-font)!important;color:var(--app-ink);-webkit-font-smoothing:antialiased}
body :is(button,input,textarea,select,option,label,summary,p,small,.nav-link,.eyebrow,.meta,.caption,.hint,.info,.controls,.actions,.intro,.scene-note,.tile-copy,.footer,.badge){font-family:var(--app-font)!important}
body :is(h1,h2,h3,h4,.brand strong,.app-controls-heading h2,.navigation-settings-heading h2){font-family:var(--app-heading)!important;font-weight:700;letter-spacing:-.025em;line-height:1.18}
body h1{font-size:clamp(23px,2.2vw,32px)}body h2{font-size:21px}body h3{font-size:17px}body p{line-height:1.55}
body :is(button,select,input,textarea){font-size:14px;line-height:1.35}body button{font-weight:600;border-radius:var(--app-radius);min-height:44px;transition:background-color .15s,box-shadow .15s}
body :is(select,input:not([type=range]):not([type=checkbox]):not([type=color]),textarea){border:1px solid var(--app-border);border-radius:12px;background:var(--app-paper);color:var(--app-ink);padding:10px 12px}
body :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--app-focus);outline-offset:3px}
body button:disabled{opacity:.5;cursor:default}body :is(.primary,button.action){background:var(--app-accent);color:var(--app-paper)}
body :is(header,#left-navigation,#app-controls,#navigation-settings-drawer,.app-controls-heading){background:var(--app-paper);color:var(--app-ink);border-color:var(--app-border)}
body header{box-shadow:0 2px 10px #344b3006}body header .brand strong{font-size:20px}body header .brand .ranch-brand-logo{width:52px;height:52px;object-fit:contain}
body #left-navigation .nav-link,body .nav-3d-group summary{font-family:var(--app-font);font-size:13px;min-height:44px;border-radius:12px;line-height:20px;display:flex;align-items:center}
body #left-navigation .nav-link[aria-current=page]{background:#f4edcf;color:#4c4330;box-shadow:inset 3px 0 #b64932}
body .nav-title{color:var(--app-muted);font-size:10px;letter-spacing:.6px;min-height:38px}
body #app-controls{font-family:var(--app-font);border-radius:22px 0 0 22px;box-shadow:-8px 0 32px #344b3012}
body .app-controls-heading{padding:16px 18px}body .app-controls-heading h2{font-size:20px}body #app-controls-content{gap:20px;padding:18px}
body #app-controls :is(button,select){border:1px solid var(--app-border);border-radius:14px}body #app-controls button[aria-pressed=true]{background:var(--app-accent);color:var(--app-paper)}
body #app-controls :is(.filters,.actions,.subjects,#states){gap:8px}body #app-controls small,body .meta{color:var(--app-muted)}
body #app-controls-toggle{background:#f4edcf;border:1px solid #ded5b2;color:#4c4330;padding:10px 16px}body #nav-toggle{background:#f4edcf;border:1px solid var(--app-border)}
body .brand-story{display:flex;align-items:center;gap:28px;padding:28px;background:#f4eddb}body .brand-story img{width:min(240px,38%);height:auto}body .brand-story h2{font-size:30px}body .brand-story p{max-width:440px;color:var(--app-muted)}
body .brand-palette{display:flex;gap:8px}body .brand-palette i{width:26px;height:26px;border-radius:50%;border:1px solid #0001}
body.drawer-layout.nav-collapsed main:not(#scene):not(#stage):not(.specimen-main){margin-left:0!important}
@media(max-width:799px){body header .brand strong{font-size:16px!important}body header .brand .ranch-brand-logo{width:42px!important;height:42px!important}body #app-controls{border-radius:22px 0 0 22px}body #app-controls-toggle{font-size:12px;padding:9px 11px}body h1{font-size:24px}body h2{font-size:20px}body .brand-story{gap:16px;padding:18px;align-items:flex-start}body .brand-story h2{font-size:21px}body .brand-story p{font-size:13px}}
@media(prefers-reduced-motion:reduce){body button{transition:none}}

body>header{height:76px;min-height:76px;padding:10px 22px}body .eyebrow{font-size:10px;letter-spacing:1.3px;font-weight:700;color:var(--app-muted)}
@media(max-width:799px){body>header{height:68px;min-height:68px;padding:8px 12px}body #stage,body #scene{height:calc(100dvh - 68px)}}

body #app-controls-toggle{width:auto;flex-shrink:0}body #app-controls-close{min-width:44px}body header .brand{min-width:0}

/* Keep navigation labels clearly legible across desktop and mobile. */
body #left-navigation :is(.nav-link,summary,#nav-settings),body #navigation-settings-drawer .nav-link{font-weight:700}

/* Rounded, chunkier shared game typography. */
body{font-weight:650}body :is(h1,h2,h3,h4,.brand strong){font-weight:900!important}body :is(button,summary,.nav-link){font-weight:800}body #intent-bubbles .intent-bubble{font-weight:750;font-size:12px}body #intent-bubbles .intent-bubble strong{font-weight:900;font-size:14px}

/* Sunroom is the shared application default, including the Sandbox workspaces. */
:root{--app-canvas:#f4edcf;--app-on-accent:#fffdf4}
body{font-weight:500;background:var(--app-canvas)}
body :is(h1,h2,h3,h4,.brand strong){font-weight:600!important}
body :is(button,summary,.nav-link){font-weight:600}
body header :is(.ranch-brand-logo,.seal){display:none!important}
body :is(button,select,input,textarea){color:var(--app-ink);border-color:var(--app-border)}
body button{background:var(--app-paper)}
body button:hover{background:var(--app-canvas)}
body :is(button.primary,button.action,button[aria-pressed=true]){background:var(--app-accent);color:var(--app-on-accent);border-color:var(--app-accent)}
body :is(#create-drawer,#deck-drawer,#scene-workbench,#scene-browser,#scene-browser-dialog,.drawer-head,.deck-card,.gauge,#inertia-layers>summary,#inertia-layers fieldset,#sandbox-tools button,#drawer-toggle,#deck-toggle){background:var(--app-paper);color:var(--app-ink);border-color:var(--app-border)}
body :is(.board-heading,.brand,#selection-name){color:var(--app-ink)}
body :is(.board-heading h1,#selection-name,.drawer-head h2,.deck-heading h2){font-family:var(--app-heading)}
body input[type=range],body input[type=checkbox]{accent-color:var(--app-accent)}
body.board3{--b3-panel:#fffcf0;--b3-text:#4c4330;--b3-quiet:#797058;--b3-gold:#b64932;background:var(--app-canvas)}
body.board3 :is(button,input,select){background:var(--app-paper);color:var(--app-ink);border-color:var(--app-border)}
body.board3 button:hover{background:var(--app-canvas)}
body.board3 button[aria-pressed=true]{background:var(--app-accent);color:var(--app-on-accent);border-color:var(--app-accent)}
body.board3 :is(#b3-identity,#b3-feedback){color:var(--app-ink);text-shadow:0 1px 7px var(--app-paper)}
body.board3 :is(#b3-navigation,#create-drawer,#b3-tools,#deck-drawer,#scene-workbench){border-color:var(--app-border)}
body.board3 :is(#b3-identity h1,.b3-drawer-head h2,#b3-context h2){font-family:var(--app-heading)}

/* Selected tool styles outrank legacy per-tool ID rules. */
body button[aria-pressed=true],body button.primary,body button.action{background:var(--app-accent)!important;color:var(--app-on-accent)!important;border-color:var(--app-accent)!important}