/* Classic light and dark palettes; artwork and brand assets retain their colors. */
.display{--ui-paper:#e6ebdf;--ui-surface:#edf2e5;--ui-raised:#f8faef;--ui-low:#d5dfc8;--ui-tile:#d2dcc8;--ui-ink:#26351f;--ui-muted:#405137;--ui-line:#849775;--ui-focus:#3a6327;--ui-accent:#41651e;--ui-accent-low:#2f4c16;--ui-highlight:#ffffffb8;--ui-shadow:#17241033;--ui-blade:#9cad90;--ui-ribbon:#ffffffa0;--ui-ribbon-2:#b9d08e55}
.display[data-color-mode=dark]{color-scheme:dark;--ui-paper:#152018;--ui-surface:#1c2a20;--ui-raised:#314233;--ui-low:#17231b;--ui-tile:#152219;--ui-ink:#f0f5e9;--ui-muted:#c2ceb9;--ui-line:#6b8061;--ui-focus:#b8dc7c;--ui-accent:#416527;--ui-accent-low:#2c491c;--ui-highlight:#ebffdf26;--ui-shadow:#0007;--ui-blade:#26362b;--ui-ribbon:#53704330;--ui-ribbon-2:#99bc6730}
body[data-color-mode=dark]{background:radial-gradient(ellipse at 50% 36%,#262d29,#101411 65%,#080c09)}
.display[data-custom=true]{--dash-text:var(--ui-ink);--dash-text-highlight:none;--section-ink:var(--ui-ink);--section-wash:var(--ui-surface);--section-tile:var(--ui-tile);--console-selection:linear-gradient(var(--ui-accent),var(--ui-accent-low));background:var(--ui-paper);color:var(--ui-ink)}
.display[data-custom=true] .wallpaper{background:radial-gradient(ellipse at 67% 28%,var(--ui-surface),var(--ui-paper) 74%)}
.display[data-custom=true] .wallpaper:before{background:radial-gradient(ellipse at 48% 93%,var(--ui-ribbon),transparent 72%);box-shadow:0 1px var(--ui-highlight)}
.display[data-custom=true] .wallpaper:after{background:linear-gradient(180deg,var(--ui-ribbon-2),transparent);box-shadow:0 -1px var(--ui-highlight)}
.display[data-custom=true] :is(.brand,.brand-text,.profile-trigger,.profile-trigger .profile-name,.profile-trigger small,.library-heading h1,.deck-caption p,.counter,.project-toolbar button,#gallery-count,.project-intro h2,.work-caption strong,.project-end,.project-end button,.profile-content h2,.profile-content h3,.profile-content p,.profile-bio,.experience strong,.experience span,.experience small,.profile-email,.gamer-card h2,.gamer-card p,.gamer-card .text-link,.gamer-card .gamer-status,.viewer-top h2,.viewer-top button,.viewer-info,.viewer-info p,.viewer-info small,.viewer-links a,.artwork-loader,.artwork-error,.controller-action,.settings button){color:var(--ui-ink);text-shadow:none}
.display[data-custom=true] :is(.profile-trigger small,.deck-caption p,#gallery-count,.profile-content p,.experience span,.viewer-info small){color:var(--ui-muted)}
.display[data-custom=true] :is(.profile-trigger,.profile-menu,.library-switch,.arrow,.work-zoom,.project-end button,.artwork-error button,.resume-portrait){background:linear-gradient(var(--ui-raised),var(--ui-low));border-color:var(--ui-line);box-shadow:inset 0 1px var(--ui-highlight),0 2px 4px var(--ui-shadow);color:var(--ui-ink)}
.display[data-custom=true] :is(.profile-menu strong,.profile-menu p){color:var(--ui-ink)}
.display[data-custom=true] .profile-menu button{background:var(--console-selection);border-color:var(--ui-line);color:#fff;text-shadow:none}
.display[data-custom=true] .library-switch button{color:var(--ui-muted)}
.display[data-custom=true] .library-switch button[aria-selected=true]{background:var(--ui-raised);color:var(--ui-ink);box-shadow:0 1px 3px var(--ui-shadow),inset 0 1px var(--ui-highlight)}
.display[data-custom=true] .gallery-filters button{background:linear-gradient(var(--ui-raised),var(--ui-low));color:var(--ui-ink);border-color:var(--ui-line);box-shadow:inset 0 1px var(--ui-highlight)}
.display[data-custom=true] .gallery-filters button[aria-pressed=true]{background:var(--console-selection);color:#fff;border-color:var(--ui-focus);box-shadow:inset 0 1px var(--ui-highlight),0 0 0 1px var(--ui-focus)}
.display[data-custom=true] .gamer-card{background:linear-gradient(145deg,var(--ui-raised),var(--ui-surface) 60%,var(--ui-low));border-color:var(--ui-line);box-shadow:inset 0 1px var(--ui-highlight),0 5px 12px var(--ui-shadow)}
.display[data-custom=true] :is(.experience,.project-toolbar,.project-end,.bottom-bar){border-color:var(--ui-line);box-shadow:none}
.display[data-custom=true] .experience small{background:var(--ui-low);border-color:var(--ui-line)}
.display[data-custom=true] .viewer{background:var(--ui-surface)}
.display[data-custom=true] .work-media{background:var(--ui-tile);border-color:var(--ui-line);box-shadow:inset 0 1px var(--ui-highlight)}
.display[data-custom=true] :is(.blade-button,.right-blade){background:linear-gradient(90deg,var(--ui-low),var(--ui-blade) 50%,var(--ui-raised) 75%,var(--ui-low));border-color:var(--ui-line);box-shadow:3px 0 8px var(--ui-shadow)}
.display[data-custom=true] .blade-button span{color:var(--ui-muted);text-shadow:none}
.display[data-custom=true] .blade-button[aria-current=true] span{background:linear-gradient(90deg,var(--ui-accent-low),var(--ui-accent));color:#fff;box-shadow:inset 1px 0 var(--ui-highlight)}
.display[data-custom=true] .case-label{background:linear-gradient(var(--ui-raised),var(--ui-low));border-color:var(--ui-line)}
.display[data-custom=true] .case-label :is(strong,small){color:var(--ui-ink);text-shadow:none}
.display[data-custom=true] .game-case[aria-current=true] .case-label{background:var(--console-selection)}
.display[data-custom=true] .game-case[aria-current=true] .case-label :is(strong,small){color:#fff}
.display[data-custom=true] :is(.project-view,.profile-view,.profile-content){scrollbar-color:var(--ui-line) var(--ui-low)}
.display[data-custom=true] :is(button:focus-visible,a:focus-visible),.keyboard-navigation .display[data-custom=true] :is(button:focus,a:focus){outline-color:var(--ui-focus)}
.display[data-custom=true] .work-item:focus-visible .work-media,.keyboard-navigation .display[data-custom=true] .work-item:focus .work-media{box-shadow:0 0 0 2px var(--ui-paper),0 0 0 4px var(--ui-focus)}
.display[data-custom=true] .settings button:hover{background:var(--ui-raised)}
.display[data-custom=true] .boot-account{background:radial-gradient(ellipse at 50% 35%,var(--ui-surface),var(--ui-paper))}
.display[data-custom=true] .boot-account :is(h1,p){color:var(--ui-ink)}
.display[data-custom=true] .boot-screen:is([data-phase=waiting],[data-phase=loading]) .boot-controls button{background:var(--ui-surface);color:var(--ui-ink);border-color:var(--ui-line)}
.display[data-custom=true] ::selection{background:var(--ui-accent);color:#fff}
.work-item:hover .work-media img{filter:none}
/* Quiet transitions for changing content, without staggering entire image collections. */
.project-view,.profile-view{animation:panel-arrive 240ms cubic-bezier(.16,1,.3,1)}
.work-grid{animation:gallery-arrive 170ms cubic-bezier(.16,1,.3,1)}
.viewer-image img{animation:artwork-arrive 180ms ease-out}
@keyframes panel-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes gallery-arrive{from{opacity:.65;transform:translateY(3px)}to{opacity:1;transform:none}}
@keyframes artwork-arrive{from{opacity:.35}to{opacity:1}}
.motion-off :is(.project-view,.profile-view,.work-grid,.viewer-image img){animation:none}
@media(prefers-reduced-motion:reduce){.project-view,.profile-view,.work-grid,.viewer-image img{animation:none}}

.display[data-custom=true] .settings button[aria-pressed=true]{background:var(--ui-raised);color:var(--ui-ink);box-shadow:inset 0 0 0 1px var(--ui-line);border-radius:3px}
.display[data-custom=true] .artwork-loader svg{stroke:var(--ui-muted)}
.display[data-custom=true] .boot-account>button{background:var(--console-selection);color:#fff;border-color:var(--ui-line);box-shadow:inset 0 1px var(--ui-highlight),0 3px 7px var(--ui-shadow);text-shadow:none}

#appearance-toggle{min-width:58px;display:inline-flex;flex-direction:column;justify-content:center;align-items:center;gap:5px}
#appearance-toggle .mode-switch{width:30px;height:17px;border:1px solid var(--ui-line);border-radius:12px;background:var(--ui-low);position:relative;display:block}
#appearance-toggle .mode-switch:after{content:'';position:absolute;top:2px;left:2px;width:11px;height:11px;border-radius:50%;background:var(--ui-ink);transition:transform 180ms cubic-bezier(.16,1,.3,1)}
#appearance-toggle[aria-checked=true] .mode-switch{background:var(--ui-accent)}
#appearance-toggle[aria-checked=true] .mode-switch:after{transform:translateX(13px);background:#fff}
@media(max-width:700px) and (orientation:portrait){.display[data-custom=true] .blade-links:after{background:linear-gradient(90deg,var(--ui-low),var(--ui-blade),var(--ui-raised));box-shadow:3px 0 8px var(--ui-shadow)}}
.motion-off #appearance-toggle .mode-switch:after{transition:none}
@media(prefers-reduced-motion:reduce){#appearance-toggle .mode-switch:after{transition:none}}

#appearance-toggle .setting-label{display:block;font-size:11px;line-height:1.1}
/* The switch and its single-line label must fit the desktop footer as well as touch controls. */
#appearance-toggle{width:64px;min-width:64px;height:40px;min-height:40px;padding:0;gap:4px;flex-shrink:0}
#appearance-toggle .mode-switch{flex-shrink:0}
#appearance-toggle .setting-label{white-space:nowrap}