:root{
  --itl-navy:#102a56;
  --itl-blue:#2d6cdf;
  --itl-sky:#eaf3ff;
  --itl-green:#4e8d58;
  --itl-mint:#edf8ef;
  --itl-gold:#f4b740;
  --itl-coral:#ef7d63;
  --itl-ink:#18243a;
  --itl-muted:#667085;
  --itl-line:#dce5ef;
  --itl-white:#ffffff;
  --itl-shadow:0 18px 55px rgba(27,46,77,.10);
}

.itl-shell,.itl-login-page{box-sizing:border-box;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--itl-ink)}
.itl-shell *,.itl-login-page *{box-sizing:border-box}
.itl-shell{max-width:1540px;margin:28px auto;padding:0 22px 60px}
.itl-topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 2px 22px}
.itl-brand{display:flex;align-items:center;gap:12px}
.itl-brand-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:linear-gradient(145deg,var(--itl-blue),#7ca7f5);color:#fff;font-weight:900;font-size:24px;box-shadow:0 10px 25px rgba(45,108,223,.25)}
.itl-brand-name{font-weight:900;letter-spacing:.14em;color:var(--itl-navy);font-size:17px;line-height:1}
.itl-brand-subtitle{color:var(--itl-muted);font-weight:650;font-size:13px;margin-top:5px}
.itl-user{display:flex;align-items:center;gap:12px;font-size:14px}.itl-user-name{font-weight:700}.itl-link-muted{color:var(--itl-muted);text-decoration:none}.itl-link-muted:hover{color:var(--itl-blue)}
.itl-hero{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center;gap:30px;padding:38px 40px;border-radius:30px;background:linear-gradient(135deg,#f6faff 0%,#fff 48%,#f3fbf3 100%);border:1px solid #e6eef8;box-shadow:var(--itl-shadow)}
.itl-hero:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:rgba(82,142,88,.09);right:-80px;top:-120px}
.itl-eyebrow,.itl-now-label{font-size:12px;letter-spacing:.14em;font-weight:850;color:var(--itl-blue)}
.itl-hero h1{font-size:clamp(30px,4vw,50px);line-height:1.05;margin:9px 0 12px;color:var(--itl-navy);max-width:840px}
.itl-hero p{margin:0;max-width:760px;color:var(--itl-muted);font-size:17px;line-height:1.6}
.itl-hero-stat{min-width:145px;aspect-ratio:1;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:50%;background:#fff;border:1px solid #dfeadf;position:relative;z-index:1}.itl-hero-stat strong{font-size:42px;color:var(--itl-green);line-height:1}.itl-hero-stat span{font-weight:750;color:var(--itl-muted);margin-top:8px}
.itl-topic-tabs{display:flex;gap:10px;overflow:auto;padding:26px 2px 12px;scrollbar-width:thin}.itl-topic-tab{appearance:none;border:1px solid var(--itl-line);background:#fff;color:var(--itl-ink);border-radius:999px;padding:12px 18px;font-weight:800;white-space:nowrap;cursor:pointer;transition:.2s ease}.itl-topic-tab:hover{transform:translateY(-1px);border-color:#b9cdf0}.itl-topic-tab.is-active{background:var(--itl-navy);border-color:var(--itl-navy);color:#fff;box-shadow:0 8px 20px rgba(16,42,86,.18)}
.itl-topic-panel{display:none}.itl-topic-panel.is-active{display:block}
.itl-topic-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:24px 0 16px}.itl-level{display:inline-flex;padding:6px 10px;background:var(--itl-sky);color:var(--itl-blue);border-radius:999px;font-size:12px;font-weight:850}.itl-topic-heading h2{font-size:36px;line-height:1.1;margin:9px 0 4px;color:var(--itl-navy)}.itl-subtitle{font-size:18px;margin:0;color:var(--itl-green);font-weight:750}.itl-description{font-size:15px;line-height:1.55;color:var(--itl-muted);max-width:930px;margin:8px 0 0}.itl-topic-count{font-weight:800;color:var(--itl-muted);white-space:nowrap}
.itl-category-filters{display:flex;gap:8px;overflow:auto;margin:18px 0}.itl-filter{appearance:none;border:1px solid var(--itl-line);background:#fff;border-radius:12px;padding:9px 13px;color:var(--itl-muted);font-weight:750;cursor:pointer}.itl-filter.is-active{background:var(--itl-mint);border-color:#bddbbf;color:var(--itl-green)}
.itl-library-layout{display:grid;grid-template-columns:minmax(330px,440px) minmax(0,1fr);gap:22px;align-items:start}.itl-library{display:flex;flex-direction:column;gap:14px;max-height:970px;overflow:auto;padding:1px 8px 12px 1px;scrollbar-width:thin}
.itl-video-card{background:#fff;border:1px solid var(--itl-line);border-radius:20px;overflow:hidden;transition:.2s ease}.itl-video-card:hover{border-color:#b9c9df;box-shadow:0 12px 28px rgba(27,46,77,.08)}.itl-video-card.is-selected{border-color:#7aa6ee;box-shadow:0 0 0 3px rgba(45,108,223,.09)}.itl-video-card[hidden]{display:none}
.itl-thumb{position:relative;display:block;width:100%;aspect-ratio:16/8.7;border:0;padding:0;background:#e8eef7;cursor:pointer;overflow:hidden}.itl-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease}.itl-thumb:hover img{transform:scale(1.025)}.itl-thumb:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(8,23,45,.28))}.itl-play{position:absolute;z-index:2;left:18px;bottom:16px;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:#fff;color:var(--itl-blue);box-shadow:0 8px 20px rgba(0,0,0,.15);font-size:15px;padding-left:2px}
.itl-video-body{padding:16px 17px 18px}.itl-card-meta{display:flex;align-items:center;gap:8px;color:var(--itl-muted);font-size:12px;font-weight:750}.itl-badge{color:var(--itl-blue);background:var(--itl-sky);padding:5px 8px;border-radius:999px}.itl-video-body h3{font-size:18px;line-height:1.3;color:var(--itl-navy);margin:10px 0 6px}.itl-teacher{margin:0 0 10px;color:var(--itl-green);font-size:13px;font-weight:800}.itl-focus,.itl-why{font-size:13px;line-height:1.45;margin:7px 0;color:var(--itl-muted)}.itl-focus strong{color:var(--itl-ink)}.itl-card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.itl-btn{appearance:none;border-radius:11px;padding:9px 11px;font-size:12px;font-weight:800;text-decoration:none;border:1px solid transparent;cursor:pointer;line-height:1.2}.itl-btn-primary{background:var(--itl-navy);color:#fff}.itl-btn-primary:hover{background:#173c78;color:#fff}.itl-btn-secondary{background:#fff;color:var(--itl-blue);border-color:#c7d8f4}.itl-btn-secondary:hover{background:#f7faff;color:#1d58bc}
.itl-workspace{position:sticky;top:24px;background:#fff;border:1px solid var(--itl-line);border-radius:24px;box-shadow:var(--itl-shadow);overflow:hidden}.itl-workspace-head{padding:20px 22px;border-bottom:1px solid var(--itl-line);background:linear-gradient(90deg,#fff,#f8fbff)}.itl-workspace-head h3{font-size:21px;line-height:1.3;margin:5px 0 2px;color:var(--itl-navy)}.itl-workspace-head p{margin:0;color:var(--itl-green);font-size:13px;font-weight:800}
.itl-study-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(280px,.8fr);min-height:590px}.itl-player-wrap{background:#09111f;min-height:470px}.itl-player-wrap iframe{display:block;width:100%;height:100%;min-height:590px;border:0}.itl-player-empty{height:100%;min-height:590px;display:grid;place-items:center;color:#d9e0ea;text-align:center;padding:30px}
.itl-notes-panel{display:flex;flex-direction:column;padding:20px;border-left:1px solid var(--itl-line);background:#fcfdfd}.itl-notes-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}.itl-notes-head h4{font-size:18px;margin:5px 0 0;color:var(--itl-navy)}.itl-save-status{font-size:11px;font-weight:850;color:var(--itl-muted);padding:5px 7px;border-radius:999px;background:#f0f2f5;white-space:nowrap}.itl-save-status[data-status="saved"]{background:var(--itl-mint);color:var(--itl-green)}.itl-save-status[data-status="saving"]{background:#fff7e6;color:#9b6b09}.itl-save-status[data-status="error"]{background:#fff0ed;color:#b34634}.itl-notes-panel textarea{width:100%;flex:1;min-height:400px;border:1px solid #d7e0ea;border-radius:16px;background:#fff;padding:16px;resize:vertical;font:15px/1.6 inherit;color:var(--itl-ink);outline:none}.itl-notes-panel textarea:focus{border-color:#79a7ef;box-shadow:0 0 0 3px rgba(45,108,223,.1)}.itl-note-tip{font-size:11px;color:var(--itl-muted);margin-top:10px}
.itl-empty{background:#fff;border:1px solid var(--itl-line);border-radius:24px;padding:38px;text-align:center}
.itl-login-page{min-height:72vh;display:grid;place-items:center;padding:30px;background:radial-gradient(circle at top left,#edf6ff,transparent 35%),radial-gradient(circle at bottom right,#eff9ef,transparent 35%)}.itl-login-card{width:min(100%,460px);background:#fff;border:1px solid var(--itl-line);border-radius:28px;padding:34px;box-shadow:var(--itl-shadow)}.itl-brand-login{margin-bottom:30px}.itl-login-card h1{font-size:32px;line-height:1.08;margin:8px 0 10px;color:var(--itl-navy)}.itl-login-card>p{color:var(--itl-muted);line-height:1.55}.itl-login-form label{display:block;font-size:13px;font-weight:800;color:var(--itl-ink);margin-bottom:6px}.itl-login-form input[type="text"],.itl-login-form input[type="password"]{width:100%;border:1px solid var(--itl-line);border-radius:12px;padding:12px 13px;font-size:15px}.itl-login-form .login-submit input{width:100%;border:0;border-radius:12px;padding:13px 16px;background:var(--itl-navy);color:#fff;font-weight:850;cursor:pointer}.itl-login-form .login-remember label{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--itl-muted)}.itl-forgot{font-size:13px;color:var(--itl-blue);text-decoration:none;font-weight:700}

@media (max-width:1100px){.itl-library-layout{grid-template-columns:340px minmax(0,1fr)}.itl-study-grid{grid-template-columns:1fr}.itl-notes-panel{border-left:0;border-top:1px solid var(--itl-line)}.itl-player-wrap iframe,.itl-player-empty{min-height:420px}}
@media (max-width:900px){.itl-shell{padding-left:14px;padding-right:14px}.itl-hero{padding:28px 24px}.itl-hero-stat{display:none}.itl-library-layout{grid-template-columns:1fr}.itl-library{max-height:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}.itl-workspace{position:static}.itl-topic-heading{align-items:flex-start;flex-direction:column}.itl-topic-count{align-self:flex-start}}
@media (max-width:640px){.itl-topbar{align-items:flex-start}.itl-user-name{display:none}.itl-hero h1{font-size:34px}.itl-library{grid-template-columns:1fr}.itl-study-grid{display:block}.itl-player-wrap iframe,.itl-player-empty{min-height:230px;aspect-ratio:16/9}.itl-notes-panel textarea{min-height:300px}.itl-topic-heading h2{font-size:30px}.itl-login-card{padding:26px 21px;border-radius:22px}}
