/* Visual System v1. Semantic tokens stay stable when creature references change. */
@font-face{font-family:OppBubble;src:url('/fonts/Kavoon-Regular.ttf') format('truetype');font-display:swap}
body.visual-v1{
 --v-ink:#23382f;--v-muted:#586b60;--v-paper:#fffaf3;--v-surface:#fff;
 --v-shell:#e8efe3;--v-line:#d5ddd2;--v-control-line:#758879;
 --v-action:#c5f4b3;--v-pink:#f8b7d0;--v-water:#a7d6bf;
 --v-hover:#edf5e7;--v-radius:14px;--v-world-radius:36px;--v-space:8px;
 --v-body:OppPlex,Arial,sans-serif;--v-display:OppBubble,OppPlex,Arial,sans-serif;
 background:var(--v-paper);color:var(--v-ink);font-family:var(--v-body);
}
body.visual-v1[data-companion]{
 --opp-base:var(--v-paper);--opp-panel:var(--v-surface);--opp-surface:var(--v-surface);
 --opp-surface-hover:var(--v-hover);--opp-surface-line:var(--v-line);--opp-on-surface:var(--v-ink);
 --opp-primary:var(--v-action);--opp-on-primary:var(--v-ink);--opp-accent:var(--v-ink);
 --opp-muted:var(--v-muted);--opp-light:var(--v-ink);--opp-line:var(--v-line);--opp-link:var(--v-ink);

}
body.visual-v1 :is(button,input,textarea,select){font-family:var(--v-body)}
/* Outrank legacy themed workspace/modal rules, including their important outlines. */
body.visual-v1 :is(a,button,input,textarea,select,summary,[tabindex]):focus-visible,
body.visual-v1.art-pass.lagoon-pass[data-companion] :is(a,button,input,textarea,select,summary,[tabindex]):focus-visible,
body.visual-v1.art-pass.lagoon-pass[data-companion] :is(.product-workspace,#modal) :is(a,button,input,textarea,select,summary,[tabindex]):focus-visible{outline:2px solid var(--v-ink)!important;outline-offset:3px!important}
body.visual-v1 :is(.btn,.v20-cta,.feature-tour-tabs button,.tour-playback){min-height:44px;border-radius:12px!important;box-shadow:none!important;font-size:15px;transition:background-color 140ms,border-color 140ms}
body.visual-v1 :is(.btn.green,.btn.black,.v20-cta){background:var(--v-action)!important;color:var(--v-ink)!important;border:1px solid var(--v-control-line)!important}
body.visual-v1 .btn.pink{background:var(--v-pink)!important;color:var(--v-ink)!important}
body.visual-v1 .btn:disabled{opacity:.55;cursor:not-allowed}
body.visual-v1 :is(.brand,.companion-logo){flex-shrink:0}
body.visual-v1 .companion-logo,body.visual-v1 .brand>img{width:40px!important;height:40px!important;aspect-ratio:1!important;object-fit:contain!important;flex:0 0 40px}
body.visual-v1 [data-creature-slot]{display:block;min-width:0}
body.visual-v1 [data-creature-slot]>.companion-atlas{display:block;width:100%;height:auto!important;aspect-ratio:var(--atlas-ratio)!important}
body.visual-v1 .companion-atlas{position:relative;overflow:hidden;clip-path:var(--creature-clip,none)!important}
body.visual-v1 .companion-atlas>img{position:absolute;max-width:none!important;max-height:none!important;object-fit:fill!important}
body.visual-v1 .companion-cutout{width:100%;height:auto;object-fit:contain}
/* Landing: retained copy and examples, expressive worlds with contained illustrations. */
body.visual-v1 .v20-home{--ink:var(--v-ink);--paper:var(--v-paper);--muted:var(--v-muted);background:var(--v-paper);color:var(--v-ink)}
body.visual-v1 .v20-home .v20-header{background:var(--v-paper)!important;color:var(--v-ink)!important;border:0!important;padding:20px 5vw!important;min-height:84px}
body.visual-v1 .v20-home .brand{font:24px var(--v-display)!important;color:var(--v-ink)!important;text-transform:none;letter-spacing:0}
body.visual-v1 .v20-home .v20-header a{color:var(--v-ink)}
body.visual-v1 .v20-home .hero{background:#e3f0ce!important;color:var(--v-ink);margin:12px 24px 0;border-radius:var(--v-world-radius);min-height:600px!important;padding:60px 5vw!important;display:grid;grid-template-columns:1.1fr 1fr;gap:32px;align-items:center;isolation:isolate}
body.visual-v1 .v20-home .hero:after{display:none!important}
body.visual-v1 .v20-home :is(.hero-desk,.swamp-butterflies,.hero-butterflies){display:none!important}
body.visual-v1 .v20-home .hero-copy{position:relative!important;width:auto!important;max-width:620px!important;inset:auto!important}
body.visual-v1 .v20-home .hero-copy h1,body.visual-v1 .v20-home .hero-copy h1 .blackletter{font-family:var(--v-display)!important;font-weight:400!important;letter-spacing:-.025em!important;font-size:clamp(38px,4.5vw,70px)!important;line-height:1.12!important;color:var(--v-ink)!important;text-transform:none}
body.visual-v1 .v20-home .hero-copy .live-copy{margin:24px 0 0!important;padding:0;max-width:470px}
body.visual-v1 .v20-home .live-copy p{color:var(--v-ink)!important;font-size:18px;line-height:1.65}
body.visual-v1 .v20-home .hero-art{position:relative!important;inset:auto!important;transform:none!important;width:100%!important;max-width:570px;height:auto!important;margin:0!important;padding:28px;background:var(--v-pink);border-radius:50%;z-index:1}
body.visual-v1 .v20-home .hero-art>[data-creature-slot]{width:100%}
body.visual-v1 .v20-home .hero-art .companion-atlas{height:auto!important;aspect-ratio:var(--atlas-ratio)!important}
body.visual-v1 .v20-home :is(h2,h3){text-transform:none;letter-spacing:-.02em;color:var(--v-ink)!important}
body.visual-v1 .v20-home :is(.crew,.intro-video,.landing-employers,.v40-resume,.v40-follow,.v40-extension){background:var(--v-paper)!important;color:var(--v-ink)!important}
body.visual-v1 .v20-home :is(.crew-head h2,.v40-copy h2,.v40-ending h2){font-family:var(--v-display)!important;font-weight:400!important;line-height:1.2}
body.visual-v1 .v20-home :is(.v40-copy h2 em,.v40-follow h2 em,.v40-resume h2 em){font:inherit!important;color:inherit!important}
body.visual-v1 .v20-home :is(.v40-ending,footer){background:var(--v-shell)!important;color:var(--v-ink)!important}
body.visual-v1 .v20-home .specimens{border:0!important;border-radius:var(--v-world-radius)!important;background:var(--v-shell)!important;gap:24px;padding:32px!important}
body.visual-v1 .v20-home .specimens .evolution-art{height:220px!important;align-items:center!important;overflow:hidden!important}
body.visual-v1 .v20-home .specimens [data-creature-slot]{width:100%;max-width:180px}
body.visual-v1 .v20-home .specimens .companion-cutout{max-height:215px;object-fit:contain}
body.visual-v1 .v20-home .v40-cas{width:28%;max-width:240px;transform:none!important}
body.visual-v1 .v20-home .zarathustra-desk{width:70%;max-width:360px;filter:none!important}
body.visual-v1 .v20-home :is(.feature-tour,.video-placeholder,.extension-preview,.ink-monitor,.v40-sheet){border-radius:var(--v-radius)!important;border-color:var(--v-line)!important;background:var(--v-surface)!important;color:var(--v-ink)!important;box-shadow:none}
body.visual-v1 .feature-tour-tabs button[aria-selected=true]{background:var(--v-action)!important;border-color:var(--v-control-line)!important;color:var(--v-ink)!important}
body.visual-v1 :is(.tour-card,.tour-document,.tour-browser,.tour-track>div,.tour-sequence>div){background:var(--v-paper);border-color:var(--v-line);border-radius:12px}
body.visual-v1 :is(.tour-playback,.tour-tag,.tour-save,.tour-contacts span){background:var(--v-shell);color:var(--v-ink)}
/* One reusable work-surface grammar; existing geometry/data handlers remain authoritative. */
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace{--green:var(--v-action);--pink:var(--v-pink);--paper:var(--v-paper);--ink:var(--v-ink);--muted:var(--v-muted);--line:var(--v-line);--body:var(--v-body);--display:var(--v-body);background:var(--v-paper);color:var(--v-ink);font-size:16px}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(.workspace,.content,.topbar){background:var(--v-paper)!important;color:var(--v-ink)!important;border-color:var(--v-line)}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .sidebar{background:var(--v-shell)!important;color:var(--v-ink);border-color:var(--v-line);padding-top:24px}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .sidebar .brand{font:24px var(--v-display);color:var(--v-ink);text-transform:none}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(.side-nav a,.nav-collapse){color:var(--v-ink);background:transparent;border:0;border-radius:12px;box-shadow:none;font-size:15px}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .side-nav a.active{background:var(--v-action)!important;color:var(--v-ink)!important;box-shadow:none;border:0}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .side-nav a:hover{background:var(--v-hover)}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .side-nav svg{color:inherit!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace.nav-collapsed .brand{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:0}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace.nav-collapsed .brand>img{width:32px!important;height:32px!important;flex-basis:32px}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(.panel,.tip-panel,.board-detail,.job-detail-head,.job-detail-body,.job-results,.live-job-row,.focus-paper,.focus-actions,.pip-focus-main,.scout-card,.document-group,.document-table-wrap,.studio-tools,.studio-toolbar,.studio-header,.studio-templates,.workspace-lab-tabs,.lab-unified,.track-stat,.priority-card,.cabinet-search){background:var(--v-surface)!important;color:var(--v-ink)!important;border-color:var(--v-line)!important;border-radius:var(--v-radius);box-shadow:none!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(h1,h2,h3,p,li,label,.note,.breadcrumbs,.side-footer,.feed-status,.feed-source-help,.listing-facts,.posting-description){color:var(--v-ink);font-family:var(--v-body);text-transform:none}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(.note,.side-footer,.feed-source-help,.breadcrumbs){color:var(--v-muted)}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(.btn,.btn.quiet,.chip,.tab){background:var(--v-surface);color:var(--v-ink);border:1px solid var(--v-control-line);border-radius:12px;min-height:44px;font-size:14px;box-shadow:none}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(.btn.green,.btn.black,.chip.active,.tab.active,.filter-token,[aria-pressed=true].btn){background:var(--v-action)!important;color:var(--v-ink)!important;border-color:var(--v-control-line)!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(input:not([type=checkbox]):not([type=radio]),select,textarea){background:var(--v-surface)!important;color:var(--v-ink)!important;border:1px solid var(--v-control-line)!important;border-radius:10px;font-size:16px;line-height:1.5}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(input,textarea)::placeholder{color:var(--v-muted);opacity:1}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(.job-result,.live-job-row){color:var(--v-ink);background:var(--v-surface);border-color:var(--v-line)}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(.job-result.selected,.live-job-row.is-selected,.live-job-row:has(.job-result.selected)){background:var(--v-hover)!important;box-shadow:inset 3px 0 var(--v-control-line)!important;border-color:var(--v-control-line)!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .job-result b{color:var(--v-ink);background:var(--v-shell)}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(.document-page,.studio-paper,.sample-paper){background:#fff;color:#20251d}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .studio-canvas{background:var(--v-shell)}
body.visual-v1 :is(.cabinet-crest,.cabinet-mini-crest,.cabinet-rail,.mirror-frame-art){display:none!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .sidebar-tank{border:0!important;border-radius:28px!important;background:var(--v-water)!important;box-shadow:none;padding:0!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .tank-glass{border:0!important;border-radius:28px!important;height:150px;background-blend-mode:soft-light;background-color:var(--v-water)!important;box-shadow:none}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .tank-feed{background:var(--v-shell);color:var(--v-ink);border:0}
body.visual-v1 .tank-label{color:var(--v-ink)!important;background:var(--v-shell)!important}
body.visual-v1 .lagoon-scene{background:var(--v-water);border:0!important;border-radius:var(--v-world-radius)!important;box-shadow:none!important;isolation:isolate;overflow:hidden}
body.visual-v1 .room-bg{opacity:.4}
body.visual-v1 .lagoon-scene:before,body.visual-v1 .lagoon-scene:after{display:none!important}
body.visual-v1 :is(.lagoon-landmark,.room-caption,.demo-play){color:var(--v-ink);background:var(--v-paper);border-color:var(--v-line)}
body.visual-v1 .companion-picker>button{background:var(--v-surface)!important;color:var(--v-ink)!important;border-color:var(--v-line)!important;border-radius:20px}
body.visual-v1 .companion-picker>button[aria-pressed=true]{background:var(--v-hover)!important;border-color:var(--v-control-line)!important}
body.visual-v1[data-companion] #modal{background:var(--v-surface)!important;color:var(--v-ink)!important;border:1px solid var(--v-control-line)!important;border-radius:20px!important;box-shadow:0 16px 48px #23382f26}
body.visual-v1[data-companion] #modal :is(.modal-head,.modal-body,.choice,.empty){background:var(--v-surface);color:var(--v-ink);border-color:var(--v-line)}
body.visual-v1 #toast{background:var(--v-ink);color:var(--v-paper)}
@media(max-width:750px){
 body.visual-v1 .v20-home .hero{grid-template-columns:1fr;min-height:0!important;margin:8px 12px;padding:32px 24px!important;gap:24px}
 body.visual-v1 .v20-home .hero-copy h1{font-size:clamp(32px,8vw,48px)!important}
 body.visual-v1 .v20-home .hero-art{max-width:330px;justify-self:center;padding:20px;order:2}
 body.visual-v1 .v20-home .specimens{gap:16px;padding:24px 16px!important}
 body.visual-v1 .v20-home .specimens .evolution-art{height:150px!important}
 body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .content{padding:20px 16px}
}
@media(prefers-reduced-motion:reduce){body.visual-v1 *,body.visual-v1 *:before,body.visual-v1 *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Clear the old carved container geometry as well as its ornament. */
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .sidebar-tank{min-height:0!important;height:auto!important;flex:0 0 auto!important;overflow:hidden}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .tank-glass{margin:0!important;width:100%!important;height:150px!important;min-height:0!important;box-shadow:none!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .tank-label{background:var(--v-shell)!important;color:var(--v-ink)!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace :is(.side-nav a,.btn,.chip,.tab){border-radius:12px!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .room-scene{border:0!important;border-radius:var(--v-world-radius)!important;box-shadow:none!important;background:var(--v-water)!important;isolation:isolate}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .room-bg{opacity:.4!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .room-scene:before,body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .room-scene:after{display:none!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace #save-status{color:var(--v-muted)}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .sidebar-tools{background:transparent;border-color:var(--v-line)}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace.nav-collapsed .tank-glass{height:64px!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .sidebar-tank.lagoon-tank{flex:0 0 auto!important;min-height:0!important;overflow:hidden!important;margin-top:12px!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .tank-glass .pip-sprite{top:0!important;bottom:auto!important;left:calc(50% - 75px)!important;width:150px!important;height:126px!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .tank-label :is(b,span){color:var(--v-ink)!important;text-shadow:none!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace.nav-collapsed .tank-glass .pip-sprite{width:48px!important;height:48px!important;left:0!important;top:4px!important}
body.visual-v1 .v20-home .v20-header{position:relative!important;top:auto!important;box-shadow:none!important}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .priority-tabs button{color:var(--v-muted)!important;min-height:44px;font-size:15px}
body.visual-v1.art-pass.lagoon-pass[data-companion] .product-workspace .priority-tabs button[aria-selected=true]{color:var(--v-ink)!important;border-bottom:3px solid var(--v-control-line)!important}
body.visual-v1 .companion-picker>button{border-radius:20px!important}
body.visual-v1 .companion-card-art{background:var(--v-shell);border-radius:16px}
/* Manual examples remain fully readable when paused, including without reduced motion. */
body.visual-v1 .feature-tour :is(.tour-enter,.tour-move){animation:none!important;opacity:1;transform:none}
