/* Shared UI layer: homepage + catalogue only. Never imported by exam engines. */
:root{
 --font-editorial:'Iowan Old Style','Baskerville','Palatino Linotype',Georgia,serif;
 --font-ui:'Avenir Next','Segoe UI','PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;
 --bg:#f7f9fc;--panel:#fff;--ink:#1d2b3b;--muted:#637286;--line:#e1e7ef;
 --blue:#385f91;--green:#39715e;--brown:#916441;
 --blue-soft:#edf3fb;--green-soft:#edf5f0;--brown-soft:#f8f0e7;
 --accent:var(--blue);--soft:var(--blue-soft);--radius-control:8px;
 --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;
 color-scheme:light;
}
body{--bg:#f7f9fc;--panel:#fff;--ink:#1d2b3b;--muted:#637286;--line:#e1e7ef;font-family:var(--font-ui);font-weight:400}
html[data-theme="dark"]{color-scheme:dark;background:#141c25}
html[data-theme="dark"] body{--bg:#141c25;--panel:#1c2733;--ink:#e6edf4;--muted:#a9b7c7;--line:#334352;--blue:#a1bfe5;--green:#9bcab3;--brown:#dbb38e;--blue-soft:#23354b;--green-soft:#263e35;--brown-soft:#3b3027;--accent:var(--blue);--soft:var(--blue-soft)}
body[data-skill=reading]{--accent:var(--blue);--soft:var(--blue-soft)}
body[data-skill=listening],html[data-theme="dark"] body[data-skill=listening]{--accent:var(--green);--soft:var(--green-soft)}
body[data-skill=writing],html[data-theme="dark"] body[data-skill=writing]{--accent:var(--brown);--soft:var(--brown-soft)}
button,input,select{font-family:var(--font-ui)}
button,.primary{border-radius:var(--radius-control)}
.primary{font-size:13px;font-weight:500;line-height:1.4;letter-spacing:.015em;min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:11px 16px;transition:background-color 160ms ease,border-color 160ms ease,transform 120ms ease-out}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
#theme{display:inline-grid;place-items:center;width:40px;height:40px;min-width:40px;min-height:40px;padding:0;border-radius:50%;border:1px solid var(--line);background:var(--panel);color:var(--ink);font:20px/1 var(--font-ui);cursor:pointer}
#theme:hover{background:var(--soft);border-color:var(--accent)}
.brand>span,.logo>span{font-family:var(--font-editorial);font-size:21px;font-weight:400;line-height:1.2;letter-spacing:.04em}
.brand b,.logo b{display:grid;place-items:center;width:40px;height:44px;padding:0;font:20px/1 var(--font-editorial);border-radius:9px}
.brand small,.logo small{font:500 8px/1.8 var(--font-ui);letter-spacing:.16em;color:var(--muted)}
.hero .eyebrow,.section-head .eyebrow,.heading .caption,.role{font-size:10px;font-weight:500;letter-spacing:.14em}
.resource,.material,.ways-grid{border-radius:12px}
.resource-links a,.writing-links a,.lesson a{min-height:44px}
.text-link{font-size:12px;line-height:1.6;display:inline-flex;align-items:center;min-height:40px}
.source{gap:8px;margin-bottom:16px}.source button,.filters button,.filters select{min-height:40px;font-size:12px}.search{min-height:40px}.filters{gap:12px}
.results-head{margin:16px 0 12px;font-size:12px;font-variant-numeric:tabular-nums}
#materials{gap:16px}.cards .material{padding:20px;gap:20px}.cards .buttons{gap:8px}.bookmark{width:44px;min-width:44px;min-height:44px}.preview-link{min-height:36px}
#catalogNav{gap:12px;flex-wrap:wrap}#catalogNav>span{color:var(--muted);font-size:12px}.book,.test{border-radius:10px}
.side-bottom{justify-items:start;gap:16px}.side-bottom>a{min-height:40px;display:flex;align-items:center}
header .home-return{font-size:12px;white-space:nowrap;color:var(--muted);padding:8px 0;margin-right:16px}.home-return:hover{color:var(--accent)}
main>header{justify-content:flex-start;gap:8px}main>header .labmark{margin-left:auto}
.skip{position:fixed;top:-90px;left:12px;z-index:100;background:var(--panel);color:var(--ink);padding:12px;border:1px solid var(--line);border-radius:8px}.skip:focus{top:12px}
dialog{border-radius:12px;padding:28px;box-shadow:0 20px 70px #0003}dialog button:not(.preview-link){min-height:40px}dialog h2{font-family:var(--font-editorial);font-weight:400}dialog p{line-height:1.8}dialog::backdrop{background:#111b2a99}
@media(max-width:760px){.nav{padding:12px}.brand b{width:34px;height:38px;font-size:17px}.brand>span{font-size:18px}.brand small{font-size:7px}.resource-grid{gap:16px}}
@media(max-width:700px){.sidebar{padding:12px 16px;gap:8px}.sidebar .logo b{width:32px;height:36px;font-size:15px}.sidebar nav{gap:2px}.sidebar nav button{padding:6px;min-height:44px}.sidebar nav span{font-size:15px}.sidebar nav small{font-size:10px}.sidebar .side-bottom{margin-left:auto}.side-bottom #theme{width:36px;height:36px;min-width:36px;min-height:36px;font-size:19px}main{padding-left:20px;padding-right:20px}.labmark{display:none}main>header{height:48px}.heading{padding:20px 0}.source{margin-bottom:16px}.source button{font-size:11px;padding:8px}.filters{gap:8px}.results-head{font-size:11px}.cards .material{padding:20px}.cards .row-actions{gap:8px}.source span{font-size:11px}.book{padding:16px}.book-mark{font-size:8px;letter-spacing:.09em}}
@media(max-width:360px){.sidebar nav span{font-size:13px}.sidebar nav button{padding:5px}.sidebar{gap:4px}.heading h1{font-size:27px}}
@media(prefers-reduced-motion:reduce){.primary,button{transition:none!important}.primary:active,button:active{transform:none!important}}
@media(max-width:700px){.sidebar .side-bottom>a{display:none}.sidebar .side-bottom{gap:0}}