:root,:root[data-theme=forest],.palette-forest{--canvas:#f0efe8;--surface:#fcfaf5;--surface-raised:#e4e8de;--surface-hover:#d6ded2;--text:#293731;--secondary:#5b6860;--muted:#647069;--line:#d9ddd3;--accent:#38584e;--tint:#e1e8dd;--light-ochre:#d7bba4;--light-ink:#a2b5aa;--accent-detail:#ac7458;--card:var(--surface);--border:var(--line);--paper:var(--canvas);--on-accent:#fffdf7}
:root[data-theme=sky],.palette-sky{--canvas:#edf0f1;--surface:#fbfcfc;--surface-raised:#dee8ed;--surface-hover:#cfdee5;--text:#2b3841;--secondary:#586b77;--muted:#617380;--line:#d4dfe3;--accent:#3c6075;--tint:#dfe9ef;--light-ochre:#ddb5a3;--light-ink:#96baca;--accent-detail:#ac6652}
:root[data-theme=rose],.palette-rose{--canvas:#f3ece9;--surface:#fffaf7;--surface-raised:#ebdfdf;--surface-hover:#dfd0d4;--text:#40343d;--secondary:#75606c;--muted:#7c6972;--line:#e1d4d8;--accent:#765b70;--tint:#eadde5;--light-ochre:#d8ac94;--light-ink:#a6a6c2;--accent-detail:#b27853}
:root[data-theme=wheat],.palette-wheat{--canvas:#f2ede3;--surface:#fffaf0;--surface-raised:#e9dfcb;--surface-hover:#dfd0b4;--text:#3a352c;--secondary:#706452;--muted:#786d5b;--line:#dfd5c3;--accent:#746041;--tint:#eae0cc;--light-ochre:#d9b97b;--light-ink:#9eafa9;--accent-detail:#4c746d}
:root[data-theme=lake],.palette-lake{--canvas:#eceef3;--surface:#fafaff;--surface-raised:#dfe3ef;--surface-hover:#d1d9e8;--text:#30364a;--secondary:#5e6783;--muted:#68718a;--line:#d6dcea;--accent:#4b5b82;--tint:#dfe4f1;--light-ochre:#c9aaad;--light-ink:#a0b1cf;--accent-detail:#9a6b6d}
html,body{background:var(--canvas);color:var(--text)}.product-header{background:var(--surface);border-color:var(--line)}.product-nav a,.product-account a,.product-account summary{color:var(--secondary)}.product-nav a.active{background:var(--tint);color:var(--accent)}.brand-symbol{width:39px}.brand-wordmark{width:98px;height:52px}
#main :is(.page-head h1,.page-head h2,.card h2,.card h3,.identity-panel h2){color:var(--text)}#main :is(.card,.identity-panel,.conversation-main,.conversation-sidebar,.chat-bubble,.details-card){background:var(--surface);border-color:var(--line);color:var(--text)}#main :is(.muted,.page-head>p,.identity-panel .muted,.sender){color:var(--muted)}#main :is(input,textarea,select),dialog :is(input,textarea,select){background:var(--surface);border-color:var(--line);color:var(--text)}#main button.primary,dialog button.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}#main :is(button:not(.primary),.button:not(.primary)){border-color:var(--line)}.creation-content{background:var(--surface)}.creation-step h1,.creation-content label{color:var(--text)}.creation-choice{background:var(--surface);border-color:var(--line)}.creation-choice.selected{background:var(--tint);border-color:var(--accent)}.creation-choice strong,.creation-intro{color:var(--secondary)}.creation-progress .active{color:var(--accent)}.creation-progress .active b,.choice-symbol{background:var(--tint);color:var(--accent);border-color:var(--line)}.collection-scene,.landscape-hero{background:var(--canvas);border-color:var(--line)}.collection-scene h2,.landscape-hero h1{color:var(--text)}.collection-scene p,.landscape-hero p{color:var(--secondary)}.collection-scene::after{background:linear-gradient(90deg,var(--canvas) 0%,var(--canvas) 48%,transparent 64%)}.landscape-hero::before{background-image:linear-gradient(90deg,var(--canvas),transparent 28%),url('/assets/works/howl004.jpg')}.hero-shared::before{background-image:linear-gradient(90deg,var(--canvas),transparent 28%),url('/assets/works/mimi025.jpg')}.portrait-invitation,.story-path{background:var(--tint);border-color:var(--line)}.portrait-invitation h2,.portrait-invitation p,.story-path>div{color:var(--secondary)}
.theme-picker{position:relative}.theme-picker summary{cursor:pointer;list-style:none;padding:6px 10px;border:1px solid var(--line);border-radius:10px;font-size:12px;white-space:nowrap}.theme-picker summary::-webkit-details-marker{display:none}.theme-panel{position:absolute;top:calc(100% + 12px);right:0;width:370px;max-width:calc(100vw - 28px);padding:23px;background:var(--surface);border:1px solid var(--line);border-radius:22px;box-shadow:0 16px 48px #27392e24;z-index:90}.theme-panel h3{font-family:"Jingjie Serif",serif;font-size:20px;color:var(--text);margin:4px 0 16px}.theme-panel p{font-size:11px;line-height:1.6;color:var(--muted);margin:14px 0 0}.theme-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.theme-choice{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:5px;padding:13px;background:var(--canvas);border:1px solid var(--line);border-radius:13px;white-space:normal;text-align:left;color:var(--text)}.theme-choice strong{font-size:13px;color:var(--text)}.theme-choice small{font-size:10px;line-height:1.6;color:var(--secondary)}.theme-choice[aria-pressed=true]{outline:2px solid var(--accent);outline-offset:1px}.theme-check{display:none;position:absolute;right:10px;top:11px;font-size:13px;color:var(--accent)}.theme-choice[aria-pressed=true] .theme-check{display:block}.theme-swatch{display:flex;width:63px;height:17px;margin-bottom:4px;border:1px solid var(--line);border-radius:9px;overflow:hidden}.theme-swatch i{flex:1;background:var(--surface)}.theme-swatch i:first-child{background:var(--accent)}.theme-swatch i:last-child{background:var(--surface-raised)}.account-preferences h2{font-family:"Jingjie Serif",serif}.account-preferences .theme-choices{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:850px){.account-preferences .theme-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.product-account{gap:6px}.product-account>#personal-model-link{font-size:11px}.theme-panel{position:fixed;top:75px;right:14px;max-height:75vh;overflow:auto}.brand-wordmark{width:80px}.collection-scene::after{background:linear-gradient(var(--canvas) 0%,var(--canvas) 44%,transparent 65%)}}
@media(max-width:700px){.landscape-hero::before{background-image:linear-gradient(var(--canvas),transparent 32%),url('/assets/works/howl004.jpg')}.hero-shared::before{background-image:linear-gradient(var(--canvas),transparent 32%),url('/assets/works/mimi025.jpg')}}

#main .button.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.theme-choice:hover{background:var(--surface-raised);border-color:var(--accent)}

/* Palette surfaces: ambient canvas, tinted navigation and contrasting paper. */
.product-header{background:var(--canvas)}
.product-account .account-badge,.admin-menu-panel,.theme-panel{background:var(--surface);border-color:var(--line);color:var(--text)}
.product-nav a.active{background:var(--accent);color:var(--on-accent)}
.product-nav a:hover:not(.active),.admin-menu summary:hover,.admin-menu-panel a:hover{background:var(--surface-raised);color:var(--text)}
.world-backdrop{background:var(--canvas)}.world-distance{opacity:.12}.world-light,.world-mist{opacity:.12}
#main .chat-workspace{background:var(--canvas)}
#main .conversation-sidebar{background:var(--canvas);border-color:var(--line)}
#main .conversation-main,#main .conversation-header,#main .conversation-composer{background:var(--surface);border-color:var(--line)}
#main .conversation-feed{background:linear-gradient(145deg,var(--surface),var(--canvas))}
#main .conversation-item{background:transparent;color:var(--text)}
#main .conversation-item.selected,#main .conversation-item:hover{background:var(--surface-raised);color:var(--text)}
#main .chat-row.user .chat-bubble,#main .starter-option,#main .older-turns,#main .chat-connection-note,#main .chat-person-details{background:var(--tint);border-color:var(--line);color:var(--text)}
#main .conversation-composer form{background:var(--surface);border-color:var(--line)}
#main .conversation-composer form:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent)}
#main :is(.conversation-item small,.conversation-person-link,.chat-person small,.conversation-header small,.chat-welcome p,.chat-welcome small,.composer-toolbar small,.composer-footnote,.message-tools summary,.message-tools .copy-reply){color:var(--secondary)}
#main :is(.conversation-heading h2,.chat-person h2,.chat-welcome h2){color:var(--text)}
#main :is(.character-card-top,.identity-details,.interview-outline,.interview-context,.choice-question-panel,.collection-method,.person-tabs,.intake-tabs){background:var(--tint);border-color:var(--line)}
#main :is(.tag,.badge,.pill){background:var(--tint);color:var(--accent);border-color:var(--line)}
#main :is(.tabs,.person-tabs,.intake-tabs) :is(button,a).active{background:var(--accent);color:var(--on-accent)}
#main :is(.creation-choice.selected,.choice-option.selected){background:var(--tint);border-color:var(--accent)}
#main :is(button,.button):focus-visible{outline:3px solid var(--accent);outline-offset:3px}
html,body,.product-header,#main .conversation-sidebar,#main .conversation-feed{transition:background-color .25s,color .25s}
@media(prefers-reduced-motion:reduce){html,body,.product-header,#main .conversation-sidebar,#main .conversation-feed{transition:none}}

#main :is(button,.button){background:var(--surface);color:var(--text);border-color:var(--line)}
#main :is(button,.button):hover{background:var(--surface-raised);border-color:var(--accent)}
#main :is(button.primary,.button.primary){background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
#main :is(.conversation-item.selected,.choice-option.selected,.creation-choice.selected){background:var(--tint)}
#main :is(.person-nav,.pool-tabs) :is(a,button).active{background:var(--accent);color:var(--on-accent)}
#main .theme-choice{background:var(--canvas);color:var(--text)}#main .theme-choice:hover{background:var(--surface-raised)}
#main .brand-option:hover{background:var(--tint)}
