/* U01–U13: class UI components. Original DOCX and lesson contents are excluded. */
:root{--yk-action:#056f74;--yk-ink-meta:#526976;--yk-muted:#526976;--yk-radius:10px;--yk-control-height:40px;--yk-space:24px}
body.yk-shell{font-family:var(--yk-font-ui);color:var(--yk-ink-body)}
body.yk-shell :is(button,input,select,textarea):not(.dx-document *,.dx-legacy-paper *){font-family:var(--yk-font-ui)}
body.yk-shell :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #056f74;outline-offset:3px}
body.yk-shell :is(button,a){touch-action:manipulation}
body.yk-shell :is(h1,h2,h3):not(.dx-document *,.dx-legacy-paper *, .rr-prose *){color:var(--yk-ink-title)}
body.yk-shell [data-yk-page-title]{font-size:var(--yk-type-page);line-height:var(--yk-line-heading);font-weight:700;overflow-wrap:anywhere}
body.yk-shell>aside.yk-sidebar>nav>.yk-nav-link{color:#40566a;background:transparent}
body.yk-shell>aside.yk-sidebar>nav>.yk-nav-link.is-active{color:var(--yk-action);background:var(--yk-brand-soft)}
body.yk-shell>aside.yk-sidebar>nav>.yk-nav-link:not(.is-active)::before{content:none}
body.yk-shell>.yk-mobile-nav .yk-nav-link{color:#526976;background:transparent}
body.yk-shell>.yk-mobile-nav .yk-nav-link.is-active{color:var(--yk-action);background:var(--yk-brand-soft)}
/* Components: preserve disabled state and native input semantics. */
body.yk-shell :is(.yk-primary,.lc-primary,.dx-primary,.primary,.s12-primary,.mf-primary,.mc-primary,.rr-primary){background:var(--yk-action);border-color:var(--yk-action);color:#fff;font-size:var(--yk-type-control);border-radius:var(--yk-radius)}
body.yk-shell :is(input:not([type=checkbox],[type=radio],[type=range],[type=hidden]),select,textarea):not(.dx-document *,.dx-legacy-paper *){font-size:var(--yk-type-control);line-height:1.5;max-width:100%}
body.yk-shell :is(input[type=text],input[type=search],input[type=password],select):not(.dx-document *){min-height:var(--yk-control-height)}
body.yk-shell input[type=file]::file-selector-button{font:inherit;border:1px solid #acbfc7;background:#e8f5f4;color:#056f74;border-radius:6px;padding:7px 12px;margin-right:10px;cursor:pointer}
body.yk-shell dialog:not(.dx-document *){max-width:calc(100vw - 32px);max-height:calc(100dvh - 40px);overflow:auto;border:1px solid #bdced3;border-radius:12px;color:#2b4149}
body.yk-shell dialog::backdrop{background:#17394166}
.yk-empty-state{max-width:760px;margin:48px auto;background:#fff;border:1px solid var(--yk-line);border-radius:12px;padding:32px}
.yk-empty-state p{font-size:16px;line-height:1.75;color:#526976}.yk-empty-state a{display:inline-flex;padding:10px 20px;text-decoration:none;margin-top:12px}
.yk-view-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px;padding:0;border-bottom:1px solid var(--yk-line)}
.yk-view-tabs :is(a,button){font:inherit;font-size:16px;padding:10px 16px;background:transparent;border:0;border-bottom:3px solid transparent;color:#526976;text-decoration:none;cursor:pointer}
.yk-view-tabs [aria-current=page],.yk-view-tabs [aria-selected=true]{border-bottom-color:var(--yk-action);color:var(--yk-action);font-weight:600}
.yk-demo-label{font-size:14px;color:#71551d;background:#fff6df;border-radius:8px;padding:10px 14px;margin:0 0 16px}
/* Specialist recitation owns its content grid, never the shell. */
body.yk-shell:has(.rcc)>main{padding:calc(var(--yk-header-height) + 24px) 24px 32px;margin-left:var(--yk-sidebar-width);max-width:none}
body.yk-shell .rcc{--rcc-blue:var(--yk-action);position:static;width:100%;max-width:none;margin:0;padding:0;color:var(--yk-ink-body)}
body.yk-shell .rcc .rcc-heading{margin:0 0 20px;align-items:flex-start;flex-wrap:wrap}
body.yk-shell .rcc .rcc-heading h1{font-size:var(--yk-type-page);line-height:1.35;color:var(--yk-ink-title)}
body.yk-shell .rcc .rcc-heading p{font-size:16px;color:#526976;line-height:1.6}
body.yk-shell .rcc .rcc-target-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,320px);gap:20px;width:100%;margin:0;position:static}
body.yk-shell .rcc .rcc-target-main{width:auto;min-width:0;margin:0;padding:0;position:static}
body.yk-shell .rcc .rcc-target-side{position:sticky;top:calc(var(--yk-header-height) + 20px);width:auto;margin:0;padding:0;display:grid;gap:16px;align-self:start}
body.yk-shell .rcc .rcc-target-card{padding:18px;border:1px solid var(--yk-line);border-radius:10px;box-shadow:none;margin-bottom:16px}
body.yk-shell .rcc .rcc-target-card h2{font-size:var(--yk-type-section);color:var(--yk-ink-title);line-height:1.5}
body.yk-shell .rcc .rcc-target-card p{color:#405768;font-size:16px;line-height:1.75}
body.yk-shell .rcc :is(.rcc-line-icon,.rcc-lawlinks button,.rcc-text-button,.rcc-target-hint){color:var(--yk-action)}
body.yk-shell .rcc :is(.rcc-primary,.rcc-ai-primary,.rcc-target-submit,.rcc-target-actions button:last-child){background:var(--yk-action);border-color:var(--yk-action);color:white}
body.yk-shell .rcc .rcc-target-bottom{position:static;display:flex;flex-wrap:wrap;gap:10px;width:100%;height:auto;margin:18px 0 0;padding:12px;background:white;border:1px solid var(--yk-line);border-radius:10px;box-shadow:none}
body.yk-shell .rcc .rcc-target-bottom button{min-height:40px;flex:1;padding:8px 14px;color:var(--yk-action);font-size:16px;border:1px solid var(--yk-line);border-radius:7px}
body.yk-shell .rcc .rcc-target-bottom button:last-child{background:var(--yk-action);color:white;margin:0;border-color:var(--yk-action)}
body.yk-shell .rcc [data-fact-count]{flex-shrink:0;white-space:nowrap;min-width:48px;text-align:center}
body.yk-shell .rcc .rcc-recall-prompts span{white-space:normal;font-size:14px;color:#526976}
/* DOCX: only outer shell, toolbar and surrounding cards. No .docx-wrapper overrides. */
body.docx-review-page.yk-shell{overflow:auto}
body.docx-review-page.yk-shell>main{margin-left:var(--yk-sidebar-width);padding:calc(var(--yk-header-height) + 20px) 24px 28px;max-width:none}
body.yk-shell .docx-return{--dx-teal:var(--yk-action);--dx-ink:var(--yk-ink-title);--dx-muted:#526976;--dx-line:var(--yk-line)}
body.yk-shell .docx-return .dx-head h1{font-size:var(--yk-type-page);line-height:1.35}
body.yk-shell .docx-return :is(.dx-upload,.dx-guide,.dx-list) h2{font-size:var(--yk-type-section)}
body.yk-shell .docx-return :is(.dx-toolbar,.dx-tabs) button{font-size:14px;line-height:1.5}
body.yk-shell .docx-return .dx-head p{white-space:normal;max-width:none;overflow-wrap:anywhere}
body.yk-shell .docx-return .dx-crumb{flex-wrap:wrap;color:#526976}
/* A deliberate compact teacher density; standard learning pages retain reading space. */
body.yk-shell-teacher{--yk-type-section:1.125rem;--yk-type-card:1rem;--yk-type-control:.875rem}
body.yk-shell :is(.lc-card,.lc-section-head,.lc-integrated)>h2,body.yk-shell :is(.lc-card,.lc-section-head,.lc-integrated)>div>h2{font-size:var(--yk-type-section);line-height:1.5}
body.yk-shell .lc-task h3{font-size:var(--yk-type-card);line-height:1.5}
body.yk-shell :is(.lc-muted,.lc-task p,.lc-tag){color:#526976}
body.yk-shell .lc-tag{font-size:12px;line-height:1.5}
body.yk-shell .lc-integrated{margin-bottom:24px;padding:20px;border-radius:10px}
body.yk-shell .lc-task{padding:14px 0;gap:16px;align-items:center}
body.yk-shell .lc-more{margin-top:12px}body.yk-shell .lc-more summary{cursor:pointer;color:var(--yk-action);font-size:14px;padding:8px 0}
/* Full-sized learning panels replace device chrome. DOM and data hooks stay intact. */
body.yk-shell :is(.mf-root,.mc-root,.readingRecovery,.s12-root){font-family:var(--yk-font-ui);background:transparent;width:100%;max-width:1100px;margin:0 auto;padding:24px;min-height:0}
body.yk-shell :is(.mf-board,.mc-board,.rr-phones,.s12-board){display:block;margin:0;width:100%;padding:0}
body.yk-shell :is(.mf-phone,.mc-phone,.rr-phone,.s12-phone,.s12-bezel,.s12-screen,.rr-glass){position:relative;width:100%;max-width:none;min-width:0;height:auto;min-height:0;max-height:none;border:0;border-radius:10px;box-shadow:none;margin:0;transform:none;overflow:visible;background:white;padding:0}
body.yk-shell :is(.mf-content,.mc-content,.rr-phone-body,.s12-screen-body){height:auto;max-height:none;overflow:visible;padding:24px;margin:0}
body.yk-shell :is(.mf-status,.mc-status,.rr-status,.s12-status,.mf-phone>.mf-brand,.s12-app-brand,.mf-nav,.mc-nav,.rr-bottom-nav,.s12-tabs,.mf-board-title,.mc-board-note,.s12-board-title,.mf-site-menu){display:none}
body.yk-shell :is(.mc-phone>header,.rr-phone-head,.s12-app-head){position:static;height:auto;padding:16px 24px;border-bottom:1px solid var(--yk-line);background:white}
body.yk-shell :is(.mf-root,.mc-root,.readingRecovery,.s12-root) h1{font-size:var(--yk-type-page);line-height:1.4}
body.yk-shell :is(.mf-root,.mc-root,.readingRecovery,.s12-root) :is(button,input,textarea){font-family:var(--yk-font-ui)}
body.yk-shell .mf-phone>.mf-brand,body.yk-shell .mc-phone>header>b:has(svg){display:none}
body.yk-shell .rr-phone:before,body.yk-shell .rr-phone:after,body.yk-shell .mc-phone:before,body.yk-shell .mc-phone:after,body.yk-shell .s12-bezel:before,body.yk-shell .s12-bezel:after{content:none}
body.yk-shell [data-ui-panel-hidden]{display:none!important}
body.yk-shell .rr-prose{max-width:75ch;margin-inline:auto}
body.yk-shell :is(.mf-video,.mc-editor,.s12-field){max-width:100%}
body.yk-shell .rr-message{position:static;display:flex;width:100%;margin-top:20px}
/* Real exam report, not the timed exam workspace. */
body.yk-shell .exam-report h1{font-size:var(--yk-type-page);font-weight:700;line-height:1.35}
body.yk-shell .exam-report h2{font-size:var(--yk-type-section);font-weight:600}
/* Existing login uses the same UI font but keeps its independent layout. */
body:not(.yk-shell) :is(.login,.login-box,.login-card) :is(button,input){font-family:var(--yk-font-ui);font-size:16px}
@media(max-width:1100px){body.yk-shell .rcc .rcc-target-layout{grid-template-columns:1fr}body.yk-shell .rcc .rcc-target-side{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
 body.yk-shell:has(.rcc)>main,body.docx-review-page.yk-shell>main{margin-left:0;padding:calc(var(--yk-header-height) + 16px) 16px 24px}
 body.yk-shell .rcc .rcc-target-side{grid-template-columns:1fr}
 body.yk-shell .rcc .rcc-target-card{padding:16px}
 body.yk-shell :is(.mf-root,.mc-root,.readingRecovery,.s12-root){padding:16px;max-width:none}
 body.yk-shell :is(.mf-content,.mc-content,.rr-phone-body,.s12-screen-body){padding:16px}
 body.yk-shell :is(.mc-phone>header,.rr-phone-head,.s12-app-head){padding:12px 16px}
 body.yk-shell :is(.mf-phone,.mc-phone,.rr-phone,.s12-phone,.s12-bezel,.s12-screen,.rr-glass){border-radius:8px}
 .yk-view-tabs{gap:0;margin-bottom:16px}.yk-view-tabs :is(a,button){padding:10px 12px;font-size:14px}
 .yk-empty-state{margin:24px 16px;padding:24px}
 body.yk-shell .docx-return .dx-tabs{overflow:auto}
 body.yk-shell .docx-return .dx-tabs :is(button,a){flex-shrink:0}
 body.yk-shell .lc-task{align-items:flex-start}.lc-task>div{min-width:0}
 body.yk-shell .lc-task h3{font-size:16px}
}

/* Device variants need equal specificity to their historical selector. */
body.yk-shell .readingRecovery .rr-phone.device,body.yk-shell .readingRecovery .rr-phone.flat,body.yk-shell .readingRecovery .rr-phone.device .rr-glass{width:100%;height:auto;min-height:0;max-height:none;border:0;border-radius:10px;overflow:visible;padding:0;background:#fff}
body.yk-shell .readingRecovery .rr-phones{display:block;gap:0}
body.yk-shell .readingRecovery .rr-phone-body{height:auto;min-height:0;overflow:visible}
body.yk-shell .readingRecovery .rr-phone-head h2{font-size:var(--yk-type-section)}
body.yk-shell .readingRecovery .rr-phone.device::before,body.yk-shell .readingRecovery .rr-phone.device::after{content:none}

body.yk-shell .lesson58 .lc-save-strip :is(button,span,output){font-size:12px;line-height:1.5}
body.yk-shell .lesson58 .lc-save-strip button{font-family:var(--yk-font-ui);min-height:32px}
body.yk-shell .lesson58 .lc-message label{color:#526976}

/* Component defaults prevent browser Arial/13.333px controls. */
body.yk-shell button:not(.dx-document *,.dx-legacy-paper *){font-size:var(--yk-type-control);font-family:var(--yk-font-ui)}
body.yk-shell .center-ref .task h3{font-size:var(--yk-type-card)}
body.yk-shell .lesson58 .lc-save-strip button{font-size:12px;color:#fff;background:#056f74}
body.yk-shell :is(.outline,.lc-link,.lc-text,.rc-link,.ex-link,.ex-btn:not(.ex-primary),.access){color:var(--yk-action)}
body.yk-shell .courses-ref .active{color:var(--yk-action)}
body.yk-shell-teacher :is(.op-block,.op-card,.gv-block,.gv-card,.chain-block-head) h2{font-size:var(--yk-type-section)}
body:has(.login){font-family:var(--yk-font-ui)}
body .login :is(button,input){font-family:var(--yk-font-ui);font-size:16px;min-height:40px}
body .login button{background:#056f74;color:#fff;border-radius:8px}
body .login p{color:#526976}

body.login{font-family:var(--yk-font-ui)}body.login :is(button,input){font-family:var(--yk-font-ui);font-size:16px;min-height:40px}body.login button{background:#056f74;color:#fff;border-radius:8px}body.login p:not(.error){color:#526976}

/* Preserve contextual search/account links from the removed inner brand bar. */
body.yk-shell .mf-phone>.mf-brand:has(a){display:flex;justify-content:flex-end;height:auto;padding:12px 20px;border-bottom:1px solid var(--yk-line)}
body.yk-shell .mf-phone>.mf-brand:has(a)>svg,body.yk-shell .mf-phone>.mf-brand:has(a)>b{display:none}
body.yk-shell .mf-phone>.mf-brand:has(a)>small{display:flex;gap:16px;align-items:center}
body.yk-shell .rcc-bottom-icon{background:#056f74}

body.yk-shell .lc{--lc-accent:var(--yk-action)}
body.yk-shell .docx-return :is(.dx-page-nav a,.dx-pagination a,.dx-count){color:#056f74}
body.yk-shell .learningSupport .ls-outline{color:#056f74;border-color:#056f74}
body.yk-shell .lesson58 .lc-save-strip [data-player-status]{color:#e2eeee}
body.yk-shell .rcc .rcc-guide-icon,body.yk-shell .rcc .rcc-bottom-icon{background:#056f74}
body.yk-shell .s7-flag.fix{color:#865319}
body.yk-shell .ip-original h3,body.yk-shell .ip-upload-hint,body.yk-shell .ip46 .ip-feedback-note{color:#526976}
/* Remaining metadata labels; original answer/annotation paragraphs are unchanged. */
body.yk-shell .sk-original>span{color:#056f74}
body.yk-shell .ip-region>span{background:#056f74;color:white}
body.yk-shell .ip-original>h3>span,body.yk-shell .ip-original>small{color:#526976}
body.yk-shell .s10-phone-btn{background:#056f74;color:#fff}
body.yk-shell .docx-return .dx-scope-tabs small,body.yk-shell .docx-return .dx-page a{color:#056f74}
body.yk-shell .docx-return .dx-comment>div{color:#ad3344}
body.yk-shell .docx-return .dx-comment>small{color:#526976}
body.yk-shell .ip-original>h2>span{color:#526976}
body.yk-shell .rcc .rcc-answer-mask{color:#526976}

/* Exam primary actions retain white text over their existing teal gradient. */
body.yk-shell .ex-btn.ex-primary{color:#fff}

/* Shared primary action contrast: preserve teal texture, darken stops to >=4.5:1. */
body :is(.rh-primary,.primary,.tl-primary,.ex-btn.ex-primary,.rc-primary,.s06-primary,.s7-primary,.sb-primary,.s02-primary,.s02-tab.on,.s05-primary,.s03-play,.s03-primary,.s04-primary,.ss-primary,.s8-primary,.p65-primary,.pf-primary,.qa-primary,.sr-primary,.sr-filters button.on,.nt-primary,.ev-primary,.sc-actions>button,.pa-actions button,.ls-primary,.rr-segment button[aria-pressed=true],.gv-primary,.tt-primary,.ts-primary):not(:disabled):not([aria-disabled=true]){background:linear-gradient(115deg,#087b78,#05676b);color:#fff}
body .nt-categories button.active,body .mf-outline{color:#056f74}

body .aw-steps .on{color:#056f74}
body .governance .gv-tabs button.on{background:linear-gradient(115deg,#087b78,#05676b);color:#fff}

body .p65-nav-row [data-jump].written{background:linear-gradient(115deg,#087b78,#05676b);color:#fff}

body.yk-shell .qa-primary:not(:disabled){background:linear-gradient(115deg,#087b78,#05676b)!important;color:#fff}
