/* ==========================================================================
   Shokher Tech Academy — Design System (core)
   Tokens · Base · Components. Shared by website, dashboard and exam room.
   ========================================================================== */

@font-face{font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/inter-latin-wght-normal.woff2) format("woff2-variations"),url(../fonts/inter-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Hind Siliguri";font-style:normal;font-display:swap;font-weight:400;src:url(../fonts/hind-siliguri-bengali-400-normal.woff2) format("woff2");unicode-range:U+0951-0952,U+0964-0965,U+0980-09FE,U+1CD0-1CF9,U+200C-200D,U+20B9,U+25CC,U+A8F1}
@font-face{font-family:"Hind Siliguri";font-style:normal;font-display:swap;font-weight:500;src:url(../fonts/hind-siliguri-bengali-500-normal.woff2) format("woff2");unicode-range:U+0951-0952,U+0964-0965,U+0980-09FE,U+1CD0-1CF9,U+200C-200D,U+20B9,U+25CC,U+A8F1}
@font-face{font-family:"Hind Siliguri";font-style:normal;font-display:swap;font-weight:600;src:url(../fonts/hind-siliguri-bengali-600-normal.woff2) format("woff2");unicode-range:U+0951-0952,U+0964-0965,U+0980-09FE,U+1CD0-1CF9,U+200C-200D,U+20B9,U+25CC,U+A8F1}
@font-face{font-family:"Hind Siliguri";font-style:normal;font-display:swap;font-weight:700;src:url(../fonts/hind-siliguri-bengali-700-normal.woff2) format("woff2");unicode-range:U+0951-0952,U+0964-0965,U+0980-09FE,U+1CD0-1CF9,U+200C-200D,U+20B9,U+25CC,U+A8F1}

:root{
	/* Brand — derived from the logo: white wordmark on ink, volt-lime "Academy" chip & paper plane */
	--ink-950:#060a12;
	--ink-900:#0b1220;
	--ink-800:#121b2d;
	--ink-700:#1c273c;
	--ink-600:#2b3750;
	--ink-500:#46536d;
	--lime-50:#f6fde3;
	--lime-100:#ebfbc2;
	--lime-200:#dcf98b;
	--lime-400:#bdf516;   /* logo accent */
	--lime-500:#a5dc06;
	--lime-700:#4f6b00;   /* accessible lime text on light (≥4.5:1) */

	/* Secondary — a calm data blue for charts, info and "good" scores */
	--blue-50:#eef2ff;
	--blue-100:#dfe6ff;
	--blue-500:#3a5ef0;
	--blue-700:#2340b8;

	/* Neutrals — warm, paper-like */
	--bg:#f6f6f2;
	--surface:#ffffff;
	--surface-2:#f1f2ed;
	--surface-3:#e8e9e3;
	--line:#e3e4de;
	--line-strong:#cfd2c8;
	--text:#0b1220;
	--text-2:#353d4d;
	--muted:#5f6878;
	--subtle:#8b93a1;
	--on-dark:#f3f5f7;
	--on-dark-muted:#a9b1c0;

	/* Status */
	--success:#16a34a; --success-ink:#11652e; --success-bg:#e8f6ed;
	--warning:#f59e0b; --warning-ink:#8a5300; --warning-bg:#fff3d9;
	--error:#dc2626;   --error-ink:#a51c1c;   --error-bg:#fdeceb;
	--info:var(--blue-500); --info-ink:var(--blue-700); --info-bg:var(--blue-50);

	/* Score scale */
	--score-excellent:#7cc000;
	--score-good:var(--blue-500);
	--score-average:#e69200;
	--score-low:#e0412f;

	/* Typography */
	--font:"Inter","Hind Siliguri",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans Bengali",sans-serif;
	--fs-display:clamp(2.125rem,1.35rem + 3.3vw,3.5rem);
	--fs-h1:clamp(1.875rem,1.45rem + 1.8vw,2.625rem);
	--fs-h2:clamp(1.5rem,1.25rem + 1.1vw,2.125rem);
	--fs-h3:clamp(1.1875rem,1.1rem + .35vw,1.375rem);
	--fs-h4:1.0625rem;
	--fs-body:1.0625rem;
	--fs-sm:.9375rem;
	--fs-xs:.8125rem;
	--fs-cap:.75rem;
	--lh-tight:1.25;
	--lh-head:1.35;
	--lh-body:1.75;
	--fw-reg:400; --fw-med:500; --fw-semi:600; --fw-bold:700;

	/* Spacing (4px base) */
	--s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-8:32px; --s-10:40px; --s-12:48px; --s-16:64px; --s-20:80px; --s-24:96px;
	--section:clamp(56px,7vw,104px);

	/* Shape & depth */
	--r-xs:4px; --r-sm:6px; --r-md:10px; --r-lg:14px; --r-xl:20px; --r-pill:999px;
	--sh-1:0 1px 2px rgba(11,18,32,.05);
	--sh-2:0 1px 2px rgba(11,18,32,.04),0 6px 16px -6px rgba(11,18,32,.10);
	--sh-3:0 2px 4px rgba(11,18,32,.04),0 20px 40px -12px rgba(11,18,32,.22);
	--focus:0 0 0 2px var(--surface),0 0 0 4px var(--ink-900);

	/* Layout */
	--container:1200px;
	--container-wide:1320px;
	--gutter:16px;
	--header-h:68px;

	/* Motion */
	--ease:cubic-bezier(.2,.7,.2,1);
	--t-fast:120ms; --t:180ms; --t-slow:320ms;
}
@media (min-width:768px){:root{--gutter:24px}}
@media (min-width:1200px){:root{--gutter:32px;--header-h:72px}}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px)}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:var(--fs-body);line-height:var(--lh-body);font-weight:var(--fw-reg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden}
img,svg,video{max-width:100%;height:auto;display:block}
svg.ste-icon{display:inline-block;flex-shrink:0;vertical-align:middle}
a{color:inherit;text-decoration-color:color-mix(in srgb,currentColor 35%,transparent);text-underline-offset:3px}
a:hover{text-decoration-color:currentColor}
h1,h2,h3,h4,h5,h6{margin:0 0 .5em;line-height:var(--lh-head);font-weight:var(--fw-bold);letter-spacing:-.01em;color:var(--text)}
h1{font-size:var(--fs-h1)} h2{font-size:var(--fs-h2)} h3{font-size:var(--fs-h3)} h4{font-size:var(--fs-h4)}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-left:1.25em}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus{outline:none}
:focus-visible{outline:2px solid var(--ink-900);outline-offset:2px;border-radius:var(--r-sm)}
.is-dark :focus-visible,.ste-dark :focus-visible{outline-color:var(--lime-400)}
::selection{background:var(--lime-200);color:var(--ink-900)}
.num,.ste-num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
hr{border:0;border-top:1px solid var(--line);margin:var(--s-8) 0}
[hidden]{display:none!important}

.screen-reader-text,.sr-only{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}
.skip-link:focus{clip:auto;clip-path:none;height:auto;width:auto;z-index:1000;top:8px;left:8px;background:var(--lime-400);color:var(--ink-900);padding:10px 16px;border-radius:var(--r-sm);font-weight:600}

.ste-container{width:100%;max-width:calc(var(--container) + var(--gutter)*2);margin-inline:auto;padding-inline:var(--gutter)}
.ste-container--wide{max-width:calc(var(--container-wide) + var(--gutter)*2)}
.ste-container--narrow{max-width:calc(760px + var(--gutter)*2)}
.ste-stack>*+*{margin-top:var(--s-4)}
.ste-row{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap}
.ste-between{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);flex-wrap:wrap}
.ste-grid{display:grid;gap:var(--s-6)}
.ste-muted{color:var(--muted)}
.ste-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-xs);font-weight:var(--fw-semi);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ste-eyebrow::before{content:"";width:18px;height:2px;background:var(--lime-400);border-radius:2px}
.is-dark .ste-eyebrow{color:var(--on-dark-muted)}

/* ---------- Buttons ---------- */
.ste-btn{--h:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--h);padding:0 18px;border-radius:var(--r-md);border:1px solid transparent;font-size:var(--fs-sm);font-weight:var(--fw-semi);line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color var(--t) var(--ease),border-color var(--t) var(--ease),color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t-fast) var(--ease);user-select:none;-webkit-tap-highlight-color:transparent;position:relative}
.ste-btn:active{transform:translateY(1px)}
.ste-btn--sm{--h:36px;padding:0 12px;font-size:var(--fs-xs);border-radius:var(--r-sm)}
.ste-btn--lg{--h:52px;padding:0 24px;font-size:1rem}
.ste-btn--block{width:100%}
.ste-btn--primary{background:var(--ink-900);color:#fff}
.ste-btn--primary:hover{background:var(--ink-700)}
.ste-btn--accent{background:var(--lime-400);color:var(--ink-900)}
.ste-btn--accent:hover{background:var(--lime-200)}
.ste-btn--secondary{background:var(--surface);color:var(--text);border-color:var(--line-strong)}
.ste-btn--secondary:hover{border-color:var(--ink-900)}
.ste-btn--ghost{background:transparent;color:var(--text)}
.ste-btn--ghost:hover{background:var(--surface-2)}
.ste-btn--danger{background:var(--error);color:#fff}
.ste-btn--danger:hover{background:var(--error-ink)}
.is-dark .ste-btn--secondary,.ste-dark .ste-btn--secondary{background:transparent;color:var(--on-dark);border-color:rgba(255,255,255,.22)}
.is-dark .ste-btn--secondary:hover,.ste-dark .ste-btn--secondary:hover{border-color:var(--lime-400);color:#fff}
.is-dark .ste-btn--ghost{color:var(--on-dark)} .is-dark .ste-btn--ghost:hover{background:rgba(255,255,255,.08)}
.ste-btn[disabled],.ste-btn.is-disabled{opacity:.45;pointer-events:none}
.ste-btn.is-loading{color:transparent!important;pointer-events:none}
.ste-btn.is-loading::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;border:2px solid currentColor;border-color:var(--spin,#fff) var(--spin,#fff) transparent transparent;animation:ste-spin .7s linear infinite}
.ste-btn--accent.is-loading,.ste-btn--secondary.is-loading,.ste-btn--ghost.is-loading{--spin:var(--ink-900)}
.ste-btn .ste-icon{width:18px;height:18px}
.ste-link{display:inline-flex;align-items:center;gap:6px;font-weight:var(--fw-semi);text-decoration:none;color:var(--text)}
.ste-link:hover{text-decoration:underline}
.ste-link .ste-icon{transition:transform var(--t) var(--ease)}
.ste-link:hover .ste-icon{transform:translateX(3px)}
.ste-icon-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:var(--r-md);border:1px solid transparent;background:transparent;color:inherit;position:relative;transition:background-color var(--t) var(--ease)}
.ste-icon-btn:hover{background:var(--surface-2)}
.is-dark .ste-icon-btn:hover{background:rgba(255,255,255,.08)}
@keyframes ste-spin{to{transform:rotate(360deg)}}

/* ---------- Forms ---------- */
.ste-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.ste-field+.ste-field{margin-top:var(--s-4)}
.ste-label{font-size:var(--fs-sm);font-weight:var(--fw-semi);color:var(--text)}
.ste-label .opt{font-weight:400;color:var(--subtle);font-size:var(--fs-xs)}
.ste-input,.ste-select,.ste-textarea{width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--line-strong);border-radius:var(--r-md);background:var(--surface);color:var(--text);font-size:1rem;line-height:1.5;transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease);appearance:none;-webkit-appearance:none}
.ste-textarea{min-height:120px;resize:vertical}
.ste-select{padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235f6878' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.ste-input::placeholder,.ste-textarea::placeholder{color:var(--subtle)}
.ste-input:hover,.ste-select:hover,.ste-textarea:hover{border-color:var(--ink-500)}
.ste-input:focus,.ste-select:focus,.ste-textarea:focus{border-color:var(--ink-900);box-shadow:0 0 0 3px color-mix(in srgb,var(--lime-400) 55%,transparent);outline:none}
.ste-input[disabled],.ste-select[disabled]{background:var(--surface-2);color:var(--subtle);cursor:not-allowed}
.ste-field.has-error .ste-input,.ste-field.has-error .ste-select,.ste-field.has-error .ste-textarea{border-color:var(--error)}
.ste-field__error{display:flex;gap:6px;align-items:flex-start;font-size:var(--fs-xs);color:var(--error-ink);line-height:1.5}
.ste-field__help{font-size:var(--fs-xs);color:var(--muted);line-height:1.5}
.ste-input-wrap{position:relative}
.ste-input-wrap .ste-input{padding-right:48px}
.ste-input-wrap__btn{position:absolute;right:4px;top:4px;bottom:4px;width:40px;border:0;background:transparent;border-radius:var(--r-sm);color:var(--muted);display:grid;place-items:center}
.ste-input-wrap__btn:hover{color:var(--text);background:var(--surface-2)}
.ste-check{display:inline-flex;align-items:center;gap:10px;font-size:var(--fs-sm);cursor:pointer;user-select:none}
.ste-check input{width:20px;height:20px;accent-color:var(--ink-900);margin:0}
.ste-switch{position:relative;display:inline-flex;align-items:center;gap:12px;cursor:pointer}
.ste-switch input{position:absolute;opacity:0;width:1px;height:1px}
.ste-switch__track{width:44px;height:26px;border-radius:var(--r-pill);background:var(--line-strong);position:relative;transition:background var(--t) var(--ease);flex-shrink:0}
.ste-switch__track::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:var(--sh-1);transition:transform var(--t) var(--ease)}
.ste-switch input:checked+.ste-switch__track{background:var(--ink-900)}
.ste-switch input:checked+.ste-switch__track::after{transform:translateX(18px);background:var(--lime-400)}
.ste-switch input:focus-visible+.ste-switch__track{box-shadow:var(--focus)}
.ste-form-grid{display:grid;gap:var(--s-4)}
@media (min-width:640px){.ste-form-grid--2{grid-template-columns:1fr 1fr}.ste-form-grid--2 .ste-field+.ste-field{margin-top:0}}
.ste-form-grid .ste-field+.ste-field{margin-top:0}

/* ---------- Cards & surfaces ---------- */
.ste-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s-6)}
.ste-card--flush{padding:0;overflow:hidden}
.ste-card--muted{background:var(--surface-2);border-color:transparent}
.ste-card--hover{transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.ste-card--hover:hover{border-color:var(--line-strong);box-shadow:var(--sh-2)}
.ste-card__head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);margin-bottom:var(--s-4)}
.ste-card__title{font-size:1.0625rem;font-weight:var(--fw-bold);margin:0;line-height:1.4}
.ste-card__sub{font-size:var(--fs-xs);color:var(--muted);margin:2px 0 0}

/* ---------- Badges ---------- */
.ste-badge{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:var(--r-pill);font-size:var(--fs-cap);font-weight:var(--fw-semi);line-height:1;white-space:nowrap;background:var(--surface-2);color:var(--text-2);border:1px solid transparent}
.ste-badge .ste-icon{width:13px;height:13px}
.ste-badge--lime{background:var(--lime-400);color:var(--ink-900)}
.ste-badge--ink{background:var(--ink-900);color:#fff}
.ste-badge--outline{background:transparent;border-color:var(--line-strong)}
.ste-badge--success{background:var(--success-bg);color:var(--success-ink)}
.ste-badge--warning{background:var(--warning-bg);color:var(--warning-ink)}
.ste-badge--error{background:var(--error-bg);color:var(--error-ink)}
.ste-badge--info{background:var(--info-bg);color:var(--info-ink)}
.ste-badge--easy{background:var(--success-bg);color:var(--success-ink)}
.ste-badge--medium{background:var(--warning-bg);color:var(--warning-ink)}
.ste-badge--hard{background:var(--error-bg);color:var(--error-ink)}
.ste-dot{width:8px;height:8px;border-radius:50%;background:currentColor;display:inline-block}

/* ---------- Chips (filters) ---------- */
.ste-chips{display:flex;gap:8px;flex-wrap:wrap}
.ste-chips--scroll{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter);padding-bottom:2px}
.ste-chips--scroll::-webkit-scrollbar{display:none}
.ste-chip{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border-radius:var(--r-pill);border:1px solid var(--line-strong);background:var(--surface);font-size:var(--fs-sm);font-weight:var(--fw-med);color:var(--text-2);text-decoration:none;white-space:nowrap;cursor:pointer;transition:all var(--t) var(--ease)}
.ste-chip:hover{border-color:var(--ink-900);color:var(--text)}
.ste-chip.is-active,.ste-chip[aria-pressed="true"],.ste-chip[aria-current]{background:var(--ink-900);border-color:var(--ink-900);color:#fff}
.ste-chip .count{font-size:var(--fs-cap);opacity:.65}

/* ---------- Tabs ---------- */
.ste-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.ste-tabs::-webkit-scrollbar{display:none}
.ste-tab{position:relative;display:inline-flex;align-items:center;gap:6px;padding:12px 14px;font-size:var(--fs-sm);font-weight:var(--fw-semi);color:var(--muted);text-decoration:none;background:none;border:0;white-space:nowrap}
.ste-tab:hover{color:var(--text)}
.ste-tab.is-active,.ste-tab[aria-selected="true"],.ste-tab[aria-current]{color:var(--text)}
.ste-tab.is-active::after,.ste-tab[aria-selected="true"]::after,.ste-tab[aria-current]::after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:3px;border-radius:3px 3px 0 0;background:var(--ink-900)}
.ste-segmented{display:inline-flex;padding:4px;background:var(--surface-2);border-radius:var(--r-md);gap:2px;max-width:100%;overflow-x:auto;scrollbar-width:none}
.ste-segmented a,.ste-segmented button{border:0;background:none;padding:7px 14px;border-radius:var(--r-sm);font-size:var(--fs-sm);font-weight:var(--fw-semi);color:var(--muted);text-decoration:none;white-space:nowrap}
.ste-segmented .is-active,.ste-segmented [aria-current],.ste-segmented [aria-pressed="true"]{background:var(--surface);color:var(--text);box-shadow:var(--sh-1)}

/* ---------- Tables ---------- */
.ste-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface)}
.ste-table{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}
.ste-table th{text-align:left;font-size:var(--fs-xs);font-weight:var(--fw-semi);color:var(--muted);padding:12px 16px;background:var(--surface-2);border-bottom:1px solid var(--line);white-space:nowrap}
.ste-table td{padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:middle}
.ste-table tr:last-child td{border-bottom:0}
.ste-table tbody tr{transition:background var(--t-fast)}
.ste-table tbody tr:hover{background:#fafaf7}

/* ---------- Progress ---------- */
.ste-progress{height:8px;border-radius:var(--r-pill);background:var(--surface-3);overflow:hidden;position:relative}
.ste-progress>span{display:block;height:100%;width:var(--v,0%);border-radius:inherit;background:var(--ink-900);transition:width .8s var(--ease)}
.ste-progress--lime>span{background:var(--lime-500)}
.ste-progress--sm{height:6px}
.ste-progress[data-tone=excellent]>span{background:var(--score-excellent)}
.ste-progress[data-tone=good]>span{background:var(--score-good)}
.ste-progress[data-tone=average]>span{background:var(--score-average)}
.ste-progress[data-tone=low]>span{background:var(--score-low)}
.is-dark .ste-progress{background:rgba(255,255,255,.12)}

/* Score ring */
.ste-ring{--size:120px;--stroke:10;position:relative;width:var(--size);height:var(--size);flex-shrink:0}
.ste-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ste-ring__track{stroke:var(--surface-3)}
.ste-ring__bar{stroke:var(--tone,var(--ink-900));stroke-linecap:round;transition:stroke-dashoffset 1.1s var(--ease)}
.ste-ring__label{position:absolute;inset:0;display:grid;place-items:center;text-align:center;line-height:1.1}
.ste-ring__value{font-size:calc(var(--size)*.24);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums}
.ste-ring__cap{display:block;font-size:var(--fs-cap);color:var(--muted);font-weight:var(--fw-med);margin-top:2px}
[data-tone=excellent]{--tone:var(--score-excellent)}
[data-tone=good]{--tone:var(--score-good)}
[data-tone=average]{--tone:var(--score-average)}
[data-tone=low]{--tone:var(--score-low)}
.ste-tone-text[data-tone=excellent]{color:#4a7a00}
.ste-tone-text[data-tone=good]{color:var(--blue-700)}
.ste-tone-text[data-tone=average]{color:var(--warning-ink)}
.ste-tone-text[data-tone=low]{color:var(--error-ink)}

/* ---------- Alerts ---------- */
.ste-alert{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--r-md);border:1px solid;font-size:var(--fs-sm);line-height:1.6}
.ste-alert .ste-icon{margin-top:2px}
.ste-alert p{margin:0}
.ste-alert--info{background:var(--info-bg);border-color:var(--blue-100);color:var(--info-ink)}
.ste-alert--success{background:var(--success-bg);border-color:#c9ead4;color:var(--success-ink)}
.ste-alert--warning{background:var(--warning-bg);border-color:#f6dfa8;color:var(--warning-ink)}
.ste-alert--error{background:var(--error-bg);border-color:#f6c9c6;color:var(--error-ink)}
.ste-alert--lime{background:var(--lime-50);border-color:var(--lime-200);color:var(--ink-900)}

/* ---------- Avatar ---------- */
.ste-avatar{--size:40px;width:var(--size);height:var(--size);border-radius:50%;overflow:hidden;display:inline-grid;place-items:center;flex-shrink:0;background:var(--surface-3);border:2px solid var(--surface)}
.ste-avatar img{width:100%;height:100%;object-fit:cover}
.ste-avatar--initial{background:hsl(var(--hue,90) 45% 90%);color:hsl(var(--hue,90) 45% 28%);font-weight:var(--fw-bold);font-size:calc(var(--size)*.42);line-height:1}

/* ---------- Dropdown ---------- */
.ste-dropdown{position:relative}
.ste-dropdown__menu{position:absolute;right:0;top:calc(100% + 8px);min-width:240px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-3);padding:6px;z-index:60;opacity:0;transform:translateY(-4px) scale(.98);transform-origin:top right;pointer-events:none;visibility:hidden;transition:opacity var(--t) var(--ease),transform var(--t) var(--ease),visibility 0s linear var(--t);color:var(--text)}
.ste-dropdown.is-open .ste-dropdown__menu{opacity:1;transform:none;pointer-events:auto;visibility:visible;transition-delay:0s}
.ste-dropdown__item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border-radius:var(--r-sm);font-size:var(--fs-sm);text-decoration:none;color:var(--text);border:0;background:none;text-align:left}
.ste-dropdown__item:hover{background:var(--surface-2)}
.ste-dropdown__sep{height:1px;background:var(--line);margin:6px 0}

/* ---------- Modal / Drawer / Sheet ---------- */
.ste-overlay{position:fixed;inset:0;background:rgba(6,10,18,.55);z-index:90;opacity:0;visibility:hidden;transition:opacity var(--t-slow) var(--ease),visibility 0s linear var(--t-slow);backdrop-filter:blur(2px)}
.ste-overlay.is-open{opacity:1;visibility:visible;transition-delay:0s}
.ste-modal{position:fixed;left:50%;top:50%;width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow:auto;background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--sh-3);z-index:100;padding:var(--s-6);opacity:0;visibility:hidden;transform:translate(-50%,-46%) scale(.98);transition:opacity var(--t) var(--ease),transform var(--t-slow) var(--ease),visibility 0s linear var(--t-slow)}
.ste-modal.is-open{opacity:1;visibility:visible;transform:translate(-50%,-50%);transition-delay:0s}
.ste-modal__title{font-size:1.25rem;margin:0 0 6px}
.ste-modal__actions{display:flex;gap:10px;justify-content:flex-end;margin-top:var(--s-6);flex-wrap:wrap}
.ste-sheet{position:fixed;left:0;right:0;bottom:0;max-height:85vh;overflow:auto;background:var(--surface);border-radius:var(--r-xl) var(--r-xl) 0 0;z-index:100;transform:translateY(100%);transition:transform var(--t-slow) var(--ease);padding:8px var(--gutter) calc(var(--s-6) + env(safe-area-inset-bottom));box-shadow:var(--sh-3);visibility:hidden}
.ste-sheet.is-open{transform:none;visibility:visible}
.ste-sheet__grab{width:40px;height:4px;border-radius:4px;background:var(--line-strong);margin:6px auto 14px}
.ste-sheet__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s-4)}
body.ste-lock{overflow:hidden}

/* ---------- Toast ---------- */
.ste-toasts{position:fixed;z-index:200;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;width:min(420px,calc(100vw - 32px));pointer-events:none}
.ste-toast{display:flex;gap:10px;align-items:center;padding:12px 16px;border-radius:var(--r-md);background:var(--ink-900);color:#fff;box-shadow:var(--sh-3);font-size:var(--fs-sm);animation:ste-toast-in var(--t-slow) var(--ease);pointer-events:auto}
.ste-toast .ste-icon{color:var(--lime-400)}
.ste-toast--error .ste-icon{color:#ff8a7a}
.ste-toast.is-leaving{animation:ste-toast-out var(--t) var(--ease) forwards}
@keyframes ste-toast-in{from{opacity:0;transform:translateY(10px)}}
@keyframes ste-toast-out{to{opacity:0;transform:translateY(6px)}}

/* ---------- Skeleton ---------- */
.ste-skel{background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 37%,var(--surface-2) 63%);background-size:400% 100%;animation:ste-skel 1.4s ease infinite;border-radius:var(--r-sm);min-height:12px}
@keyframes ste-skel{0%{background-position:100% 50%}100%{background-position:0 50%}}

/* ---------- Empty / error states ---------- */
.ste-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--s-10) var(--s-6);gap:6px}
.ste-empty__icon{width:56px;height:56px;border-radius:var(--r-lg);display:grid;place-items:center;background:var(--lime-50);color:var(--lime-700);border:1px solid var(--lime-200);margin-bottom:8px}
.ste-empty__title{font-size:1.0625rem;margin:0}
.ste-empty__text{color:var(--muted);font-size:var(--fs-sm);max-width:380px;margin:0 0 10px}

/* ---------- Pagination ---------- */
.ste-pagination{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:var(--s-8)}
.ste-pagination .page-numbers{display:inline-flex;align-items:center;gap:6px;min-width:40px;height:40px;padding:0 12px;justify-content:center;border-radius:var(--r-md);border:1px solid var(--line);background:var(--surface);text-decoration:none;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.ste-pagination a.page-numbers:hover{border-color:var(--ink-900)}
.ste-pagination .current{background:var(--ink-900);border-color:var(--ink-900);color:#fff}
.ste-pagination .dots{border:0;background:none}

/* ---------- Accordion ---------- */
.ste-acc{border-top:1px solid var(--line)}
.ste-acc details{border-bottom:1px solid var(--line)}
.ste-acc summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;cursor:pointer;font-weight:var(--fw-semi);font-size:1.0625rem;line-height:1.5}
.ste-acc summary::-webkit-details-marker{display:none}
.ste-acc summary .ste-icon{transition:transform var(--t) var(--ease);color:var(--muted)}
.ste-acc details[open] summary .ste-icon{transform:rotate(45deg);color:var(--text)}
.ste-acc__body{padding:0 0 20px;color:var(--text-2);max-width:68ch}

/* ---------- Breadcrumbs ---------- */
.ste-crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;font-size:var(--fs-xs);color:var(--muted)}
.ste-crumbs li{display:inline-flex;align-items:center;gap:6px}
.ste-crumbs li+li::before{content:"/";color:var(--line-strong)}
.ste-crumbs a{text-decoration:none}
.ste-crumbs a:hover{color:var(--text);text-decoration:underline}
.is-dark .ste-crumbs{color:var(--on-dark-muted)}

/* ---------- Search dialog ---------- */
.ste-search{position:fixed;left:50%;top:10vh;width:min(640px,calc(100vw - 24px));background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--sh-3);z-index:120;opacity:0;visibility:hidden;transform:translate(-50%,-8px);transition:opacity var(--t) var(--ease),transform var(--t) var(--ease),visibility 0s linear var(--t);overflow:hidden;color:var(--text)}
.ste-search.is-open{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s}
.ste-search__bar{display:flex;align-items:center;gap:10px;padding:6px 8px 6px 16px;border-bottom:1px solid var(--line)}
.ste-search__bar input{flex:1;border:0;outline:none;height:52px;font-size:1.0625rem;background:transparent;min-width:0}
.ste-search__body{max-height:60vh;overflow:auto;padding:8px}
.ste-search__group{padding:8px 8px 4px;font-size:var(--fs-cap);font-weight:var(--fw-semi);letter-spacing:.05em;text-transform:uppercase;color:var(--subtle)}
.ste-search__item{display:flex;gap:12px;align-items:center;padding:10px;border-radius:var(--r-md);text-decoration:none}
.ste-search__item:hover,.ste-search__item.is-active{background:var(--surface-2)}
.ste-search__item .ste-icon{color:var(--muted)}
.ste-search__item strong{display:block;font-weight:var(--fw-semi);font-size:var(--fs-sm);line-height:1.4}
.ste-search__item small{color:var(--muted);font-size:var(--fs-xs)}
.ste-search__hint{padding:24px 16px;color:var(--muted);font-size:var(--fs-sm);text-align:center}
.ste-search__quick{display:flex;flex-wrap:wrap;gap:8px;padding:8px}
.ste-kbd{display:inline-flex;align-items:center;height:22px;padding:0 6px;border-radius:5px;border:1px solid var(--line-strong);font-size:11px;color:var(--muted);font-family:var(--font);background:var(--surface)}

/* ---------- Exam card (shared by site + app) ---------- */
.ste-exam-grid{display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.ste-exam-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s-5);gap:14px;position:relative;transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.ste-exam-card:hover{border-color:var(--line-strong);box-shadow:var(--sh-2);transform:translateY(-2px)}
.ste-exam-card__top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ste-exam-card__subject{display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-xs);font-weight:var(--fw-semi);color:var(--muted)}
.ste-exam-card__subject i{width:8px;height:8px;border-radius:2px;background:var(--lime-400);box-shadow:0 0 0 1px var(--lime-500)}
.ste-exam-card__title{font-size:1.0625rem;line-height:1.45;margin:0;font-weight:var(--fw-bold)}
.ste-exam-card__title a{text-decoration:none}
.ste-exam-card__title a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.ste-exam-card__meta{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.ste-exam-card__meta div{padding:8px 10px;display:flex;flex-direction:column;gap:0;border-right:1px solid var(--line);min-width:0}
.ste-exam-card__meta div:last-child{border-right:0}
.ste-exam-card__meta dt{font-size:var(--fs-cap);color:var(--muted);line-height:1.4}
.ste-exam-card__meta dd{margin:0;font-weight:var(--fw-bold);font-size:var(--fs-sm);font-variant-numeric:tabular-nums;white-space:nowrap}
.ste-exam-card__foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto;padding-top:2px}
.ste-exam-card__foot .ste-btn{position:relative;z-index:1}
.ste-exam-card__best{font-size:var(--fs-xs);color:var(--muted);display:flex;flex-direction:column;line-height:1.35}
.ste-exam-card__best strong{font-size:var(--fs-sm);color:var(--text);font-variant-numeric:tabular-nums}
.ste-exam-card.is-premium{border-color:var(--ink-900)}
.ste-exam-card.is-premium .ste-exam-card__subject i{background:var(--ink-900);box-shadow:none}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
.js .ste-progress:not(.is-in)>span{width:0}
/* Light surfaces placed inside dark sections reset the text tokens. */
.stt-mock:not(.stt-mock--trend),.auth__card,.is-light{--text:#0b1220;--text-2:#353d4d;color:#0b1220}
