/* UI-only skin. Original HTML, page order, navigation, behavior, sizes,
   positioning, grid definitions and breakpoints are preserved. */
:root{--blue:#3472d9;--coral:#3472d9;--berry:#346abd;--sky:#d8e7fc;--paper:#f6f8fc;--cream:#edf3fd;--yellow:#f2d47b;--line:rgba(66,105,165,.16);--shadow:0 16px 54px rgba(48,86,145,.1);--sans:"Avenir Next","Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif;--serif:var(--sans)}
body{-webkit-font-smoothing:antialiased;background:#f5f7fb}
::selection{background:#d6e6ff;color:#21487e}
button:focus-visible,[role=button]:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #3472d9;outline-offset:3px}
/* Original home rail stays on the left, and stays at the bottom on phones. */
body[data-view="home"] .mode-sidebar{background:rgba(248,251,255,.77);border-radius:28px;box-shadow:0 10px 45px rgba(43,84,150,.06);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);text-shadow:none;color:#3472d9}
body[data-view="home"] .sidebar-brand{color:#3472d9;text-shadow:none}
body[data-view="home"] .mode-link{color:#50647f;text-shadow:none;border-radius:999px}
body[data-view="home"] .mode-link:hover,body[data-view="home"] .mode-link.previewing{background:#3472d9!important;color:white!important;text-shadow:none}
body[data-view="home"] .mode-link:after{background:#fff}
body[data-view="home"] .sidebar-foot{color:#506c96}
#home-view .hero-copy h1{color:#2866c8}
#home-view .hero-copy .kicker{color:#3472d9}
#home-view .lead{color:#455f85}
#home-view .hero-shade,body.day-complete #home-view .hero-shade{background:linear-gradient(90deg,rgba(240,247,255,.22),rgba(248,251,255,.76) 30%,rgba(248,251,255,.49) 56%,rgba(240,247,255,.05) 80%)}
.page-corner-nav button{background:rgba(249,252,255,.88);color:#346bc2;border-color:#d6e3f7;box-shadow:0 5px 22px rgba(58,99,161,.06)}
.button,.media-toolbar button,.memory-list button,.route-item button,.journey-choice-actions button{border-radius:999px}
.button.primary{box-shadow:0 5px 18px rgba(52,114,217,.15)}
.career-entry-grid article{background:rgba(233,243,255,.12);border-color:rgba(225,239,255,.3);box-shadow:none}
.career-entry-grid article:hover{background:#eef5ff;color:#233d66}
.journey-persona,.memory-personas button,.media-card{box-shadow:none}
.journey-persona:hover,.media-card:hover{box-shadow:0 15px 40px rgba(52,94,156,.13)}
.journey-persona.selected{border-color:#3472d9}
.journey-persona.started i,.journey-persona.selected i{background:#3472d9;border-color:#3472d9}
.media-card-copy small{color:#3472d9}
.media-card-copy em,.media-toolbar p,.library-persona span{color:#677a95}
.media-card.completed{box-shadow:inset 0 0 0 2px #7eacd4}
.transcript-panel{background:#f0f5fc}
.transcript-panel>header{background:#e5efff}
.transcript-line.active{box-shadow:0 8px 24px rgba(52,98,172,.07)}
.line-translation{background:#edf4ff;border-color:#9fc2f5;border-radius:12px}
.word-detail{background:#e4efff;border-color:#3472d9;border-radius:12px}
.transcript-tools button,.line-actions button,.word-detail button{border-radius:999px}
.review-intro{background:linear-gradient(115deg,#f8fbff 55%,#d9e9ff)}
.takeaway-group article{border-radius:20px;box-shadow:none;border-color:#dce6f5}
.takeaway-group article:hover{box-shadow:0 12px 30px rgba(52,98,172,.08)}
.takeaway-group button{border-radius:999px;background:#edf4ff;color:#346abd}
.library-list,.workbench{background:#f9fbff}
.library-item.active{background:#eaf2ff}
.recall-card,.extension-card{background:#f8fbff}
.notebook-tabs,.practice-direction{border-color:#d6e3f5;background:#f9fbff}
.notebook-tabs button.active,.practice-direction button.active{background:#3472d9;color:#fff}
.import-box{background:#edf4ff;border-color:#d7e5f9}
.growth-metrics article,.growth-panel{border-color:#d8e4f6;background:#f9fbff}
.growth-metrics strong{color:#3472d9}
.growth-genres article,.growth-next{background:#223a61;color:#fff}
.growth-history article{border-color:#dce6f5}
.quiz-options button{border-radius:16px}
.quiz-next,.review-next button,.segment-finish button{border-radius:999px}
.journey-choice-card{background:#f8fbff;box-shadow:0 25px 80px rgba(29,64,122,.18)}
.journey-data-note{background:#e6effd}
.editor-lock{background:radial-gradient(circle at 50% 20%,#fff 0,#f2f6fe 42%,#e0eafa 100%)}
.editor-lock-card{background:rgba(255,255,255,.82);border-color:#d5e2f5;box-shadow:0 24px 70px rgba(54,93,154,.1)}
.editor-lock-card input:focus,.editor-field textarea:focus,.editor-field input:focus{border-color:#3472d9;box-shadow:0 0 0 3px rgba(52,114,217,.1)}
.editor-tabs button.active{border-color:#3472d9}
.editor-page-button.active{background:#3472d9;color:#fff}
.editor-field.changed{border-color:#a3c4f6;background:#f6faff}
.editor-actions button,.editor-lock-card form button{border-radius:999px}
@media(max-width:900px){body[data-view="home"] .mode-sidebar{background:rgba(248,251,255,.95)!important;color:#3472d9!important}body[data-view="home"] .mode-link{color:#50647f}body[data-view="home"] .mode-link:hover,body[data-view="home"] .mode-link.previewing{background:#3472d9!important;color:#fff!important}}
@media(prefers-reduced-motion:reduce){button,.media-card,.journey-persona{transition:none!important}}

/* Coordinated material system: illustration belongs in headers; study surfaces
   stay quiet. This layer never changes DOM order, grid, spacing or positioning. */
:root{--ink:#23324b;--paper:#f7f8fb;--cream:#edf2fa;--blue:#336ed0;--coral:#336ed0;--berry:#336ed0;--yellow:#f4d987;--green:#3a826a;--line:rgba(53,91,150,.14);--control-border:#ccd9ed;--muted:#687b97;--shadow:0 18px 55px rgba(37,75,134,.08)}
body{background:#f7f8fb;color:var(--ink)}
#home-view .hero{background:#f6f7f6;box-shadow:0 12px 46px rgba(49,89,149,.04)}
#home-view .hero>img,#home-view[data-preview]:not([data-preview="home"]) .hero>img{filter:none!important}
#home-view .hero-shade,body.day-complete #home-view .hero-shade{background:linear-gradient(90deg,rgba(248,249,250,.3),rgba(248,249,250,.82) 23%,rgba(248,249,250,.83) 53%,rgba(248,249,250,.08) 84%)}
#home-view .hero-copy h1{color:#2459aa;text-shadow:0 2px 20px rgba(255,255,255,.48)}
#home-view .hero-copy .kicker{color:#4675bc}
#home-view .lead{color:#5d708b}
body[data-view="home"] .mode-sidebar{background:rgba(255,255,255,.72);box-shadow:0 8px 36px rgba(45,76,125,.06);border-radius:24px}
body[data-view="home"] .mode-link{border-radius:16px}
body[data-view="home"] .mode-link:hover,body[data-view="home"] .mode-link.previewing{background:#336ed0!important;box-shadow:0 6px 20px rgba(51,110,208,.12)}
/* Keep original headers; replace their dark scenic backdrops with matching art. */
.career-hub,.memory-page,.memory-persona-page,.memory-detail-page,#route-view .route-section,.growth-hero,.summary-hero,.review-intro{background-color:#f5f7fa!important;background-image:linear-gradient(90deg,rgba(248,250,253,.96),rgba(248,250,253,.85) 52%,rgba(248,250,253,.18)),url("assets/studio-audio.f550cb2f6c.webp")!important;background-size:cover;background-position:center;color:var(--ink);box-shadow:0 15px 60px rgba(46,86,147,.05)}
#wordbook-view .library-head,#expressionbook-view .library-head{background-color:#f5f7fa;background-image:linear-gradient(90deg,rgba(248,250,253,.97),rgba(248,250,253,.84) 60%,rgba(248,250,253,.08)),url("assets/studio-notebook.889c79e258.webp");background-size:cover;background-position:center;color:var(--ink)}
.career-hub .kicker,.memory-page .kicker,#route-view .kicker,.growth-hero .kicker,.summary-hero .kicker,.review-intro .kicker,.library-head>div p{color:#336ed0}
.career-hub header>p:last-child,.memory-persona-page header>p:last-child,.memory-detail-page header>p:last-child,.growth-hero>div>p:last-child,.summary-hero>div>p:last-child,.review-intro>p:last-child,#route-view .route-head>p{color:#637895}
.career-entry-grid article{background:rgba(255,255,255,.9);border-color:rgba(142,171,216,.28);color:var(--ink);backdrop-filter:blur(12px);box-shadow:0 10px 36px rgba(50,89,151,.05)}
.career-entry-grid article:hover{background:#e9f1ff;color:#254975;border-color:#aec8ef;box-shadow:0 15px 40px rgba(50,89,151,.09)}
.career-entry-grid article>span,.career-entry-grid article>b{color:#336ed0}
.career-entry-grid small{color:#647c9b;opacity:1}
.persona-select-page,.media-library-page{background:#f3f6fb}
.journey-persona>img,.memory-personas img{filter:saturate(.65)}
.journey-persona:after,.memory-personas button:after{background:linear-gradient(180deg,transparent 25%,rgba(19,44,79,.9))}
.journey-persona:hover,.memory-personas button:hover{border-color:#6f9ce1}
.journey-persona small,.memory-personas small{color:#c6dcff}
.journey-persona em,.memory-personas em{color:#e2ebf8}
.journey-persona i,.journey-persona.started i{background:#336ed0;border-color:#77a2e4;color:#fff;box-shadow:0 4px 16px #1537621a}
.memory-list article{border-color:#d7e2f2}
.memory-list span{color:#336ed0}.memory-list p{color:#667c9b}
.memory-list button,.memory-route-actions button{color:#3868ae!important;background:#ffffffb8!important;border-color:#c8d8ef!important}
#route-view .route-item{background:rgba(255,255,255,.74);border-color:#d8e3f4;backdrop-filter:blur(12px);color:var(--ink)}
#route-view .route-item.current{background:#fff;border-color:#b2ccef;color:var(--ink);box-shadow:0 8px 28px rgba(51,110,208,.07)}
#route-view .route-item p,#route-view .route-item.current p{color:#336ed0}
#route-view .route-item small,#route-view .route-item.current small{color:#6c819f}
#route-view .route-item.final h3{color:#254975}
#route-view .route-item>span{color:#7c9fce}
#route-view .route-item.current>span{color:#336ed0}
.library-head>span{color:#336ed0;border-color:#ccdcef;background:rgba(255,255,255,.6)}
.library-head>button,.growth-hero>button{color:#336ed0}
.growth-hero h1 em{color:#336ed0}
.growth-hero aside{background:rgba(255,255,255,.78);border-color:#d0dff4;box-shadow:0 8px 30px rgba(44,85,145,.05)}
.growth-hero aside small{color:#336ed0}.growth-hero aside span{color:#6b81a0}
/* Two button materials: blue for advancing, light blue for supporting actions. */
.button.primary,.next-sentence,.watch-replay-previous,.quiz-next,.quiz-result button,.finale-copy>button,.day-finish button,.content-check>button,.import-box button,.segment-finish button,.review-next button,.recall-card button,.extension-card button,.generated-sentences button,.editor-lock-card form button,.editor-actions button:last-of-type{background:#336ed0;color:#fff;border-color:#336ed0;box-shadow:0 4px 14px rgba(51,110,208,.1);font-family:var(--sans)}
.button.primary:hover,.quiz-next:not(:disabled):hover,.quiz-result button:hover,.finale-copy>button:hover,.import-box button:hover,.segment-finish button:hover,.review-next button:hover,.extension-card button:hover{background:#2259b4;box-shadow:0 6px 18px rgba(51,110,208,.16)}
.button.ghost,.media-toolbar button,.line-actions button,.word-detail button,.transcript-tools button,.first-impression button,.recall-card button:last-child,.editor-actions button,.editor-inspector button,.editor-fields-panel>header button{background:#f1f6ff;color:#3b6db4;border-color:#ccdcef;border-radius:999px;box-shadow:none}
.media-toolbar button.active,.first-impression button:focus{background:#336ed0;color:#fff;border-color:#336ed0}
.media-toolbar button:not(:disabled):hover,.line-actions button:hover,.transcript-tools button:hover,.word-detail button:hover,.recall-card button:last-child:hover{background:#e2edff;color:#285ba8;border-color:#aec8ef}
.line-actions button.recording,.transcript-tools button.recording,.output-row button.recording{color:#b64e58;border-color:#e0a1a8;background:#fff0f2}
.line-actions button.saved,.transcript-tools button.saved,.word-detail button.saved,.takeaway-group button.saved,.output-row button.saved{color:#2e7562;background:#e8f4ee;border-color:#b5d8ca}
.takeaway-group button{background:#eaf2ff;color:#386bb3;border-color:#ccdcf4}
button:disabled{box-shadow:none!important}
.journey-choice-actions button:first-child,.summary-actions button:first-of-type{background:#336ed0;border-color:#336ed0;color:#fff}
.journey-choice-actions button,.summary-actions button{border-color:#c2d4ef;color:#3868ae;background:#f8fbff}
.journey-choice-actions .danger-choice,.detail-actions .danger-detail{color:#a44554!important;background:#fff5f6!important;border-color:#e8bac2!important}
.journey-choice-close,.detail-close{background:rgba(255,255,255,.9);color:#536c90;border-color:#d6e2f3}
/* Media detail uses the same light material, while retaining the original cover. */
.media-detail{background:#f7faff;color:var(--ink);box-shadow:0 25px 100px rgba(32,63,111,.23)}
.media-detail-content h2,.media-detail-content .media-original-title{color:#233f68!important}
.media-detail-content .media-original-title{color:#7487a1!important}
.detail-facts{border-color:#d7e3f4}
.detail-facts small,.detail-facts em,.talk-speaker small,.talk-intro small{color:#7185a1}
.detail-facts b,.talk-speaker b{color:#2b476d}
.detail-description,.media-detail-content>div>p:nth-of-type(2){color:#627a9c}
.talk-speaker>span{border-color:#d7e3f4;background:#fff}
.talk-speaker em{color:#6d83a1}
.talk-topics i{background:#e5effe;color:#4370b5}
.talk-intro{background:#eaf1fc}.talk-intro p{color:#4e6b90}
.detail-info .talk-highlight,.media-detail-content .talk-highlight{color:#4477bf!important}
.detail-actions button{background:#eef4ff!important;border-color:#cbdcf5!important;color:#406cac}
.detail-actions .primary-detail{background:#336ed0!important;border-color:#336ed0!important;color:#fff}
/* Video remains a dark surface; transcripts, notes and questions are light. */
.media-column,.segment-stage,.segment-video,.media-frame,.relisten-stage{background:#152a47}
.transport,.segment-transport,.relisten-transport{background:#1d3555;color:#e3edfc}
.small-play,.speed{border-color:#6c89b2!important;color:#e4efff}
.media-play{background:rgba(51,110,208,.65);border-color:rgba(255,255,255,.8);box-shadow:0 8px 25px rgba(15,44,88,.16)}
.media-buffer{background:rgba(25,53,91,.84)}
.workbench,.transcript-panel,.relisten-transcript,.finale-copy,.quiz-card{background:#f8faff;color:var(--ink)}
.transcript-panel>header,.relisten-transcript>header{background:#edf3fd}
.segment-layout.transcript-collapsed .transcript-panel>header{background:#244a7d}
.watch-next-actions,.segment-finish,.review-next{background:#e7effc;color:#2d4e7e}
.watch-replay-previous{background:#e7effc;color:#3868ae;border-color:#cadbf4;box-shadow:none}
.segment-finish small,.review-next small{color:#6682a8}
.watch-main>p,.question,.finale-copy p{color:#6a7f9d}
.transcript-line.paused-line{background:#eaf2ff!important}
.line-translation,.word-detail{background:#e8f1ff;color:#405f8e}
.speaker-slacks,.speaker-siractionslacks{--speaker:#5272b8}
.speaker-tyler1{--speaker:#367f93}.speaker-gorgc{--speaker:#7768aa}
.day-finish,.quiz-result,.summary-actions{background:#e9f1fe;color:#2c4d7b}
.summary-stats{background:#f9fbff}.summary-hero>strong{color:#336ed0}
.quiz-context{background:linear-gradient(145deg,#e7effc,#f4f7fc);color:#294a7b}
.quiz-context>p:last-child{color:#6b81a0}
.quiz-options button{background:#fff;border-color:#d6e2f3;box-shadow:none}
.quiz-options button span{background:#edf3fd;color:#5c7fb2}
.quiz-options button.selected{background:#eaf2ff;border-color:#7da6e5;box-shadow:inset 0 0 0 1px #7da6e5}
.quiz-options button.correct{border-color:#6da08a;background:#edf7f1;box-shadow:inset 0 0 0 1px #6da08a}
.quiz-options button.wrong{border-color:#ca8991;background:#fff1f3;box-shadow:inset 0 0 0 1px #ca8991}
/* Personal notebooks: one quiet paper stock; annotation remains handwritten. */
.notebook-controls{background:#eef3fb;border-color:#d7e2f2}
.notebook-tabs,.practice-direction{background:#f9fbff;border-color:#d0dff4}
.notebook-controls label span{color:#6f83a0}
.notebook-controls input{color:#29466f;border-color:#bbcee9;font-family:var(--sans)}
.notebook-layout .library-list{background-color:#f9fbff;background-image:linear-gradient(rgba(68,116,184,.07) 1px,transparent 1px),linear-gradient(90deg,transparent 54px,rgba(97,147,217,.13) 54px,rgba(97,147,217,.13) 56px,transparent 56px)}
.library-item{background:rgba(255,255,255,.68)!important}
.library-item.active{background:#edf4ff!important}
.library-item small{color:#71839d}
.library-item mark{background:#f7edce;color:#7d704d}
.notebook-annotate{border-color:#b2c8e8;color:#5276ac}
.notebook-layout[data-mode="practice"],.practice-studio{background:#e8f0fd;color:#2f4c76}
.recall-card,.extension-card{background:#ffffff;box-shadow:0 6px 24px rgba(52,98,166,.04)}
.recall-answer,.generated-sentences blockquote{background:#eaf2ff;color:#345e98}
.extension-card input{border-color:#cfdef4;color:#29466f;border-radius:12px}
.free-layout{background:#f6f8fc}
.free-title h1 em{color:#336ed0}
.import-box{background:#fff;box-shadow:0 12px 42px rgba(52,98,166,.05)}
.import-box input{background:#f0f5ff;border-color:#d6e3f5;color:#29466f;border-radius:12px}
.content-check{background:#f9fbff;border-color:#d5e2f5}
.growth-metrics article,.growth-panel{background:#fff;border-color:#d9e4f5;box-shadow:0 6px 26px rgba(51,90,149,.035)}
.growth-genres article{background:#eaf2ff;color:#375b8d}
.growth-genres small,.growth-genres span{color:#6d87aa}
.growth-history article{background:#f9fbff}.growth-history article>i{background:#e5effe;color:#4978b8}
.growth-next{background:#e7effc;color:#2e5283}.growth-next>span{color:#6985aa}.growth-next>div{background:#d3e1f7}
.growth-abilities i{background:#e1eaf8}
/* Back office follows the same controls, with no artwork in its working area. */
body[data-view="editor"],.editor-view,.editor-fields-panel{background:#f5f8fd;color:#2c466b}
.editor-topbar{background:rgba(249,251,255,.94);border-color:#d4e1f3}
.editor-pages,.editor-inspector{background:#edf3fc;border-color:#d4e1f3}
.editor-field{background:#fff;border-color:#d9e5f5;box-shadow:0 4px 18px rgba(52,90,145,.035)}
.editor-field>header i{background:#ebf2fd;color:#6c85a8}
.editor-field>header button{color:#557bac}
.editor-field textarea,.editor-field input[type="text"]{border-color:#d3e0f4;color:#2c466b}
.editor-filter>input,.editor-filter>div{background:#fff;border-color:#d4e1f4}
.editor-filter button.active{background:#336ed0;color:#fff}
.editor-page-button:hover{background:#e1ecfc}.editor-page-button.active{background:#336ed0;color:#fff}
.editor-pages p,.editor-inspector>p,.editor-fields-panel>header span{color:#7187a5}
.editor-lock-card .annotation-mark,.editor-lock-card>p{color:#336ed0}
.toast{background:#234d87;box-shadow:0 8px 28px rgba(35,77,135,.14);border-radius:14px}
@media(max-width:900px){#home-view .hero-shade,body.day-complete #home-view .hero-shade{background:linear-gradient(180deg,rgba(248,250,253,.72),rgba(248,250,253,.92) 34%,rgba(248,250,253,.54) 65%,rgba(248,250,253,.12))}body[data-view="home"] .mode-sidebar{background:rgba(255,255,255,.93)!important}}
/* Finish small states after the shared material rules. */
#route-view .route-item.locked button{background:#eaf0f8;color:#8293ad;border-color:#d5dfed;box-shadow:none}
.media-detail-content .detail-info span{color:#5e789b}
.media-detail-content .detail-info .detail-facts b{color:#294b7c}
.media-detail-content .detail-info .talk-speaker em{color:#6d83a1}
.media-detail-content .detail-info .detail-index{color:#4778bd}
.media-detail-content .detail-info .talk-highlight{color:#4477bf!important}
.media-card-copy b{color:#2d456b}
.transcript-collapse{border-radius:50%;color:#4575b9;background:#f8fbff;border-color:#ccdcf3}
.segment-layout.transcript-collapsed .transcript-collapse{background:#e6effd;color:#336ed0;border-color:#c6d8f4}
.quiz-options button.selected span{background:#336ed0;color:#fff}
.quiz-options button.correct span{background:#3a826a;color:#fff}
.quiz-options button.wrong span{background:#b95c6a;color:#fff}
.line-actions button.recording i,.output-row button.recording i{background:#b95c6a}
.editor-lock-card small{color:#af5464}
.editor-exit-link{color:#567cae}


/* Matching paper-cut companions; original cards retain their layout. */
.journey-persona,.memory-personas button{background:#eef4fd;color:#284b80;border-color:#d9e5f5;box-shadow:0 8px 30px rgba(48,87,146,.055)}
.journey-persona>img,.memory-personas img{filter:none;object-position:center 30%}
.journey-persona:after{background:linear-gradient(180deg,rgba(246,249,255,0) 38%,rgba(246,249,255,.12) 48%,rgba(246,249,255,.96) 77%,#f6f9ff 100%)}
.memory-personas button:after{background:linear-gradient(180deg,rgba(247,250,255,0) 25%,rgba(247,250,255,.12) 42%,rgba(247,250,255,.96) 77%,#f7faff)}
.journey-persona small,.memory-personas small{color:#517ab5}
.journey-persona b,.memory-personas b{color:#28558f;text-shadow:none}
.journey-persona em,.memory-personas em{color:#617a9e;text-shadow:none}
.journey-persona i,.journey-persona.started i,.journey-persona.selected i{background:#336ed0;border-color:#336ed0;color:#fff;box-shadow:0 4px 15px rgba(51,110,208,.11)}
.journey-persona:hover,.memory-personas button:hover{border-color:#8eafe1;box-shadow:0 15px 38px rgba(48,87,146,.1)}
.journey-persona[data-persona="cherry"],.memory-personas button[data-persona="cherry"]{background:#f2f4fb;border-color:#dce2f2}