:root {
  /* Ad-ready layout v24 */
  --ink: #172236;
  --muted: #697386;
  --paper: #f7f8fa;
  --white: #ffffff;
  --purple: #6254d9;
  --purple-dark: #493daf;
  --purple-soft: #eeecff;
  --teal: #16a394;
  --teal-dark: #0d746c;
  --orange: #f39b43;
  --line: #e7e9ee;
  --shadow: 0 18px 50px rgba(28, 34, 66, .08);
  --radius: 18px;
}

.ad-section{padding:28px 0;background:#fff}
.compact-ad{padding:0 0 34px}
.ad-slot{min-height:96px;display:grid;place-items:center;border:1px dashed #d8d4ff;border-radius:14px;color:#7c729f;background:linear-gradient(135deg,#fbfaff,#f7fbfb);text-align:center}
.ad-slot-wide{min-height:120px}
.ad-slot-note{font-size:10px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.cookie-consent{position:fixed;left:18px;right:18px;bottom:18px;z-index:90;max-width:920px;margin:auto;padding:16px;display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid #dedce9;border-radius:16px;background:#fff;box-shadow:0 18px 50px rgba(28,34,66,.16)}
.cookie-consent strong{display:block;margin-bottom:4px;font-size:12px}
.cookie-consent p{margin:0;color:#697386;font-size:9px;line-height:1.55}
.cookie-actions{display:flex;gap:8px;flex:0 0 auto}
.cookie-actions button{padding:9px 13px;border:1px solid var(--purple);border-radius:8px;color:var(--purple);background:#fff;font-size:9px;font-weight:850}
.cookie-actions [data-cookie-accept]{color:#fff;background:var(--purple)}
@media(max-width:620px){.cookie-consent{display:block}.cookie-actions{margin-top:12px}.ad-section{padding:18px 0}}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--white);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
.container { width: min(1160px, calc(100% - 40px)); margin: 0 auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.announcement-bar { background: var(--ink); color: #fff; font-size: 12px; }
.announcement-inner { min-height: 35px; display: flex; align-items: center; justify-content: center; gap: 12px; }
.announcement-inner p { margin: 0; color: #d5d9e1; }
.announcement-inner a { color: #fff; font-weight: 700; }
.announcement-label { padding: 3px 8px; border-radius: 999px; color: #27214f; background: #dcd8ff; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; }

.site-header { height: 78px; display: flex; align-items: center; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.96); position: sticky; top: 0; z-index: 20; backdrop-filter: blur(14px); }
.nav-wrap { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 10px; }
.brand-mark { width: 39px; height: 39px; display: grid; place-items: center; background: var(--purple); border-radius: 12px 12px 12px 4px; color: #fff; font-size: 13px; font-weight: 900; transform: rotate(-3deg); box-shadow: 0 5px 12px rgba(98,84,217,.28); }
.brand-copy { display: flex; flex-direction: column; line-height: 1.12; }
.brand-copy strong { font-size: 16px; letter-spacing: -.04em; }
.brand-copy small { margin-top: 4px; color: #8991a1; font-size: 8px; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; }
.main-nav { display: flex; align-items: center; gap: 33px; margin-left: auto; }
.main-nav a { color: #646d7d; font-size: 12px; font-weight: 650; position: relative; }
.main-nav a:hover, .main-nav .active { color: var(--purple); }
.main-nav .active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -28px; height: 2px; background: var(--purple); }
.nav-cta { padding: 11px 17px; border: 1px solid var(--purple); border-radius: 9px; color: var(--purple); background:#fff; font-size: 11px; font-weight: 800; transition: .2s ease; cursor:pointer; }
.nav-cta:hover { background: var(--purple); color: #fff; transform: translateY(-1px); }
.menu-toggle { display: none; border: 0; background: transparent; padding: 8px; }
.menu-toggle span { display: block; width: 22px; height: 2px; margin: 4px; background: var(--ink); transition: .2s ease; }

.hero { position: relative; overflow: hidden; background: linear-gradient(120deg, #f8f7ff 0%, #fff 52%, #f4fbfa 100%); border-bottom: 1px solid var(--line); }
.hero::before { content: ""; position: absolute; width: 600px; height: 600px; right: -320px; top: -200px; border-radius: 50%; background: rgba(82,190,172,.08); }
.hero-grid { min-height: 510px; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 50px; padding-top: 30px; padding-bottom: 44px; }
.eyebrow { display: flex; align-items: center; gap: 9px; color: var(--purple); font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: .12em; }
.eyebrow span { width: 20px; height: 2px; background: var(--orange); }
.hero h1 { max-width: 630px; margin: 18px 0 17px; font-size: clamp(44px, 5.1vw, 67px); line-height: .99; letter-spacing: -.065em; }
.hero h1 em { color: var(--purple); font-style: normal; }
.hero-copy > p { max-width: 520px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.75; }
.hero-search { width: min(525px, 100%); margin-top: 28px; padding: 5px 5px 5px 16px; display: flex; align-items: center; gap: 10px; border: 1px solid #e1e0eb; border-radius: 13px; background: #fff; box-shadow: 0 14px 35px rgba(47,43,94,.09); }
.hero-search:focus-within { border-color: var(--purple); box-shadow: 0 14px 35px rgba(98,84,217,.15); }
.hero-search svg { width: 18px; fill: none; stroke: #8e95a3; stroke-width: 2; }
.hero-search input { flex: 1; min-width: 0; padding: 11px 2px; border: 0; outline: 0; color: var(--ink); font-size: 12px; }
.hero-search button { padding: 11px 24px; border: 0; border-radius: 9px; color: #fff; background: var(--purple); font-size: 11px; font-weight: 800; cursor: pointer; transition: .2s ease; }
.hero-search button:hover { background: var(--purple-dark); }
.hero-tags { margin-top: 14px; display: flex; align-items: center; gap: 9px; color: #969cab; font-size: 9px; font-weight: 700; }
.hero-tags button { padding: 0; border: 0; border-bottom: 1px solid #d8dbe2; color: #656d7e; background: none; font-size: 9px; cursor: pointer; }
.hero-visual { min-height: 400px; position: relative; }
.orbit { position: absolute; border-radius: 50%; border: 1px dashed rgba(98,84,217,.19); }
.orbit-one { width: 370px; height: 370px; right: 20px; top: 10px; }
.orbit-two { width: 290px; height: 290px; right: 60px; top: 50px; border-color: rgba(22,163,148,.18); }
.book-stack { position: absolute; width: 260px; height: 320px; right: 73px; top: 38px; transform: rotate(3deg); }
.book { position: absolute; border-radius: 9px 14px 14px 9px; box-shadow: 12px 18px 28px rgba(30,35,56,.18); }
.book::after { content: ""; position: absolute; right: 5px; top: 6px; bottom: 6px; width: 5px; border-radius: 4px; background: rgba(255,255,255,.35); }
.book-back { width: 200px; height: 265px; left: 2px; bottom: 0; background: var(--orange); transform: rotate(-15deg); }
.book-mid { width: 205px; height: 275px; left: 35px; bottom: 4px; background: var(--teal); transform: rotate(-5deg); }
.book span:not(.book-label) { position: absolute; left: 16px; bottom: 18px; color: rgba(255,255,255,.72); font-size: 9px; font-weight: 900; letter-spacing: .15em; }
.book-front { width: 215px; height: 285px; right: 0; top: 0; padding: 30px 28px; color: #fff; background: linear-gradient(145deg, #6d5ee1, #4b3cb3); }
.book-front .book-label { display: inline-block; position: static; padding: 5px 8px; border-radius: 4px; background: #fff; color: var(--purple); font-size: 9px; font-weight: 900; letter-spacing: .08em; }
.book-front strong { display: grid; gap: 2px; margin-top: 38px; font-size: 33px; line-height: .95; letter-spacing: -.05em; }
.book-front strong span { position: static !important; display:block; color:inherit !important; font:inherit; letter-spacing:inherit; line-height:inherit; }
.book-line { width: 35px; height: 3px; margin: 17px 0 10px; background: var(--orange); }
.book-front small { color: #dedaff; font-size: 9px; font-weight: 700; }
.pencil { position: absolute; width: 13px; height: 230px; right: -22px; top: 60px; border-radius: 4px; background: linear-gradient(90deg, #f3b455 0 34%, #ffd782 34% 67%, #f3b455 67%); transform: rotate(24deg); box-shadow: 5px 7px 14px rgba(35,38,56,.14); }
.pencil::before { content: ""; position: absolute; top: -24px; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 25px solid #ded5c4; }
.floating-card { position: absolute; z-index: 2; padding: 10px 13px; display: flex; align-items: center; gap: 9px; border: 1px solid rgba(255,255,255,.8); border-radius: 10px; background: rgba(255,255,255,.92); box-shadow: 0 12px 30px rgba(40,45,70,.12); animation: float 4s ease-in-out infinite; }
.floating-card strong, .floating-card small { display: block; }
.floating-card strong { font-size: 12px; }
.floating-card small { margin-top: 2px; color: #8a91a0; font-size: 7px; }
.card-score { left: 3px; top: 70px; }
.card-streak { right: -7px; bottom: 50px; animation-delay: -2s; }
.mini-icon { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 8px; font-size: 12px; font-weight: 900; }
.mini-icon.blue { background: var(--purple-soft); color: var(--purple); }
.mini-icon.orange { background: #fff1df; color: #dc812b; }
.formula { position: absolute; color: rgba(98,84,217,.28); font-family: Georgia, serif; font-size: 13px; font-style: italic; font-weight: 700; }
.formula-one { right: 15px; top: 40px; transform: rotate(10deg); }
.formula-two { left: 46px; bottom: 60px; color: rgba(22,163,148,.32); transform: rotate(-12deg); }
.hero-dots { position: absolute; width: 100px; height: 100px; opacity: .35; background-image: radial-gradient(var(--purple) 1px, transparent 1px); background-size: 13px 13px; }
.hero-dots-one { left: 2%; bottom: 18%; }
.hero-dots-two { right: 3%; top: 10%; background-image: radial-gradient(var(--teal) 1px, transparent 1px); }
@keyframes float { 50% { transform: translateY(-7px); } }
.stats-strip { min-height: 74px; display: grid; grid-template-columns: repeat(4,1fr); align-items: center; border-top: 1px solid var(--line); }
.stats-strip div { padding: 0 28px; display: flex; align-items: baseline; gap: 8px; border-right: 1px solid var(--line); }
.stats-strip div:first-child { padding-left: 0; }
.stats-strip div:last-child { border-right: 0; }
.stats-strip strong { color: var(--purple); font-size: 17px; letter-spacing: -.04em; }
.stats-strip span { color: #89909e; font-size: 9px; font-weight: 650; }

.section { padding: 78px 0; }
.quick-section { background: #fff; }
.section-heading { margin-bottom: 32px; display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; }
.section-heading.compact { margin-bottom: 26px; }
.section-kicker { display: block; margin-bottom: 9px; color: var(--purple); font-size: 9px; font-weight: 850; text-transform: uppercase; letter-spacing: .14em; }
.section-kicker.light { color: #bbb4ff; }
.section-heading h2, .announcement-copy h2, .newsletter h2 { margin: 0; font-size: 31px; line-height: 1.1; letter-spacing: -.045em; }
.section-heading p { max-width: 350px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.7; }
.subject-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.subject-card { min-height: 185px; padding: 27px; position: relative; display: flex; gap: 18px; overflow: hidden; border-radius: var(--radius); color: #fff; transition: transform .25s ease, box-shadow .25s ease; }
.subject-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.math-card { background: linear-gradient(135deg, #6253d9, #5144bd); }
.science-card { background: linear-gradient(135deg, #159f91, #0d8278); }
.subject-icon { width: 42px; height: 42px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.3); border-radius: 12px; background: rgba(255,255,255,.12); font-family: Georgia, serif; font-size: 19px; font-weight: 700; }
.subject-info { position: relative; z-index: 2; }
.subject-info span { font-size: 10px; text-transform: uppercase; letter-spacing: .11em; color: rgba(255,255,255,.7); font-weight: 800; }
.subject-info strong { display: block; margin-top: 10px; font-size: 16px; line-height: 1.4; }
.subject-info small { display: block; margin-top: 22px; color: rgba(255,255,255,.7); font-size: 9px; font-weight: 700; }
.subject-info b { margin-left: 5px; color: #fff; font-size: 13px; }
.subject-art { position: absolute; right: 0; bottom: 0; width: 185px; height: 160px; opacity: .22; }
.math-art i { position: absolute; border: 2px solid #fff; }
.math-art i:nth-child(1) { width: 75px; height: 75px; right: 24px; top: 36px; border-radius: 50%; }
.math-art i:nth-child(2) { width: 95px; height: 2px; right: 10px; top: 73px; transform: rotate(-28deg); border-width: 1px; }
.math-art i:nth-child(3) { width: 55px; height: 55px; right: 62px; bottom: -16px; transform: rotate(45deg); }
.science-art i { position: absolute; width: 110px; height: 45px; right: 25px; top: 65px; border: 2px solid #fff; border-radius: 50%; transform: rotate(var(--r)); }
.science-art i:nth-child(1) { --r: 0deg; }
.science-art i:nth-child(2) { --r: 60deg; }
.science-art i:nth-child(3) { --r: -60deg; }
.grade-pills { margin-top: 23px; padding: 14px 17px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }
.grade-pills span { margin-right: 7px; color: #868e9d; font-size: 9px; font-weight: 800; }
.grade-pills button, .filter-button { padding: 8px 15px; border: 1px solid var(--line); border-radius: 8px; color: #667080; background: #fff; font-size: 9px; font-weight: 750; cursor: pointer; transition: .2s ease; }
.grade-pills button:hover, .grade-pills .selected, .filter-button:hover, .filter-button.active { border-color: var(--purple); color: #fff; background: var(--purple); }
.lesson-list{margin-top:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.lesson-card{padding:18px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:0 5px 18px rgba(25,34,57,.035)}.lesson-card.plus-locked{border-color:#ded7ff;background:linear-gradient(180deg,#fff,#fbfaff)}.lesson-card span{color:var(--purple);font-size:7px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}.lesson-card h3{margin:9px 0 6px;font-size:13px}.lesson-card p{min-height:30px;margin:0;color:#858d9b;font-size:8px;line-height:1.6}.lesson-card button{margin-top:13px;padding:0;border:0;color:var(--purple);background:none;font-size:8px;font-weight:850;cursor:pointer}

.resources-section { background: var(--paper); border-top: 1px solid var(--line); }
.text-link, .light-link { padding: 0; border: 0; background: transparent; color: var(--purple); font-size: 10px; font-weight: 800; cursor: pointer; }
.text-link span, .light-link span { margin-left: 5px; font-size: 13px; transition: margin .2s ease; }
.text-link:hover span, .light-link:hover span { margin-left: 9px; }
.filter-row { margin-bottom: 22px; display: flex; gap: 7px; }
.resource-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 19px; }
.resource-card { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: 0 5px 18px rgba(25,34,57,.035); transition: .25s ease; }
.resource-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.resource-card.hidden { display: none; }
.resource-cover { height: 150px; position: relative; overflow: hidden; }
.cover-purple { background: linear-gradient(135deg, #eeeaff, #dad3ff); }
.cover-teal { background: linear-gradient(135deg, #e4f7f3, #bcebe2); }
.cover-orange { background: linear-gradient(135deg, #fff2df, #ffddb2); }
.cover-chip { position: absolute; left: 14px; top: 14px; padding: 4px 7px; border-radius: 5px; background: rgba(255,255,255,.8); color: #6c7180; font-size: 7px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.cover-symbol { position: absolute; left: 50%; top: 50%; color: var(--purple); font-family: Georgia, serif; font-size: 52px; font-weight: 700; transform: translate(-50%,-46%) rotate(-5deg); }
.cover-symbol sup { font-size: 22px; }
.cover-number { position: absolute; left: 50%; top: 50%; color: #e28b35; font-size: 56px; font-weight: 900; line-height: 1; transform: translate(-50%,-50%) rotate(-4deg); }
.cover-number::after { content: "SORU"; position: absolute; left: 50%; bottom: -11px; transform: translateX(-50%); font-size: 7px; letter-spacing: .16em; }
.cover-pages { position: absolute; width: 105px; height: 132px; right: -24px; bottom: -45px; border: 8px solid rgba(255,255,255,.35); border-radius: 9px; transform: rotate(25deg); }
.dna-art { width: 58px; height: 105px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(15deg); border-left: 4px solid var(--teal); border-right: 4px solid var(--teal); border-radius: 50%; }
.dna-art i { position: absolute; left: -1px; width: 52px; height: 2px; background: var(--teal); transform: rotate(var(--r)); }
.dna-art i:nth-child(1) { top: 12px; --r: 18deg; }
.dna-art i:nth-child(2) { top: 31px; --r: -18deg; }
.dna-art i:nth-child(3) { top: 50px; --r: 18deg; }
.dna-art i:nth-child(4) { top: 69px; --r: -18deg; }
.dna-art i:nth-child(5) { top: 88px; --r: 18deg; }
.resource-body { padding: 18px 18px 15px; }
.resource-meta { display: flex; align-items: center; justify-content: space-between; }
.resource-meta time { color: #9a9fab; font-size: 8px; }
.tag { padding: 4px 7px; border-radius: 5px; font-size: 7px; font-weight: 850; }
.tag.purple { color: var(--purple); background: var(--purple-soft); }
.tag.teal { color: var(--teal-dark); background: #e3f7f3; }
.tag.orange-tag { color: #c7782a; background: #fff0dc; }
.resource-body h3 { min-height: 40px; margin: 12px 0 6px; font-size: 14px; line-height: 1.4; letter-spacing: -.025em; }
.resource-body p { min-height: 34px; margin: 0; color: #858d9b; font-size: 9px; line-height: 1.65; }
.resource-footer { margin-top: 15px; padding-top: 12px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); }
.resource-footer span { color: #969daa; font-size: 8px; font-weight: 650; }
.download-btn { padding: 5px 0; border: 0; color: var(--purple); background: none; font-size: 9px; font-weight: 850; cursor: pointer; }
.empty-state { display: none; margin: 35px 0 0; padding: 20px; border: 1px dashed #ccd0da; border-radius: 12px; text-align: center; color: var(--muted); font-size: 12px; }
.empty-state.visible { display: block; }
.plus-badge { position:absolute;right:12px;top:12px;z-index:3;padding:5px 8px;border-radius:6px;color:#fff;background:linear-gradient(135deg,#8b63e8,#5944c8);font-size:7px;font-weight:900;letter-spacing:.08em;box-shadow:0 5px 12px rgba(74,52,160,.25) }
.resource-card.plus-locked .resource-cover:after { content:"REKLAMLA AÇILIR";position:absolute;inset:0;display:grid;place-items:center;color:#fff;background:rgba(30,25,58,.58);backdrop-filter:blur(2px);font-size:9px;font-weight:900;letter-spacing:.1em }
.tests-section { background:#fff; }.test-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.test-card{padding:20px;border:1px solid var(--line);border-radius:14px;background:var(--paper);transition:.2s}.test-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.test-card-top{display:flex;align-items:center;justify-content:space-between}.test-card-top span{padding:4px 7px;border-radius:6px;color:var(--purple);background:var(--purple-soft);font-size:7px;font-weight:850}.test-card-top b{color:#9aa1ad;font-size:8px}.test-card h3{margin:15px 0 6px;font-size:14px}.test-card p{margin:0;color:#87909e;font-size:9px}.test-card button{width:100%;margin-top:18px;padding:9px;border:0;border-radius:7px;color:#fff;background:var(--purple);font-size:9px;font-weight:850;cursor:pointer}
.site-dialog{width:min(430px,calc(100% - 26px));padding:0;border:0;border-radius:15px;box-shadow:0 25px 70px rgba(20,27,46,.25)}.site-dialog::backdrop{background:rgba(20,27,46,.65);backdrop-filter:blur(3px)}.site-dialog form{padding:28px;position:relative;display:grid;gap:11px}.site-dialog h2{margin:0;font-size:22px}.site-dialog p{margin:0 0 4px;color:var(--muted);font-size:10px;line-height:1.6}.site-dialog input{padding:11px;border:1px solid var(--line);border-radius:8px;outline:0}.site-dialog form>button[type=submit]{padding:11px;border:0;border-radius:8px;color:#fff;background:var(--purple);font-size:9px;font-weight:850}.site-dialog small{color:#9299a5;font-size:8px}.dialog-close{position:absolute;right:14px;top:12px;z-index:5;border:0;background:none;color:#8b93a0;font-size:20px;cursor:pointer}
.member-shell{position:relative;padding-top:4px}.member-links{display:flex;justify-content:space-between;gap:10px}.member-links button{padding:2px 0;border:0;color:var(--purple);background:none;font-size:8px;font-weight:800}.member-links button:only-child{margin:auto}.member-account{padding:32px;display:grid;gap:12px;text-align:center}.member-account p{margin:0}.member-account button{padding:10px;border:1px solid var(--line);border-radius:8px;color:#667080;background:#fff;font-size:9px;font-weight:850}
.consent-line{display:flex!important;align-items:flex-start;gap:7px;color:#737d8d;font-size:8px;line-height:1.5}.consent-line input{width:auto;margin-top:2px}.consent-line a{color:var(--purple);font-weight:800}
.test-dialog{width:min(760px,calc(100% - 26px))}.test-player-head{padding:22px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}.test-player-head h2{margin:4px 0 0}.test-player-head button{border:0;background:none;font-size:20px}.test-form{max-height:65vh;overflow:auto;padding:20px}.player-question{margin-bottom:18px;padding:16px;border:1px solid var(--line);border-radius:10px}.question-title{margin:0 0 12px;display:grid;grid-template-columns:auto 1fr;gap:5px;font-size:11px;line-height:1.6}.question-title p,.question-title div{margin-top:0}.question-title img{display:block;max-width:100%;max-height:430px;margin:12px auto;border-radius:8px}.player-options{display:grid;gap:7px}.player-options label{padding:9px;display:flex;gap:8px;border:1px solid var(--line);border-radius:7px;color:#657083;font-size:9px;cursor:pointer}.player-options input{width:auto}.finish-test{width:100%;padding:12px;border:0;border-radius:8px;color:#fff;background:var(--purple);font-size:10px;font-weight:850}.result-box{padding:35px;text-align:center}.result-score{margin:20px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.result-score div{padding:15px;border-radius:10px;background:var(--paper)}.result-score strong{display:block;font-size:24px}.result-score span{color:#8b93a1;font-size:8px}.result-box button{padding:10px 17px;border:0;border-radius:8px;color:#fff;background:var(--purple);font-size:9px;font-weight:850}
.plus-section{padding:48px 0;background:#fff}.plus-box{padding:34px 40px;display:flex;align-items:center;justify-content:space-between;gap:30px;border-radius:18px;color:#fff;background:linear-gradient(135deg,#1d2740,#493daf);box-shadow:var(--shadow)}.plus-box>div{position:relative;padding-left:62px}.plus-star{width:45px;height:45px;position:absolute;left:0;top:0;display:grid;place-items:center;border-radius:12px;color:#ffe089;background:rgba(255,255,255,.12);font-size:20px}.plus-box h2{margin:0;font-size:25px;letter-spacing:-.04em}.plus-box p{margin:8px 0 0;color:#c9c9e5;font-size:9px}.plus-action{padding:11px 17px;border-radius:8px;color:var(--purple);background:#fff;font-size:9px;font-weight:850;white-space:nowrap}
.games-preview-section{background:#fff}.games-preview{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center}.games-preview h2{margin:8px 0 10px;font-size:34px;letter-spacing:-.05em}.games-preview p{max-width:620px;color:var(--muted);font-size:14px;line-height:1.8}.game-mini-card{padding:24px;border:1px solid #dedcff;border-radius:24px;background:linear-gradient(145deg,#fbfaff,#eef8ff);box-shadow:0 20px 45px rgba(29,39,64,.09)}.game-mini-card span{color:var(--purple);font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.game-mini-card strong{display:block;margin:8px 0 18px;font-size:25px;letter-spacing:-.04em}.mini-sudoku{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.mini-sudoku i{height:54px;display:grid;place-items:center;border-radius:12px;background:#fff;color:#5b50c8;font-size:22px;font-style:normal;font-weight:950;box-shadow:inset 0 0 0 1px #e6e3ff}.mini-sudoku i:empty{background:#f4f7fb}
.content-dialog{width:min(720px,calc(100% - 26px))}.content-view-head{padding:22px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}.content-view-head h2{margin:4px 0 0}.content-view-head button{border:0;background:none;font-size:20px;cursor:pointer}.content-view-body{max-height:65vh;overflow:auto;padding:25px;color:#4f5a6d;font-size:11px;line-height:1.8}.content-view-body h1,.content-view-body h2,.content-view-body h3,.content-view-body h4,.content-view-body h5{color:var(--ink)}.content-view-body a{color:var(--purple);text-decoration:underline}.content-view-body sup,.content-view-body sub{font-size:.75em}.content-view-body .math-root{display:inline-flex;align-items:flex-start;gap:2px}.content-view-body .math-root>span{padding:0 3px;border-top:1px solid currentColor}.content-view-body .color-block{margin:13px 0;padding:13px 15px;border-radius:10px;border:1px solid #dedcf6;background:#f5f3ff}.content-view-body .color-block.blue{border-color:#c9dcff;background:#eef5ff}.content-view-body .color-block.green{border-color:#c9e9e3;background:#ecfaf7}.content-view-body .color-block.orange{border-color:#ffdfb8;background:#fff5e8}.content-view-body .color-block.red{border-color:#f3ccd2;background:#fff0f2}.content-view-body .color-block.yellow{border-color:#f5e6a8;background:#fffbea}.content-view-body .color-block.teal{border-color:#bce7df;background:#e9fbf8}.content-view-body .color-block.gray{border-color:#d9dee8;background:#f4f6f9}.content-view-body .color-block.custom{border-color:var(--block-border,#dedcf6);background:var(--block-bg,#f5f3ff)}.content-view-body:after{content:"";display:block;clear:both}.content-view-body img{display:block;max-width:100%;height:auto;margin:15px auto;border-radius:8px}
.ad-dialog{width:min(500px,calc(100% - 26px))}.ad-unlock{position:relative;padding:30px}.ad-unlock>[data-close-ad]{position:absolute;right:14px;top:12px;border:0;background:none;color:#8b93a0;font-size:20px;cursor:pointer}.ad-unlock h2{margin:4px 0 8px}.ad-unlock p{margin:0;color:var(--muted);font-size:11px;line-height:1.7}.ad-box{height:130px;margin:18px 0;display:grid;place-items:center;border:1px dashed #c9c3f8;border-radius:12px;color:var(--purple);background:#f5f3ff;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.ad-unlock .finish-test:disabled{opacity:.55;cursor:not-allowed}
body:has(dialog[open]){overflow:hidden}.lesson-frame{width:100%;height:calc(100vh - 185px);min-height:0;border:0;border-radius:14px;background:#fff}.content-dialog:has(.lesson-frame){width:min(1180px,calc(100% - 26px));max-height:calc(100vh - 26px);overflow:hidden}.content-view-body:has(.lesson-frame){max-height:none;overflow:hidden;padding:10px;background:#fffcf5}

.announcement-section { overflow: hidden; position: relative; background: var(--ink); color: #fff; }
.announcement-section::before { content: ""; position: absolute; width: 500px; height: 500px; left: -270px; top: -170px; border-radius: 50%; border: 80px solid rgba(98,84,217,.1); }
.announcement-grid { position: relative; display: grid; grid-template-columns: .8fr 1.2fr; gap: 85px; }
.announcement-copy { padding-top: 10px; }
.announcement-copy h2 { font-size: 39px; }
.announcement-copy p { max-width: 300px; margin: 18px 0 25px; color: #adb4c0; font-size: 11px; line-height: 1.8; }
.light-link { color: #fff; }
.news-list { display: grid; gap: 9px; }
.news-item { width:100%; padding: 15px 17px; display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 17px; border: 1px solid rgba(255,255,255,.09); border-radius: 11px; color:#fff; background: rgba(255,255,255,.045); text-align:left; cursor:pointer; transition: .2s ease; }
.news-item:hover { border-color: rgba(187,180,255,.4); background: rgba(255,255,255,.075); transform: translateX(3px); }
.news-item time { min-height: 48px; display: grid; place-content: center; text-align: center; border-radius: 8px; color: #fff; background: rgba(98,84,217,.35); }
.news-item time strong { font-size: 16px; line-height: 1; }
.news-item time span { margin-top: 3px; color: #bfb9f2; font-size: 6px; font-weight: 800; }
.news-type { color: #aaa3ef; font-size: 7px; text-transform: uppercase; letter-spacing: .09em; font-weight: 800; }
.news-item h3 { margin: 4px 0 3px; font-size: 11px; }
.news-item p { margin: 0; color: #8991a0; font-size: 8px; }
.news-item b { color: #8e96a5; font-size: 13px; }

.newsletter-section { padding: 55px 0; background: #fff; }
.newsletter { padding: 32px 38px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 70px; border: 1px solid #e6e3ff; border-radius: var(--radius); background: linear-gradient(135deg, #f3f1ff, #f7fbfb); }
.newsletter > div { padding-left: 52px; position: relative; }
.newsletter-icon { width: 38px; height: 38px; position: absolute; left: 0; top: 0; display: grid; place-items: center; border-radius: 10px; color: #fff; background: var(--purple); font-size: 17px; }
.newsletter h2 { font-size: 23px; }
.newsletter p { margin: 8px 0 0; color: var(--muted); font-size: 9px; line-height: 1.6; }
.newsletter form { position: relative; padding: 5px; display: flex; border: 1px solid #dedce9; border-radius: 10px; background: #fff; }
.newsletter input { min-width: 0; flex: 1; padding: 10px 11px; border: 0; outline: 0; font-size: 10px; }
.newsletter button { padding: 10px 16px; border: 0; border-radius: 7px; color: #fff; background: var(--purple); font-size: 9px; font-weight: 800; cursor: pointer; }
.newsletter form small { position: absolute; left: 3px; top: calc(100% + 8px); color: #9aa0ac; font-size: 7px; }
footer { padding: 30px 0; border-top: 1px solid var(--line); }
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.footer-brand .brand-mark { width: 31px; height: 31px; font-size: 10px; border-radius: 9px 9px 9px 3px; }
.footer-brand .brand-copy strong { font-size: 13px; }
.footer-inner p, .footer-links { color: #9299a6; font-size: 8px; }
.footer-links { display: flex; gap: 17px; font-weight: 700; }
.toast { position: fixed; right: 22px; bottom: 22px; z-index: 50; padding: 12px 16px; border-radius: 9px; color: #fff; background: var(--ink); box-shadow: var(--shadow); font-size: 10px; font-weight: 700; opacity: 0; transform: translateY(15px); pointer-events: none; transition: .25s ease; }
.toast.show { opacity: 1; transform: translateY(0); }

@media (max-width: 900px) {
  .main-nav, .nav-cta { display: none; }
  .menu-toggle { display: block; margin-left: auto; }
  .main-nav.open { position: absolute; left: 0; right: 0; top: 77px; padding: 20px; display: grid; gap: 18px; border-bottom: 1px solid var(--line); background: #fff; box-shadow: var(--shadow); }
  .main-nav .active::after { display: none; }
  .hero-grid { grid-template-columns: 1fr; padding-top: 70px; }
  .hero-copy { text-align: center; }
  .eyebrow, .hero-tags { justify-content: center; }
  .hero-copy > p, .hero-search { margin-left: auto; margin-right: auto; }
  .hero-visual { min-height: 390px; width: min(460px, 100%); margin: 0 auto; }
  .stats-strip { grid-template-columns: repeat(2,1fr); padding: 15px 0; }
  .stats-strip div { min-height: 44px; padding: 0 15px; justify-content: center; }
  .stats-strip div:nth-child(2) { border-right: 0; }
  .subject-grid, .announcement-grid { grid-template-columns: 1fr; }
  .games-preview { grid-template-columns: 1fr; }
  .announcement-grid { gap: 38px; }
  .resource-grid { grid-template-columns: repeat(2,1fr); }
  .newsletter { grid-template-columns: 1fr; gap: 26px; }
}

@media (max-width: 620px) {
  .container { width: min(100% - 26px, 1160px); }
  .announcement-inner p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .announcement-inner a { display: none; }
  .site-header { height: 67px; }
  .main-nav.open { top: 66px; }
  .hero-grid { min-height: auto; padding-top: 55px; }
  .hero h1 { font-size: 42px; }
  .hero-copy > p { font-size: 13px; }
  .hero-tags { flex-wrap: wrap; }
  .hero-visual { min-height: 330px; transform: scale(.88); margin-top: -25px; margin-bottom: -25px; }
  .book-stack { right: 40px; }
  .card-score { left: -5px; }
  .card-streak { right: -8px; }
  .stats-strip { width: 100%; }
  .stats-strip div { flex-direction: column; align-items: center; gap: 2px; text-align: center; }
  .section { padding: 56px 0; }
  .section-heading { display: block; }
  .section-heading p { margin-top: 12px; }
  .subject-grid, .resource-grid { grid-template-columns: 1fr; }
  .games-preview h2 { font-size: 28px; }
  .mini-sudoku i { height: 46px; }
  .test-card-grid { grid-template-columns:1fr; }
  .lesson-list { grid-template-columns:1fr; }
  .subject-card { min-height: 175px; }
  .grade-pills { flex-wrap: wrap; }
  .grade-pills span { width: 100%; text-align: center; margin: 0 0 4px; }
  .filter-row { overflow-x: auto; padding-bottom: 5px; }
  .filter-button { white-space: nowrap; }
  .news-item { grid-template-columns: 42px 1fr auto; gap: 11px; }
  .news-item p { display: none; }
  .newsletter { padding: 26px 19px 34px; }
  .newsletter > div { padding-left: 0; padding-top: 49px; }
  .newsletter-icon { top: 0; }
  .newsletter form { display: grid; gap: 5px; }
  .newsletter form small { top: calc(100% + 7px); }
  .footer-inner { flex-direction: column; text-align: center; }
  .plus-box{padding:27px;display:block}.plus-box button{margin-top:22px}.plus-box>div{padding-left:0;padding-top:60px}
}