:root{
  --font-app:"Poppins",sans-serif;
  --font-display:"Montserrat",sans-serif;
  --ink:#182138;
  --ink-2:#313a52;
  --muted:#7d8599;
  --line:#e8e7ef;
  --page:#f4f2fb;
  --surface:#fff;
  --primary:#7654db;
  --primary-dark:#5d3fc2;
  --lavender:#e9e1ff;
  --peach:#ffe5ca;
  --violet:#dfd4ff;
  --sky:#d9edff;
  --mint:#d8f4e9;
  --lemon:#fff1bf;
  --rose:#fbddec;
  --shadow:0 20px 55px rgba(48,42,88,.10);
  --shadow-soft:0 12px 32px rgba(48,42,88,.07);
  --radius:24px;
  --header-h:68px;
  --bottom-nav-h:72px;
  --text-body:16px;
  --text-small:14px;
  --text-label:13px;
  --text-h1:28px;
  --text-h2:23px;
  --text-h3:20px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--page);font-family:var(--font-app);font-size:var(--text-body);line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
button{color:inherit}
img,svg{display:block}
.ui-icon{width:20px;height:20px;flex:0 0 auto}
.eyebrow{display:inline-flex;color:var(--primary);font-size:var(--text-label);font-weight:700;letter-spacing:.11em;line-height:1.35}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{color:var(--ink);line-height:1.22}
h1{font-size:var(--text-h1);letter-spacing:-.035em}
h2{font-size:var(--text-h2);letter-spacing:-.025em}
h3{font-size:var(--text-h3);letter-spacing:-.018em}
p{color:var(--muted)}
.btn{min-height:44px;padding:10px 18px;border:0;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn:disabled{opacity:.65;cursor:wait;transform:none}
.btn-primary{color:#fff;background:var(--primary);box-shadow:0 10px 24px rgba(118,84,219,.25)}
.btn-primary:hover{background:var(--primary-dark)}
.btn-white{background:#fff;border:1px solid rgba(48,42,88,.08);box-shadow:var(--shadow-soft)}
.btn-ghost{background:transparent;border:1px solid var(--line)}
.btn-dark{background:var(--ink);color:#fff}
.btn-block{width:100%}
.btn-lg{min-height:50px;padding:12px 22px;border-radius:16px}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--font-app)}
.brand-mark{position:relative;width:38px;height:38px;display:block;flex:0 0 auto}
.brand-mark i{position:absolute;width:20px;height:20px;border-radius:5px;transform:rotate(45deg)}
.brand-mark i:first-child{left:3px;top:9px;background:linear-gradient(135deg,#6d4ed7,#a189f0)}
.brand-mark i:last-child{right:3px;top:9px;background:linear-gradient(135deg,#b99df8,#e1d6ff)}
.brand-copy{display:grid;line-height:1.1}
.brand-copy b{font-size:17px}
.brand-copy small{margin-top:4px;color:var(--muted);font-size:16px;font-weight:500}

/* Public landing page — no sidebar */
.public-header{position:fixed;z-index:70;left:0;right:0;top:0;height:var(--header-h);background:rgba(255,255,255,.88);border-bottom:1px solid rgba(232,231,239,.8);backdrop-filter:blur(18px)}
.public-header-inner{height:100%;max-width:1400px;margin:auto;padding:0 16px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.public-nav{display:none}
.header-actions{display:flex;align-items:center;gap:8px}
.header-login{display:none}
.header-cta{min-height:40px;padding:8px 13px;font-size:16px}
.public-main{padding-top:var(--header-h);background:#fff}
.landing-hero{position:relative;max-width:1400px;margin:auto;padding:42px 18px 54px;display:grid;gap:38px;overflow:hidden}
.landing-hero:before{content:"";position:absolute;z-index:0;inset:14px 10px;background:linear-gradient(140deg,#f1edff 0%,#f7f6ff 47%,#edf8ff 100%);border-radius:30px}
.hero-copy,.dashboard-preview{position:relative;z-index:1}
.hero-copy{padding:20px 10px 0}
.hero-copy h1{font-family:var(--font-display);font-size:clamp(36px,8vw,58px);font-weight:800;margin:13px 0 18px;max-width:760px}
.hero-copy h1 span{color:var(--primary)}
.hero-copy>p{font-size:17px;max-width:660px;margin-bottom:0}
.hero-actions{display:flex;flex-direction:column;gap:10px;margin-top:26px}
.hero-trust{display:grid;gap:8px;margin-top:24px;color:#5f687d;font-size:16px}
.hero-trust span{display:flex;align-items:center;gap:8px}
.hero-trust i{width:21px;height:21px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#4baf87;font-style:normal;font-size:16px;box-shadow:0 6px 16px rgba(37,57,89,.08)}
.dashboard-preview{margin:0 8px;padding:20px;border:1px solid rgba(255,255,255,.8);border-radius:28px;background:rgba(255,255,255,.92);box-shadow:0 26px 70px rgba(58,46,110,.15)}
.preview-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.preview-header div{display:grid}
.preview-header small{color:var(--muted);font-size:16px}
.preview-header strong{font-size:18px}
.preview-avatar{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:var(--violet);font-weight:700;color:var(--primary)}
.preview-courses{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.preview-course{position:relative;min-height:150px;padding:12px;border-radius:18px;display:flex;flex-direction:column;overflow:hidden}
.preview-course .course-symbol{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;background:rgba(255,255,255,.72);font-size:18px;font-weight:700}
.preview-course strong{margin-top:auto;font-size:16px;line-height:1.3}
.preview-course small{font-size:16px;color:#656d7e}
.preview-course i{position:absolute;right:10px;bottom:10px;width:24px;height:24px;border-radius:9px;display:grid;place-items:center;background:#fff;font-style:normal;font-size:16px}
.preview-bottom{display:grid;gap:10px;margin-top:10px}
.preview-list,.preview-progress-card{border:1px solid var(--line);border-radius:18px;padding:14px;background:#fff}
.preview-list-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:16px}
.preview-list-head span{color:var(--primary);font-size:16px}
.preview-row{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:9px;padding:8px 0;border-top:1px solid #f0eff5}
.preview-row:first-of-type{border-top:0}
.preview-row .row-icon{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-weight:700;font-size:16px}
.preview-row div{display:grid}
.preview-row b{font-size:16px}
.preview-row small{font-size:16px;color:var(--muted)}
.preview-row em{font-style:normal;font-size:16px;font-weight:700}
.preview-progress-card{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:8px;background:linear-gradient(145deg,#f0eaff,#e8e0ff)}
.preview-progress-card>small{font-size:16px;color:#6f668a}
.preview-progress-card>strong{font-size:24px}
.preview-progress-card p{grid-column:1/-1;margin:6px 0 0;font-size:16px}
.ring{grid-column:2;grid-row:1/3;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--primary) 72%,rgba(255,255,255,.65) 0)}
.ring:before{content:"";width:40px;height:40px;border-radius:50%;background:#eee8ff}
.ring span{position:absolute;font-size:0}
.public-section{max-width:1320px;margin:auto;padding:64px 18px}
.section-heading{display:flex;flex-direction:column;gap:18px;margin-bottom:28px}
.section-heading h2{font-family:var(--font-display);font-size:clamp(29px,6vw,44px);font-weight:800;margin:8px 0 10px}
.section-heading p{max-width:650px;margin-bottom:0}
.text-link{color:var(--primary);font-weight:600}
.public-subject-grid{display:grid;gap:15px}
.public-subject-card{min-height:276px;padding:22px;border-radius:24px;display:flex;flex-direction:column;transition:transform .22s ease,box-shadow .22s ease}
.public-subject-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.subject-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}
.subject-visual{width:72px;height:72px;border-radius:22px;display:grid;place-items:center;background:rgba(255,255,255,.72);font-size:24px;font-weight:700;box-shadow:0 12px 25px rgba(46,42,72,.07)}
.subject-arrow{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:#fff;font-weight:700}
.public-subject-card>small{color:#6b7283}
.public-subject-card h3{margin:5px 0 8px}
.public-subject-card p{font-size:16px;margin-bottom:20px}
.subject-meta{display:flex;gap:7px;margin-top:auto}
.subject-meta span{padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.62);font-size:16px;font-weight:600}
.peach{background:var(--peach)!important}.violet{background:var(--violet)!important}.sky{background:var(--sky)!important}.mint{background:var(--mint)!important}.lemon{background:var(--lemon)!important}.rose{background:var(--rose)!important}.lavender{background:var(--lavender)!important}
.workflow-section{max-width:none;background:#f8f7fc}
.workflow-section>.section-heading,.workflow-grid{max-width:1320px;margin-left:auto;margin-right:auto}
.section-heading.centered{text-align:center;align-items:center}
.section-heading.centered p{margin-left:auto;margin-right:auto}
.workflow-grid{display:grid;gap:15px}
.workflow-grid article{padding:24px;border:1px solid var(--line);border-radius:24px;background:#fff}
.workflow-number{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-weight:700;margin-bottom:24px}
.workflow-grid h3{margin-bottom:8px}
.workflow-grid p{margin-bottom:0;font-size:16px}
.audience-section{display:grid;gap:32px}
.audience-copy{padding:10px 0}
.audience-copy h2{font-family:var(--font-display);font-size:clamp(30px,6vw,46px);font-weight:800;margin:10px 0 14px}
.audience-copy .btn{margin-top:10px}
.audience-cards{display:grid;gap:12px}
.audience-card{padding:20px;border-radius:22px;display:grid;grid-template-columns:46px 1fr;gap:14px;align-items:start}
.audience-card>span{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#fff;font-weight:700}
.audience-card h3{margin:2px 0 6px}
.audience-card p{margin:0;font-size:16px}
.landing-cta{max-width:1320px;margin:20px auto 72px;padding:34px 24px;border-radius:28px;background:linear-gradient(135deg,#6d4ed7,#8768e0);color:#fff;display:grid;gap:24px}
.landing-cta h2{font-family:var(--font-display);font-size:clamp(29px,6vw,44px);color:#fff;margin:8px 0 10px}
.landing-cta p{color:rgba(255,255,255,.78);margin-bottom:0}
.eyebrow.light{color:#ded4ff}
.public-footer{padding:32px 18px;border-top:1px solid var(--line);background:#fff;display:grid;gap:18px}
.public-footer>div:first-child p{margin:10px 0 0;font-size:16px}
.footer-links{display:flex;gap:18px;flex-wrap:wrap;font-size:16px}
.public-footer>small{color:var(--muted)}
.brand.compact .brand-mark{width:30px;height:30px}.brand.compact .brand-mark i{width:16px;height:16px}.brand.compact .brand-copy b{font-size:16px}

/* Public subject */
.subject-public-hero{max-width:1320px;margin:0 auto;padding:48px 18px 30px;display:grid;gap:24px}
.subject-public-copy{padding:34px 24px;border-radius:28px;background:linear-gradient(135deg,#f0ebff,#eff9ff)}
.back-link{display:inline-flex;margin-bottom:32px;color:var(--muted);font-size:16px;font-weight:600}
.subject-public-copy h1{font-family:var(--font-display);font-size:clamp(36px,8vw,60px);font-weight:800;margin:12px 0 16px}
.subject-public-copy>p{font-size:17px;max-width:650px}
.subject-reference-row{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}
.subject-reference-row span{padding:8px 11px;border-radius:999px;background:#fff;font-size:16px;font-weight:600}
.subject-hero-card{padding:26px;border-radius:28px;background:var(--violet);display:grid;gap:24px;box-shadow:var(--shadow-soft)}
.subject-large-icon{width:110px;height:110px;border-radius:30px;display:grid;place-items:center;background:#fff;font-size:30px;font-weight:700;color:var(--primary)}
.subject-hero-card>div{display:grid}
.subject-hero-card small{color:#716a83}
.subject-hero-card strong{font-size:22px}
.subject-progress-demo>span{height:9px;border-radius:99px;overflow:hidden;background:rgba(255,255,255,.55)}
.subject-progress-demo i{display:block;height:100%;border-radius:inherit;background:var(--primary)}
.subject-progress-demo small{margin-top:8px}
.public-section.compact-top{padding-top:28px}
.workflow-grid.three{grid-template-columns:1fr}

/* Auth */
.auth-header{position:fixed;z-index:60;top:0;left:0;right:0;height:var(--header-h);padding:0 16px;background:rgba(255,255,255,.88);border-bottom:1px solid var(--line);backdrop-filter:blur(16px);display:flex;align-items:center;justify-content:space-between}
.auth-header .btn{display:none}
.auth-main{min-height:100vh;padding:calc(var(--header-h) + 22px) 14px 30px;display:grid;place-items:center;background:linear-gradient(135deg,#f3efff,#edf7ff)}
.login-shell{width:100%;max-width:1040px;border-radius:28px;overflow:hidden;background:#fff;box-shadow:var(--shadow);display:grid}
.login-panel{padding:34px 24px}
.login-panel h1{font-family:var(--font-display);font-size:34px;font-weight:800;margin:10px 0 12px}
.login-panel>p{margin-bottom:26px}
.login-form{display:grid;gap:17px}
.login-form label{display:grid;gap:7px}
.login-form label span{font-size:16px;font-weight:600}
.login-form input{width:100%;min-height:50px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#fbfbfd;outline:none}
.login-form input:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(118,84,219,.10)}
.login-note{display:block;margin-top:18px;color:var(--muted);font-size:16px}
.login-visual{padding:28px 22px;background:linear-gradient(145deg,#ded3ff,#ecf6ff);display:grid;gap:24px}
.login-visual h2{font-family:var(--font-display);font-size:27px;font-weight:800;margin:10px 0 0}
.mini-badge{display:inline-flex;padding:6px 10px;border-radius:999px;background:#fff;color:var(--primary);font-size:16px;font-weight:700}
.login-course-stack{display:grid;gap:10px}
.mini-course{padding:14px;border-radius:18px;display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:11px}
.mini-course>span{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#fff;font-weight:700}
.mini-course div{display:grid}.mini-course strong{font-size:16px}.mini-course small{font-size:16px;color:#6d7486}

/* Application shell */
.app-topbar{position:fixed;z-index:75;left:0;right:0;top:0;height:var(--header-h);padding:0 14px;background:rgba(255,255,255,.92);border-bottom:1px solid var(--line);backdrop-filter:blur(18px);display:flex;align-items:center;justify-content:space-between;gap:12px}
.app-brand .brand-copy{display:none}
.topbar-search{display:none}
.topbar-actions{display:flex;align-items:center;gap:8px}
.icon-button{position:relative;width:42px;height:42px;padding:0;border:1px solid var(--line);border-radius:13px;background:#fff;display:grid;place-items:center;cursor:pointer}
.notification-dot{position:absolute;right:7px;top:7px;width:7px;height:7px;border-radius:50%;background:#ff5a67;border:2px solid #fff}
.user-chip{display:flex;align-items:center;gap:9px}
.user-chip>span:last-child{display:none}
.user-avatar{width:40px;height:40px;border-radius:14px;display:grid;place-items:center;background:var(--violet);color:var(--primary);font-size:16px;font-weight:700}
.user-chip b,.user-chip small{display:block;line-height:1.2}.user-chip b{font-size:16px}.user-chip small{margin-top:3px;color:var(--muted);font-size:16px}
.desktop-logout{display:none}
.app-sidebar{display:none}
.app-main{min-height:100vh;padding:calc(var(--header-h) + 24px) 14px calc(var(--bottom-nav-h) + 28px)}
.bottom-nav{position:fixed;z-index:80;left:10px;right:10px;bottom:10px;height:var(--bottom-nav-h);padding:7px 5px calc(7px + env(safe-area-inset-bottom));border:1px solid rgba(232,231,239,.85);border-radius:22px;background:rgba(255,255,255,.95);box-shadow:0 15px 40px rgba(47,40,85,.17);backdrop-filter:blur(18px);display:grid;grid-template-columns:repeat(5,1fr)}
.bottom-nav a,.bottom-nav button{border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#7f8798;font-size:16px;cursor:pointer}
.bottom-nav .ui-icon{width:20px;height:20px}
.bottom-nav .is-active{color:var(--primary)}
.dashboard-title-row{margin-bottom:24px;display:flex;flex-direction:column;gap:16px}
.dashboard-title-row h1{font-family:var(--font-display);font-size:var(--text-h1);font-weight:800;margin:7px 0 6px}
.dashboard-title-row p{margin:0}
.mobile-search{width:100%;height:48px;padding:0 13px;border:1px solid var(--line);border-radius:15px;background:#fff;display:flex;align-items:center;gap:9px}
.mobile-search input{width:100%;border:0;outline:none;background:transparent;color:var(--ink)}
.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}
.panel-heading h2{margin:0 0 4px}
.panel-heading p{margin:0;font-size:16px}
.panel-heading>a{color:var(--primary);font-size:16px;font-weight:600;white-space:nowrap}
.panel-heading.compact{margin-bottom:12px}
.panel-heading.compact h2{font-size:18px}
.panel-card{padding:20px;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:0 10px 30px rgba(48,42,88,.035)}
.empty-state{padding:24px;border:1px dashed #cfcddd;border-radius:18px;color:var(--muted);text-align:center;grid-column:1/-1}
.empty-state strong{display:block;color:var(--ink);margin-bottom:6px}.empty-state p{margin:0 0 15px;font-size:16px}
.soft-empty{background:#faf9ff}

/* Student dashboard */
.student-dashboard-grid{display:grid;gap:18px}
.student-workspace{display:grid;gap:26px;min-width:0}
.dashboard-section{min-width:0}
.course-card-grid{display:grid;gap:13px}
.course-card{position:relative;min-height:250px;padding:16px;border-radius:23px;display:grid;grid-template-rows:1fr auto;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease}
.course-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-soft)}
.course-art{position:relative;min-height:125px;border-radius:18px;background:rgba(255,255,255,.58);display:grid;place-items:center;overflow:hidden}
.course-art>span{position:relative;z-index:2;width:68px;height:68px;border-radius:20px;background:#fff;display:grid;place-items:center;font-size:23px;font-weight:700;box-shadow:0 12px 25px rgba(43,39,73,.09)}
.course-art i{position:absolute;width:56px;height:56px;border-radius:16px;background:rgba(255,255,255,.45);transform:rotate(25deg)}
.course-art i:first-of-type{left:13%;top:15%}.course-art i:last-of-type{right:10%;bottom:12%;width:38px;height:38px}
.course-card-copy{padding-top:14px;display:grid}
.course-card-copy small{color:#626a7b;font-size:16px}.course-card-copy h3{font-size:17px;margin:2px 0}.course-card-copy span{font-size:16px;color:#667083}
.course-card>b{position:absolute;right:15px;bottom:15px;width:34px;height:34px;border-radius:12px;background:#fff;display:grid;place-items:center}
.my-course-list{display:grid;gap:9px}
.my-course-row{padding:12px;border:1px solid var(--line);border-radius:17px;background:#fff;display:grid;grid-template-columns:45px 1fr auto;align-items:center;gap:11px}
.row-course-icon{width:45px;height:45px;border-radius:14px;display:grid;place-items:center;font-weight:700;font-size:16px}
.row-course-name{display:grid;min-width:0}.row-course-name strong{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row-course-name small{font-size:16px;color:var(--muted)}
.row-progress{display:none;align-items:center;gap:9px}.row-progress>span{width:95px;height:7px;border-radius:99px;background:#efedf4;overflow:hidden}.row-progress i{display:block;height:100%;border-radius:inherit;background:var(--primary)}.row-progress b{font-size:16px}
.row-chevron{font-size:22px;color:#8c91a0}
.quick-insight-grid{display:grid;gap:13px}
.insight-card{padding:18px;border-radius:22px;display:grid;grid-template-columns:54px 1fr;gap:14px;align-items:start}
.insight-card>span{width:54px;height:54px;border-radius:17px;background:#fff;display:grid;place-items:center;font-size:20px;font-weight:700}
.insight-card div{display:grid}.insight-card small{font-size:16px;color:#686f80}.insight-card strong{font-size:28px;line-height:1.15}.insight-card p{margin:4px 0 0;font-size:16px}
.profile-rail{display:grid;gap:14px;align-content:start}
.profile-card{text-align:center}.profile-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.profile-card-head h2{font-size:18px;margin:0}.profile-card-head button{width:34px;height:34px;border:0;border-radius:11px;background:#faf9fe;cursor:pointer}
.profile-avatar-large{width:78px;height:78px;margin:0 auto 12px;border-radius:26px;display:grid;place-items:center;background:linear-gradient(145deg,#e8ddff,#cbeaff);color:var(--primary);font-size:22px;font-weight:700}
.profile-card>strong,.profile-card>small{display:block}.profile-card>small{color:var(--muted);font-size:16px}
.calendar-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.calendar-head span{color:var(--muted);font-size:16px}
.calendar-week,.calendar-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.calendar-week{margin-bottom:5px}.calendar-week span{font-size:16px;color:var(--muted)}
.calendar-days span{min-height:27px;display:grid;place-items:center;border-radius:9px;font-size:16px}.calendar-days .today{background:var(--primary);color:#fff;font-weight:700}.muted-day{opacity:0}
.progress-rail{display:grid;gap:9px}
.rail-progress-item{padding:10px;border:1px solid var(--line);border-radius:15px;display:grid;grid-template-columns:45px 1fr auto;gap:10px;align-items:center;background:#fff}
.rail-progress-item.featured{border:0;background:var(--violet)}
.mini-progress-ring{--progress:0;width:45px;height:45px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--primary) calc(var(--progress)*1%),rgba(255,255,255,.72) 0)}
.mini-progress-ring:before{content:"";grid-area:1/1;width:34px;height:34px;border-radius:50%;background:#fff}
.mini-progress-ring i{grid-area:1/1;position:relative;font-style:normal;font-size:16px;font-weight:700}
.rail-progress-item div{display:grid;min-width:0}.rail-progress-item strong{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rail-progress-item small{font-size:16px;color:var(--muted)}.rail-progress-item>b{font-size:19px}

/* Admin */
.admin-stat-grid{display:grid;gap:13px;margin-bottom:18px}
.admin-stat{min-height:150px;padding:19px;border-radius:22px;display:grid;grid-template-columns:50px 1fr;gap:14px;align-items:start}
.admin-stat>span{width:50px;height:50px;border-radius:16px;background:#fff;display:grid;place-items:center;font-size:19px}
.admin-stat div{display:grid}.admin-stat small{font-size:16px;color:#626a7b}.admin-stat strong{font-size:34px;line-height:1.15}.admin-stat p{margin:4px 0 0;font-size:16px}
.admin-dashboard-grid{display:grid;gap:16px}
.admin-management{min-width:0}
.management-card-grid{display:grid;gap:11px}
.management-card{width:100%;padding:15px;border:0;border-radius:18px;display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:12px;text-align:left;cursor:pointer}
.management-card>span{width:48px;height:48px;border-radius:15px;background:#fff;display:grid;place-items:center;font-size:18px}
.management-card div{display:grid}.management-card strong{font-size:16px}.management-card small{font-size:16px;color:#626a7b}.management-card>b{width:31px;height:31px;border-radius:10px;background:#fff;display:grid;place-items:center}
.admin-side-stack{display:grid;gap:15px;align-content:start}
.system-health-card{background:linear-gradient(145deg,#def4e9,#effcf6)}
.health-icon{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:#fff;color:#2b9c74;font-size:23px;font-weight:700;margin-bottom:18px}
.system-health-card h2{margin:7px 0 8px}.system-health-card p{font-size:16px}
.health-list{display:grid;gap:8px;margin-top:16px}.health-list span{display:flex;align-items:center;gap:8px;font-size:16px}.health-list i{width:8px;height:8px;border-radius:50%;background:#35aa80}
.next-phase-card{background:linear-gradient(145deg,#ece4ff,#e7f3ff)}
.next-phase-card>span{font-size:16px;font-weight:700;letter-spacing:.11em;color:var(--primary)}
.next-phase-card h2{margin:8px 0}.next-phase-card p{font-size:16px}

/* Subject manager */
.manager-summary-grid{display:grid;gap:12px;margin-bottom:18px}
.manager-summary{min-height:125px;padding:18px;border-radius:22px;display:grid;grid-template-columns:45px 1fr;align-items:center;column-gap:12px}
.manager-summary>span{grid-row:1/3;width:45px;height:45px;border-radius:14px;background:#fff;display:grid;place-items:center}.manager-summary small{align-self:end;color:#676f81;font-size:16px}.manager-summary strong{align-self:start;font-size:29px;line-height:1.2}
.manager-subject-grid{display:grid;gap:13px}
.manager-subject-card{padding:18px;border-radius:22px;display:flex;flex-direction:column;min-height:290px}
.manager-subject-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.manager-subject-top>span{width:65px;height:65px;border-radius:20px;background:#fff;display:grid;place-items:center;font-size:20px;font-weight:700}
.status-pill{padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.68);font-size:16px}.status-published{color:#197a5b}.status-review{color:#a66a0d}.status-draft{color:#6d7280}
.manager-subject-card>small{font-size:16px;color:#677082}.manager-subject-card h3{margin:4px 0}.manager-subject-card>p{font-size:16px}
.manager-card-meta{margin-top:auto;padding:10px 0;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.7);font-size:16px}.manager-card-meta span{color:#697183}

/* Modal & toast */
.toast{position:fixed;z-index:120;left:50%;bottom:calc(var(--bottom-nav-h) + 24px);width:max-content;max-width:calc(100vw - 28px);padding:12px 16px;border-radius:14px;background:var(--ink);color:#fff;box-shadow:var(--shadow);font-size:16px;opacity:0;pointer-events:none;transform:translate(-50%,18px);transition:.23s ease}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast[data-type=error]{background:#a83d49}
.modal{position:fixed;z-index:110;inset:0;padding:18px;background:rgba(19,24,42,.48);display:none;place-items:center;backdrop-filter:blur(5px)}
.modal.open{display:grid}
.modal-card{position:relative;width:min(100%,540px);padding:26px;border-radius:22px;background:#fff;box-shadow:var(--shadow)}
.modal-close{position:absolute;right:12px;top:10px;width:36px;height:36px;border:0;border-radius:11px;background:#f7f6fb;font-size:24px;cursor:pointer}

/* Responsive */
@media(min-width:600px){
  :root{--text-h1:32px;--text-h2:25px}
  .hero-actions{flex-direction:row}.hero-trust{display:flex;flex-wrap:wrap;gap:15px}
  .preview-bottom{grid-template-columns:1.4fr .8fr}
  .public-subject-grid{grid-template-columns:repeat(2,1fr)}
  .workflow-grid{grid-template-columns:repeat(2,1fr)}
  .audience-cards{grid-template-columns:repeat(3,1fr)}
  .audience-card{grid-template-columns:1fr}.landing-cta{grid-template-columns:1fr auto;align-items:center}
  .auth-header .btn{display:inline-flex}.login-panel{padding:46px 40px}.login-visual{padding:38px}
  .course-card-grid{grid-template-columns:repeat(3,1fr)}
  .course-card{min-height:235px}.my-course-row{grid-template-columns:45px 1fr 145px auto}.row-progress{display:flex}
  .quick-insight-grid{grid-template-columns:1fr 1fr}
  .admin-stat-grid{grid-template-columns:repeat(2,1fr)}
  .management-card-grid{grid-template-columns:repeat(2,1fr)}
  .manager-summary-grid{grid-template-columns:repeat(3,1fr)}
  .manager-subject-grid{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:860px){
  :root{--header-h:76px;--text-h1:34px;--text-h2:26px}
  .public-header-inner{padding:0 28px}.public-nav{display:flex;gap:28px;font-size:16px;font-weight:500}.public-nav a:hover{color:var(--primary)}.header-login{display:inline-flex}
  .landing-hero{padding:60px 28px 72px;grid-template-columns:1.02fr .98fr;align-items:center;min-height:690px}.landing-hero:before{inset:22px 18px}.hero-copy{padding:30px 22px}.hero-copy h1{font-size:54px}
  .dashboard-preview{margin:0 22px;padding:23px}.preview-course{min-height:170px}.preview-course strong{font-size:16px}.preview-course small{font-size:16px}
  .public-section{padding:84px 28px}.section-heading{flex-direction:row;align-items:end;justify-content:space-between}.section-heading.centered{display:flex;align-items:center}.public-subject-grid{grid-template-columns:repeat(3,1fr)}
  .workflow-grid{grid-template-columns:repeat(4,1fr)}.workflow-grid.three{grid-template-columns:repeat(3,1fr)}
  .audience-section{grid-template-columns:.9fr 1.1fr;align-items:center}.audience-cards{grid-template-columns:1fr}.audience-card{grid-template-columns:46px 1fr}
  .landing-cta{padding:48px;margin-bottom:90px}.public-footer{padding:36px max(28px,calc((100vw - 1320px)/2));grid-template-columns:1fr auto auto;align-items:center}
  .subject-public-hero{padding:62px 28px 34px;grid-template-columns:1.4fr .6fr}.subject-public-copy{padding:52px}.subject-hero-card{padding:34px;align-content:center}
  .login-shell{grid-template-columns:1fr .9fr}.login-panel{padding:55px}.login-visual{padding:46px}
  .app-brand .brand-copy{display:grid}.app-topbar{padding:0 20px}.topbar-search{height:44px;max-width:390px;flex:1;margin-left:auto;margin-right:8px;padding:0 13px;border:1px solid var(--line);border-radius:14px;background:#faf9fd;display:flex;align-items:center;gap:9px}.topbar-search input{width:100%;border:0;outline:none;background:transparent}.user-chip>span:last-child{display:block}.desktop-logout{display:grid}
  .app-sidebar{position:fixed;z-index:65;top:var(--header-h);bottom:0;left:0;width:90px;padding:20px 12px;background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between}
  .app-sidebar nav{display:grid;gap:8px}.side-link{width:100%;min-height:48px;padding:0;border:0;border-radius:15px;background:transparent;display:flex;align-items:center;justify-content:center;gap:12px;color:#747c8f;cursor:pointer}.side-link span{display:none}.side-link:hover,.side-link.is-active{color:var(--primary);background:#f0ebff}.side-link .ui-icon{width:21px;height:21px}.sidebar-promo{display:none}
  .app-main{padding:calc(var(--header-h) + 32px) 28px 45px;margin-left:90px}.bottom-nav{display:none}.toast{bottom:28px}
  .dashboard-title-row{flex-direction:row;align-items:center;justify-content:space-between}.mobile-search{display:none}
  .student-dashboard-grid{grid-template-columns:minmax(0,1fr) 270px;gap:20px}.student-workspace{gap:30px}.profile-rail{position:sticky;top:calc(var(--header-h) + 24px)}
  .admin-stat-grid{grid-template-columns:repeat(4,1fr)}.admin-dashboard-grid{grid-template-columns:minmax(0,1.55fr) minmax(260px,.65fr)}
  .manager-subject-grid{grid-template-columns:repeat(3,1fr)}
}
@media(min-width:1180px){
  :root{--text-h1:36px;--text-h2:28px}
  .app-sidebar{width:238px;padding:26px 18px}.side-link{justify-content:flex-start;padding:0 16px}.side-link span{display:inline;font-size:16px;font-weight:500}.sidebar-promo{display:block;padding:20px;border-radius:22px;background:linear-gradient(145deg,#e8ddff,#dff3ff)}.promo-orb{width:47px;height:47px;border-radius:16px;background:#fff;display:grid;place-items:center;color:var(--primary);margin-bottom:14px}.sidebar-promo strong{font-size:16px}.sidebar-promo p{font-size:16px;margin:6px 0 15px}.sidebar-promo .btn{font-size:16px;min-height:38px;padding:8px 10px}
  .app-main{margin-left:238px;padding-left:36px;padding-right:36px}.student-dashboard-grid{grid-template-columns:minmax(0,1fr) 300px;gap:28px}.course-card{min-height:260px}.panel-card{padding:22px}
  .management-card-grid{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:1450px){
  .app-main{max-width:1600px;margin-left:238px;margin-right:auto}.student-dashboard-grid{grid-template-columns:minmax(0,1fr) 320px}.course-card{min-height:280px}
}
@media(max-width:380px){
  .brand-copy b{font-size:16px}.header-cta .ui-icon{display:none}.header-cta{padding:8px 10px}.preview-courses{grid-template-columns:1fr}.preview-course{min-height:120px}.course-card-grid{grid-template-columns:1fr}.bottom-nav{left:6px;right:6px}.bottom-nav span{font-size:16px}
}
.empty-page{min-height:70vh;padding:80px 20px;display:grid;place-items:center;text-align:center}.empty-page>div{max-width:560px}.empty-page h1{font-family:var(--font-display);margin:10px 0}.empty-page p{margin-bottom:24px}

/* =========================================================
SMARTSTUDY GAME PLATFORM v0.3.0
========================================================= */
.game-hero{display:grid;gap:26px;padding:42px 0 28px;align-items:center}.game-hero-copy h1{font-size:clamp(42px,7vw,78px);line-height:.96;letter-spacing:-.055em;max-width:820px}.game-hero-copy h1 span{color:var(--primary)}.game-hero-copy>p{max-width:720px;font-size:16px;line-height:1.75;color:var(--muted)}.game-stat-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:24px}.game-stat-strip>div{padding:15px;border:1px solid var(--line);border-radius:18px;background:#fff}.game-stat-strip strong,.game-stat-strip span{display:block}.game-stat-strip strong{font-size:24px}.game-stat-strip span{font-size:16px;color:var(--muted)}
.hero-game-board{padding:20px;border-radius:28px;background:linear-gradient(145deg,#17162a,#282649);color:#fff;box-shadow:0 24px 80px rgba(29,24,67,.2)}.hero-player-row{display:flex;align-items:center;justify-content:space-between;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.12)}.hero-player-row small,.hero-player-row strong{display:block}.hero-player-row small{font-size:16px;letter-spacing:.12em;opacity:.6}.hero-player-row strong{margin-top:3px}.hero-player-row>span{padding:8px 11px;border-radius:12px;background:rgba(255,255,255,.08);font-size:16px}.hero-mission{margin:18px 0;padding:18px;border-radius:22px;background:linear-gradient(135deg,#6e55ff,#8d7cff);display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center}.hero-mission>span{font-size:40px}.hero-mission small,.hero-mission strong,.hero-mission p{display:block}.hero-mission small{font-size:16px;letter-spacing:.11em;opacity:.75}.hero-mission p{margin:4px 0 0;font-size:16px;opacity:.82}.hero-mission>b{grid-column:1/-1;font-size:16px;letter-spacing:.08em}.hero-league-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.hero-league-grid>div{padding:14px;border-radius:18px;background:rgba(255,255,255,.07)}.hero-league-grid span,.hero-league-grid strong,.hero-league-grid small{display:block}.hero-league-grid span{font-size:22px}.hero-league-grid strong{margin-top:8px;font-size:16px}.hero-league-grid small{font-size:16px;opacity:.6}
.game-world-grid{display:grid;gap:11px}.game-world-card{min-height:104px;padding:16px;border:1px solid var(--line);border-radius:20px;background:#fff;display:grid;grid-template-columns:auto 1fr auto;gap:13px;align-items:center;transition:.2s ease}.game-world-card:hover{transform:translateY(-2px);border-color:#cfc5ff}.world-icon{width:54px;height:54px;border-radius:17px;background:#f5f2ff;display:grid;place-items:center;font-size:26px}.game-world-card small{font-size:16px;color:var(--muted);letter-spacing:.08em}.game-world-card h3{margin:3px 0 0;font-size:16px}.game-world-card>b{width:34px;height:34px;border-radius:11px;background:#f7f6fb;display:grid;place-items:center}.featured-games-section{padding-top:10px}.game-card-grid{display:grid;gap:12px}.game-card{min-height:230px;padding:17px;border:1px solid var(--line);border-radius:22px;background:#fff;display:flex;flex-direction:column;transition:.2s ease}.game-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-soft);border-color:#d5cdfa}.game-card.is-locked{background:linear-gradient(180deg,#fff,#fbf9ff)}.game-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.game-icon{width:54px;height:54px;border-radius:17px;background:#f4f1ff;display:grid;place-items:center;font-size:28px}.access-badge{padding:6px 9px;border-radius:999px;font-size:16px;font-weight:800;letter-spacing:.08em}.access-badge.is-basic{background:#e8f8f0;color:#19704f}.access-badge.is-pro{background:#f3ecff;color:#6542b8}.game-card>small{font-size:16px;text-transform:uppercase;letter-spacing:.09em;color:var(--primary);font-weight:700}.game-card h3{font-size:16px;margin:6px 0}.game-card p{margin:0;font-size:16px;line-height:1.6;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.game-card-foot{margin-top:auto;padding-top:16px;display:flex;align-items:center;justify-content:space-between;gap:12px}.game-card-foot span{font-size:16px}.game-card-foot b{font-size:16px;color:var(--primary)}.game-cta{background:linear-gradient(135deg,#5d43d6,#7c67ef)}
.game-library-head,.leaderboard-head{display:flex;flex-direction:column;gap:16px;margin-bottom:18px}.game-library-head h1,.leaderboard-head h1,.game-detail-hero h1{margin:5px 0 7px;font-size:clamp(30px,5vw,48px);letter-spacing:-.04em}.game-library-head p,.leaderboard-head p{margin:0;color:var(--muted)}.game-filter-bar{display:grid;gap:9px;margin-bottom:12px}.game-filter-bar input,.game-filter-bar select{width:100%;min-height:46px;border:1px solid var(--line);background:#fff;border-radius:14px;padding:11px 13px;font:inherit}.category-chip-row{display:flex;gap:8px;overflow:auto;padding:4px 0 16px;scrollbar-width:none}.category-chip-row a{flex:0 0 auto;padding:8px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:16px;font-weight:700}.category-chip-row a.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.player-stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:18px}.player-stat-grid article{padding:15px;border:1px solid var(--line);border-radius:18px;background:#fff;display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center}.player-stat-grid article>span{width:42px;height:42px;border-radius:13px;background:#f4f1ff;display:grid;place-items:center;font-size:20px}.player-stat-grid small,.player-stat-grid strong{display:block}.player-stat-grid small{font-size:16px;color:var(--muted)}.player-stat-grid strong{font-size:21px}.recent-game-list{display:grid;gap:9px}.recent-game-list>a{padding:12px;border:1px solid var(--line);border-radius:16px;background:#fff;display:grid;grid-template-columns:42px 1fr auto;gap:11px;align-items:center}.recent-game-list>a>span{width:42px;height:42px;border-radius:13px;background:#f4f1ff;display:grid;place-items:center;font-size:21px}.recent-game-list strong,.recent-game-list small{display:block}.recent-game-list strong{font-size:16px}.recent-game-list small{font-size:16px;color:var(--muted)}.recent-game-list>a>b{font-size:16px}.plan-pill{display:inline-flex;align-self:center;margin:0 auto 12px;padding:6px 10px;border-radius:999px;font-size:16px;font-weight:800;letter-spacing:.09em}.plan-pill.basic{background:#e8f8f0;color:#19704f}.plan-pill.pro{background:#f3ecff;color:#6542b8}.level-progress{margin-top:16px}.level-progress>span{height:7px;border-radius:999px;background:#efedf5;display:block;overflow:hidden}.level-progress i{display:block;height:100%;background:var(--primary);border-radius:inherit}.level-progress small{margin-top:6px;font-size:16px}.league-card{text-align:center}.league-card>span{font-size:34px}.league-card>small,.league-card>strong,.league-card>a{display:block}.league-card>small{margin-top:8px;letter-spacing:.09em;color:var(--muted)}.league-card>strong{font-size:34px}.league-card>a{margin-top:8px;font-size:16px;color:var(--primary);font-weight:700}.pro-key-card{display:grid;grid-template-columns:40px 1fr;gap:10px}.pro-key-card>span{font-size:28px}.pro-key-card small,.pro-key-card strong{display:block}.pro-key-card p{font-size:16px;color:var(--muted);margin:5px 0 0}
.league-tabs{display:flex;gap:8px;flex-wrap:wrap}.league-tabs a{padding:10px 13px;border:1px solid var(--line);border-radius:13px;background:#fff;font-size:16px;font-weight:700}.league-tabs a.active{background:var(--ink);color:#fff;border-color:var(--ink)}.leaderboard-label{display:flex;flex-direction:column;gap:2px;padding-bottom:14px;border-bottom:1px solid var(--line)}.leaderboard-label span{font-size:16px;color:var(--muted)}.leaderboard-list{display:grid}.leader-row{padding:12px 3px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:42px 40px 1fr auto;gap:9px;align-items:center}.leader-row:last-child{border-bottom:0}.rank-num{font-size:16px;text-align:center}.leader-avatar{width:38px;height:38px;border-radius:13px;background:#f4f1ff;color:var(--primary);display:grid;place-items:center;font-weight:700}.leader-row strong,.leader-row small{display:block}.leader-row>div strong{font-size:16px}.leader-row>div small{font-size:16px;color:var(--muted)}.leader-row>span:last-child{text-align:right}.leader-row>span:last-child b{font-size:16px}.leader-row>span:last-child small{font-size:16px;color:var(--muted)}.top-rank{background:linear-gradient(90deg,rgba(246,241,255,.6),transparent)}
.game-detail-hero{margin-bottom:18px}.back-link{font-size:16px;color:var(--muted);font-weight:700}.game-detail-main{margin-top:14px;display:grid;grid-template-columns:auto 1fr;gap:15px}.game-detail-icon{width:72px;height:72px;border-radius:22px;background:#f4f1ff;display:grid;place-items:center;font-size:36px}.detail-meta{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.detail-meta>span:not(.access-badge){font-size:16px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.game-detail-main p{margin:0;color:var(--muted);line-height:1.65}.game-detail-grid{display:grid;gap:15px}.game-detail-content,.game-detail-side{display:grid;gap:13px;align-content:start}.game-detail-content .panel-card h2{margin-top:0}.game-detail-content .panel-card p{margin-bottom:0;color:var(--muted);line-height:1.7}.detail-two-grid{display:grid;gap:12px}.detail-two-grid small{color:var(--primary);font-weight:800;letter-spacing:.08em}.game-entry-box{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}.game-entry-box>span{font-size:32px}.game-entry-box h2{margin:0 0 5px}.game-entry-box .btn{margin-top:10px}.personal-score-card{text-align:center}.personal-score-card small,.personal-score-card strong,.personal-score-card span{display:block}.personal-score-card strong{font-size:36px}.personal-score-card span{font-size:16px;color:var(--muted)}.mini-leaderboard{display:grid}.mini-leaderboard>div{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}.mini-leaderboard>div:last-child{border-bottom:0}.mini-leaderboard b,.mini-leaderboard strong{font-size:16px}.mini-leaderboard span{font-size:16px}.mini-leaderboard small{display:block;color:var(--muted);font-size:16px}.muted-copy{color:var(--muted);font-size:16px}
.game-login-visual{background:linear-gradient(145deg,#1d1b31,#37315f);color:#fff}.game-login-visual .mini-badge{background:rgba(255,255,255,.1);color:#fff}.game-login-visual .mini-course{color:var(--ink)}.game-admin-stats{grid-template-columns:1fr 1fr}
@media(min-width:700px){.game-hero{grid-template-columns:1.15fr .85fr;padding:64px 0 45px}.game-world-grid{grid-template-columns:repeat(2,1fr)}.game-card-grid{grid-template-columns:repeat(2,1fr)}.game-filter-bar{grid-template-columns:1fr 180px 150px auto}.player-stat-grid{grid-template-columns:repeat(4,1fr)}.game-library-head,.leaderboard-head{flex-direction:row;align-items:end;justify-content:space-between}.detail-two-grid{grid-template-columns:1fr 1fr}.leaderboard-label{flex-direction:row;align-items:center;justify-content:space-between}.game-admin-stats{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1050px){.game-world-grid{grid-template-columns:repeat(5,1fr)}.game-card-grid{grid-template-columns:repeat(3,1fr)}.compact-grid{grid-template-columns:repeat(4,1fr)}.game-detail-grid{grid-template-columns:minmax(0,1fr) 300px}.dashboard-game-grid{grid-template-columns:repeat(3,1fr)}.game-dashboard-grid{grid-template-columns:minmax(0,1fr) 290px}}
@media(max-width:520px){.game-stat-strip{grid-template-columns:1fr 1fr}.game-stat-strip>div:last-child{grid-column:1/-1}.hero-league-grid{grid-template-columns:1fr}.game-detail-main{grid-template-columns:1fr}.leader-row{grid-template-columns:36px 36px 1fr}.leader-row>span:last-child{grid-column:3;text-align:left}.game-admin-stats{grid-template-columns:1fr 1fr}}

/* =========================================================
   v0.3.2 — Public UX refinement
   ========================================================= */
:root{--public-max:1240px}
.btn-white{color:var(--ink)}
.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,button:focus-visible{outline:3px solid rgba(118,84,219,.25);outline-offset:3px}
.public-header-inner{max-width:var(--public-max)}
.public-main{overflow:hidden}

.game-hero-shell{position:relative;max-width:calc(var(--public-max) + 48px);margin:0 auto;padding:24px 24px 14px}
.game-hero-shell:before{content:"";position:absolute;inset:24px 14px 14px;border-radius:34px;background:linear-gradient(135deg,#fbfaff 0%,#f7f4ff 48%,#f1f8ff 100%);border:1px solid #eeebf7}
.game-hero{position:relative;z-index:1;max-width:var(--public-max);margin:auto;display:grid;gap:34px;padding:48px 34px 42px;align-items:center}
.game-hero-copy{min-width:0}
.game-hero-copy h1{font-family:var(--font-display);font-size:clamp(42px,5.6vw,68px);line-height:1.01;letter-spacing:-.055em;max-width:710px;margin:12px 0 18px}
.game-hero-copy>p{max-width:650px;font-size:17px;line-height:1.75;color:#697188;margin-bottom:0}
.game-hero .hero-actions{margin-top:24px;flex-direction:row;flex-wrap:wrap}
.game-hero .hero-actions .btn{min-width:150px}
.hero-benefits{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px}
.hero-benefits span{padding:7px 10px;border-radius:999px;border:1px solid #e7e2f7;background:rgba(255,255,255,.8);font-size:16px;font-weight:600;color:#5f677b}
.game-stat-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:22px}
.game-stat-strip>div{min-width:0;padding:14px 15px;border:1px solid #e5e2ef;border-radius:17px;background:rgba(255,255,255,.82);display:grid;grid-template-columns:auto 1fr;column-gap:9px;align-items:center}
.game-stat-strip .stat-icon{grid-row:1/3;width:34px;height:34px;border-radius:11px;background:#f2edff;display:grid;place-items:center;font-size:16px}
.game-stat-strip strong{font-size:22px;line-height:1.05}
.game-stat-strip>div>span:last-child{font-size:16px;color:var(--muted);line-height:1.35;margin-top:2px}
.catalog-inline-note{display:flex;gap:12px;align-items:flex-start;max-width:650px;margin-top:22px;padding:14px 15px;border:1px solid #eadfc0;border-radius:16px;background:#fffaf0}
.catalog-inline-note>span{font-size:20px}.catalog-inline-note strong,.catalog-inline-note small{display:block}.catalog-inline-note strong{font-size:16px}.catalog-inline-note small{margin-top:3px;color:#81765c;font-size:16px;line-height:1.5}.catalog-inline-note code{font-size:16px}

.hero-game-board{min-width:0;padding:20px;border-radius:28px;background:linear-gradient(145deg,#17162a,#2b2850);color:#fff;box-shadow:0 28px 80px rgba(34,29,77,.18);border:1px solid rgba(255,255,255,.08)}
.hero-board-topline{display:flex;justify-content:space-between;gap:10px;margin-bottom:12px;color:rgba(255,255,255,.54);font-size:16px;font-weight:700;letter-spacing:.11em}.live-dot{color:#78e0b5}
.hero-player-row{padding-bottom:15px}.hero-player-row strong{font-size:16px}.hero-player-row>span{font-size:16px}
.hero-mission{margin:16px 0;padding:17px;border-radius:20px}.hero-mission p{color:rgba(255,255,255,.78);font-size:16px;line-height:1.45}.hero-mission>b{margin-top:2px}
.hero-progress{margin:4px 0 14px;padding:0 2px}.hero-progress>div{display:flex;align-items:center;justify-content:space-between;font-size:16px;color:rgba(255,255,255,.72)}.hero-progress>div strong{color:#fff}.hero-progress>i{display:block;height:7px;margin:7px 0 5px;border-radius:999px;background:rgba(255,255,255,.11);overflow:hidden}.hero-progress>i>b{display:block;width:72%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#8a73ff,#c2b5ff)}.hero-progress>small{font-size:16px;color:rgba(255,255,255,.48)}
.hero-league-grid>div{padding:14px 15px}.hero-league-grid strong{font-size:16px}.hero-league-grid small{font-size:16px}

.public-section{max-width:var(--public-max);padding:58px 24px}
.home-world-section{padding-top:50px}
.section-heading{margin-bottom:24px}
.section-heading h2{font-size:clamp(29px,4vw,42px);line-height:1.12}
.section-heading p{font-size:16px;line-height:1.65}
.text-link{font-size:16px}
.game-world-card{min-height:100px;padding:15px;border-radius:18px}.game-world-card small{font-size:16px}.game-world-card h3{font-size:16px}.world-icon{width:50px;height:50px;font-size:24px}
.featured-games-section{padding-top:28px}
.game-card{min-height:238px;padding:18px;border-radius:20px}.game-card>small{font-size:16px}.game-card h3{font-size:17px}.game-card p{font-size:16px;line-height:1.6}.game-card-foot b,.game-card-foot span{font-size:16px}.access-badge{font-size:16px}.game-icon{width:52px;height:52px}
.public-empty-state{min-height:160px;padding:28px;border:1px dashed #dcd7eb;border-radius:22px;background:#fbfaff;display:flex;gap:16px;align-items:center}.public-empty-state>span{width:56px;height:56px;border-radius:17px;background:#f0ebff;display:grid;place-items:center;font-size:27px;flex:0 0 auto}.public-empty-state h3{margin:0 0 4px;font-size:17px}.public-empty-state p{margin:0;max-width:700px;font-size:16px}

.workflow-section{max-width:none;padding-left:24px;padding-right:24px;background:#f8f7fc}
.workflow-section>.section-heading,.workflow-grid{max-width:var(--public-max)}
.workflow-grid article{padding:22px;border-radius:20px}.workflow-grid h3{font-size:17px}.workflow-grid p{font-size:16px;line-height:1.65}.workflow-number{width:46px;height:46px;margin-bottom:18px;border-radius:14px}
.landing-cta{max-width:var(--public-max);margin:24px auto 64px;padding:36px 38px}.landing-cta h2{font-size:clamp(28px,4vw,40px)}.landing-cta .btn-white{color:var(--ink);font-weight:700;min-width:170px}
.public-footer{padding-left:max(24px,calc((100vw - var(--public-max))/2));padding-right:max(24px,calc((100vw - var(--public-max))/2))}

/* Library & dashboard readability */
.game-library-head p,.leaderboard-head p{font-size:16px}.game-filter-bar input,.game-filter-bar select{font-size:16px}.category-chip-row a{font-size:16px}.player-stat-grid small{font-size:16px}.recent-game-list strong{font-size:16px}.recent-game-list small{font-size:16px}.league-tabs a{font-size:16px}.leader-row>div strong{font-size:16px}.leader-row>div small{font-size:16px}

@media(min-width:700px){
  .game-hero{grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);padding:54px 42px 48px}
  .game-world-grid{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:1050px){
  .game-world-grid{grid-template-columns:repeat(5,1fr)}
  .game-flow-grid{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:699px){
  .game-hero-shell{padding:12px 10px 6px}.game-hero-shell:before{inset:12px 6px 6px;border-radius:26px}.game-hero{padding:34px 20px 28px;gap:26px}.game-hero-copy h1{font-size:clamp(40px,13vw,56px)}.game-hero-copy>p{font-size:16px}.game-hero .hero-actions{display:grid;grid-template-columns:1fr}.game-hero .hero-actions .btn{width:100%}.hero-benefits{gap:6px}.hero-benefits span{font-size:16px}.game-stat-strip{grid-template-columns:1fr 1fr}.game-stat-strip>div:last-child{grid-column:1/-1}.hero-game-board{padding:17px;border-radius:23px}.public-section{padding:46px 18px}.section-heading h2{font-size:30px}.public-empty-state{align-items:flex-start}.landing-cta{margin:14px 14px 54px;padding:28px 22px;border-radius:24px}.landing-cta .btn{width:100%}
}
@media(max-width:420px){.game-stat-strip{grid-template-columns:1fr}.game-stat-strip>div:last-child{grid-column:auto}.hero-league-grid{grid-template-columns:1fr 1fr}.hero-benefits span{flex:1 1 calc(50% - 6px);text-align:center}.public-empty-state{display:grid}.public-empty-state>span{width:48px;height:48px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn,.game-card,.game-world-card{transition:none}.btn:hover,.game-card:hover,.game-world-card:hover{transform:none}}

/* v0.3.3 — /play canonical route + graceful Play catalog fallback */

/* =========================================================
   v0.4.0 — Premium public experience
   ========================================================= */
:root{
  --premium-max:1240px;
  --premium-dark:#17162a;
  --premium-dark-2:#24213f;
  --premium-purple:#7654db;
  --premium-purple-2:#8d70ef;
  --premium-soft:#f7f5ff;
  --premium-line:#e8e4f2;
  --premium-shadow:0 24px 70px rgba(43,34,91,.12);
}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.premium-public-header{background:rgba(255,255,255,.94);box-shadow:0 8px 30px rgba(41,35,75,.035)}
.premium-public-header .public-header-inner{max-width:var(--premium-max);padding:0 22px}
.premium-public-nav{gap:6px}
.premium-public-nav a{padding:9px 13px;border-radius:12px;font-size:16px;font-weight:600;color:#535b70;transition:.2s ease}
.premium-public-nav a:hover,.premium-public-nav a.is-active{background:#f3efff;color:var(--primary)}
.header-basic-pill{display:none;padding:7px 10px;border-radius:999px;background:#f5f1ff;border:1px solid #e8e0ff;color:#6549c5;font-size:16px;font-weight:700}
.premium-kicker{display:inline-flex;align-items:center;gap:8px;color:var(--primary);font-size:16px;font-weight:800;letter-spacing:.12em}
.premium-kicker i{width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 5px rgba(118,84,219,.10)}
.premium-kicker.is-light{color:#fff}.premium-kicker.is-light i{box-shadow:0 0 0 5px rgba(255,255,255,.12)}

/* Home hero */
.premium-hero-wrap{padding:20px 16px 0;background:#fff}
.premium-hero{position:relative;max-width:var(--premium-max);margin:auto;display:grid;gap:28px;padding:42px 24px;border:1px solid #ece8f6;border-radius:30px;background:linear-gradient(135deg,#fcfbff 0%,#f7f4ff 50%,#eef7ff 100%);overflow:hidden}
.premium-hero:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-180px;top:-220px;background:radial-gradient(circle,rgba(118,84,219,.16),rgba(118,84,219,0) 68%);pointer-events:none}
.premium-hero-copy,.premium-play-preview{position:relative;z-index:1;min-width:0}
.premium-hero-copy h1{font-family:var(--font-display);font-size:clamp(43px,7vw,72px);line-height:1;letter-spacing:-.055em;margin:13px 0 18px;max-width:720px}
.premium-hero-copy h1 span{color:var(--primary)}
.premium-hero-copy>p{max-width:660px;margin:0;color:#687187;font-size:16px;line-height:1.8}
.premium-hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.premium-trust-row{display:flex;flex-wrap:wrap;gap:9px 16px;margin-top:18px;color:#606a80;font-size:16px;font-weight:500}
.premium-trust-row span{display:flex;align-items:center;gap:6px}.premium-trust-row b{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:#e3f7ee;color:#26956d;font-size:16px}
.premium-metric-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:24px;max-width:650px}
.premium-metric-row article{padding:14px 15px;border-radius:17px;border:1px solid rgba(224,219,239,.95);background:rgba(255,255,255,.78)}
.premium-metric-row strong{display:block;font-family:var(--font-display);font-size:22px;line-height:1}.premium-metric-row span{display:block;margin-top:5px;color:#7b8294;font-size:16px;line-height:1.35}
.premium-play-preview{padding:18px;border-radius:27px;background:linear-gradient(145deg,#151426,#242141);box-shadow:0 30px 80px rgba(27,24,57,.24);border:1px solid rgba(255,255,255,.08);color:#fff}
.preview-glass-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:3px 2px 15px;border-bottom:1px solid rgba(255,255,255,.08)}
.preview-glass-head div{display:grid}.preview-glass-head small{font-size:16px;letter-spacing:.11em;color:rgba(255,255,255,.5)}.preview-glass-head strong{font-size:16px;color:#fff}.preview-glass-head em{font-style:normal;color:rgba(255,255,255,.35)}.preview-star{padding:7px 9px;border-radius:10px;background:rgba(255,255,255,.08);font-size:16px;font-weight:700}
.preview-featured-game{display:grid;grid-template-columns:78px 1fr;gap:14px;margin:14px 0;padding:14px;border-radius:20px;background:linear-gradient(135deg,#6f50e8,#8c72ff)}
.preview-game-art{position:relative;min-height:92px;border-radius:17px;background:linear-gradient(160deg,#2e2a52,#1f1c3b);display:grid;place-items:center;overflow:hidden}.preview-game-art span{position:relative;z-index:2;font-size:36px}.preview-game-art i{position:absolute;width:5px;height:5px;border-radius:50%;background:#fff;opacity:.55}.preview-game-art i:nth-of-type(1){left:16px;top:18px}.preview-game-art i:nth-of-type(2){right:20px;top:31px}.preview-game-art i:nth-of-type(3){left:28px;bottom:18px}
.preview-game-copy{min-width:0}.preview-game-copy small{font-size:16px;letter-spacing:.1em;color:rgba(255,255,255,.64)}.preview-game-copy h3{margin:4px 0 4px;color:#fff;font-size:16px}.preview-game-copy p{margin:0;color:rgba(255,255,255,.76);font-size:16px;line-height:1.45}.preview-play-link{display:inline-flex;gap:8px;margin-top:9px;color:#fff;font-size:16px;font-weight:700}
.preview-level-box{padding:12px 2px}.preview-level-box>div{display:flex;justify-content:space-between;gap:10px;color:rgba(255,255,255,.67);font-size:16px}.preview-level-box>div strong{color:#fff}.preview-level-box>i{display:block;height:7px;margin:7px 0 5px;background:rgba(255,255,255,.11);border-radius:999px;overflow:hidden}.preview-level-box>i>b{display:block;width:72%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#8a73ff,#c8bdff)}.preview-level-box>small{font-size:16px;color:rgba(255,255,255,.42)}
.preview-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.preview-mini-grid article{display:grid;grid-template-columns:36px 1fr auto;gap:9px;align-items:center;padding:11px;border-radius:15px;background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.06)}.mini-icon{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.08)}.preview-mini-grid article div{display:grid}.preview-mini-grid small{font-size:16px;color:rgba(255,255,255,.43);letter-spacing:.08em}.preview-mini-grid strong{color:#fff;font-size:16px}.preview-mini-grid article>b{font-size:16px;color:#fff}.preview-bottom-note{display:flex;gap:9px;align-items:flex-start;margin-top:10px;padding:10px 11px;border-radius:14px;background:rgba(255,255,255,.045)}.preview-bottom-note>span{font-size:16px}.preview-bottom-note p{margin:0;color:rgba(255,255,255,.52);font-size:16px;line-height:1.5}.preview-bottom-note strong{color:rgba(255,255,255,.82)}

/* Shared premium sections */
.premium-section{max-width:var(--premium-max);margin:auto;padding:60px 22px}
.premium-section-head{display:flex;flex-direction:column;gap:16px;margin-bottom:24px}.premium-section-head h2{font-family:var(--font-display);font-size:clamp(29px,4vw,42px);line-height:1.1;letter-spacing:-.04em;margin:8px 0}.premium-section-head p{max-width:670px;margin:0;font-size:16px;line-height:1.7}.premium-inline-link{color:var(--primary);font-size:16px;font-weight:700}.premium-inline-link span{margin-left:5px}
.premium-world-grid{display:grid;gap:10px}.premium-world-card{min-width:0;display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;padding:14px;border-radius:18px;border:1px solid var(--premium-line);background:#fff;transition:.2s ease}.premium-world-card:hover{transform:translateY(-2px);border-color:#d9cff5;box-shadow:var(--shadow-soft)}.premium-world-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#f3efff;font-size:23px}.premium-world-card div{min-width:0}.premium-world-card small{font-size:16px;color:#9298a8;font-weight:700;letter-spacing:.08em}.premium-world-card h3{margin:3px 0 0;font-size:16px}.world-arrow{color:#a09bad;font-weight:700}
.premium-featured-section{padding-top:20px}.premium-game-grid,.premium-demo-games{display:grid;gap:12px}.premium-game-card{position:relative;min-width:0;min-height:250px;padding:17px;border:1px solid var(--premium-line);border-radius:21px;background:#fff;display:flex;flex-direction:column;transition:.22s ease;overflow:hidden}.premium-game-card:before{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:-55px;top:-65px;background:rgba(118,84,219,.045);pointer-events:none}.premium-game-card:hover{transform:translateY(-3px);border-color:#d9cff5;box-shadow:0 18px 44px rgba(54,44,98,.10)}.premium-game-card.is-locked{background:linear-gradient(180deg,#fff,#fcfbff)}.premium-game-card-top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:17px}.premium-game-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#f1ecff,#edf5ff);font-size:25px;border:1px solid #e8e2f8}.premium-game-card>small{font-size:16px;text-transform:uppercase;letter-spacing:.09em;color:#8e94a4;font-weight:700}.premium-game-card h3{margin:5px 0 7px;font-size:17px;line-height:1.3}.premium-game-card p{margin:0;color:#7b8294;font-size:16px;line-height:1.62}.premium-card-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:16px}.premium-card-footer span{font-size:16px;letter-spacing:1px}.premium-card-footer b{font-size:16px;color:var(--primary)}.premium-card-footer i{font-style:normal;margin-left:4px}.locked-hint{display:block;margin-top:10px;padding:7px 9px;border-radius:10px;background:#f6f2ff;color:#6b54bb;font-size:16px;font-weight:600}
.premium-plan-band{padding:0 16px;background:#fff}.premium-plan-inner{max-width:var(--premium-max);margin:auto;padding:34px 24px;border-radius:28px;background:linear-gradient(135deg,#5b42cc,#8063eb);display:grid;gap:24px;color:#fff;box-shadow:0 22px 60px rgba(91,66,204,.20)}.plan-copy h2{color:#fff;font-family:var(--font-display);font-size:clamp(27px,4vw,40px);margin:8px 0}.plan-copy p{margin:0;color:rgba(255,255,255,.76);font-size:16px;line-height:1.7}.plan-steps{display:grid;gap:8px}.plan-steps article{display:grid;grid-template-columns:36px 1fr;gap:10px;padding:12px;border-radius:15px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.10)}.plan-steps article>span{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:#fff;color:#634ac7;font-size:16px;font-weight:800}.plan-steps div{display:grid}.plan-steps strong{font-size:16px}.plan-steps small{margin-top:2px;color:rgba(255,255,255,.66);font-size:16px;line-height:1.4}
.centered-copy{text-align:center;align-items:center}.centered-copy p{margin-left:auto;margin-right:auto}.premium-flow-grid{display:grid;gap:12px}.premium-flow-grid article{position:relative;padding:20px;border-radius:20px;border:1px solid var(--premium-line);background:#fff}.premium-flow-grid article>span{position:absolute;right:15px;top:13px;color:#b0aabf;font-size:16px;font-weight:800}.flow-symbol{width:45px;height:45px;border-radius:14px;display:grid;place-items:center;background:#f2edff;font-size:21px;margin-bottom:17px}.premium-flow-grid h3{font-size:16px;margin:0 0 6px}.premium-flow-grid p{font-size:16px;line-height:1.6;margin:0}
.premium-final-cta{max-width:var(--premium-max);margin:0 auto 60px;padding:34px 24px;border-radius:28px;background:linear-gradient(145deg,#17162a,#29254b);color:#fff;display:grid;gap:22px}.premium-final-cta h2{color:#fff;font-family:var(--font-display);font-size:clamp(28px,4vw,40px);margin:9px 0 7px}.premium-final-cta p{color:rgba(255,255,255,.64);margin:0;font-size:16px}.premium-final-actions{display:flex;align-items:center;flex-wrap:wrap;gap:14px}.cta-text-link{color:rgba(255,255,255,.75);font-size:16px;font-weight:600}

/* Play catalog */
.play-page-shell,.league-page-shell,.game-show-shell{max-width:var(--premium-max);margin:auto;padding:34px 22px 64px}
.play-page-hero{display:grid;gap:20px;align-items:end;padding:26px;border-radius:26px;background:linear-gradient(135deg,#fbfaff,#f5f2ff 58%,#eef7ff);border:1px solid #eae6f4}.play-page-copy h1,.league-page-hero h1{font-family:var(--font-display);font-size:clamp(36px,5vw,55px);line-height:1.04;letter-spacing:-.05em;margin:10px 0 12px}.play-page-copy h1 span,.league-page-hero h1 span{color:var(--primary)}.play-page-copy p,.league-page-hero p{max-width:720px;margin:0;font-size:16px;line-height:1.7}.play-hero-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px}.play-hero-meta span{padding:7px 10px;border-radius:999px;background:#fff;border:1px solid #e7e3ef;color:#70778a;font-size:16px}.play-hero-meta b{color:var(--ink)}.play-plan-card{padding:17px;border-radius:20px;background:#1c1a31;color:#fff;box-shadow:0 18px 45px rgba(31,27,68,.15)}.play-plan-top{display:grid;grid-template-columns:40px 1fr;gap:10px;align-items:center}.play-plan-top>span{width:40px;height:40px;border-radius:13px;background:rgba(255,255,255,.08);display:grid;place-items:center}.play-plan-top div{display:grid}.play-plan-top small{font-size:16px;letter-spacing:.1em;color:rgba(255,255,255,.48)}.play-plan-top strong{font-size:16px;color:#fff}.play-plan-card p{margin:10px 0 13px;color:rgba(255,255,255,.63);font-size:16px;line-height:1.5}.play-plan-card .btn{background:#fff;color:var(--ink);box-shadow:none}
.play-toolbar-wrap{margin-top:16px;padding:12px;border:1px solid var(--premium-line);border-radius:21px;background:#fff;box-shadow:0 12px 34px rgba(48,42,88,.055)}.premium-filter-bar{display:grid;gap:8px}.premium-filter-bar input,.premium-filter-bar select{width:100%;min-height:46px;border:1px solid #e5e2ec;border-radius:13px;background:#fbfbfd;color:var(--ink);padding:10px 12px;outline:none;font-size:16px}.premium-filter-bar input:focus,.premium-filter-bar select:focus{border-color:#b8a7eb;background:#fff;box-shadow:0 0 0 4px rgba(118,84,219,.08)}.premium-search-field{position:relative}.premium-search-field>span{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:#9aa0ae;font-size:18px}.premium-search-field input{padding-left:39px}.premium-category-scroll{display:flex;gap:7px;overflow:auto;padding-top:10px;scrollbar-width:none}.premium-category-scroll::-webkit-scrollbar{display:none}.premium-category-scroll a{flex:0 0 auto;padding:7px 10px;border-radius:999px;border:1px solid #e7e3ef;color:#72798b;font-size:16px;font-weight:600;background:#fff}.premium-category-scroll a.active{background:#ede6ff;border-color:#d8cdf6;color:#6244c3}.play-results-head{display:flex;align-items:end;justify-content:space-between;gap:14px;margin:30px 0 15px}.play-results-head small{color:var(--primary);font-size:16px;font-weight:800;letter-spacing:.1em}.play-results-head h2{font-family:var(--font-display);font-size:24px;margin:4px 0 0}.play-results-head>span{font-size:16px;color:#8c92a1}.play-grid{grid-template-columns:1fr}.premium-empty-catalog{min-height:220px;padding:30px;border-radius:24px;border:1px dashed #d9d3e7;background:linear-gradient(135deg,#fbfaff,#f8f6ff);display:grid;gap:17px;align-items:center;text-align:center}.empty-orb{width:62px;height:62px;margin:auto;border-radius:20px;display:grid;place-items:center;background:#eee8ff;font-size:28px}.premium-empty-catalog small{color:var(--primary);font-size:16px;font-weight:800;letter-spacing:.1em}.premium-empty-catalog h2{font-family:var(--font-display);font-size:24px;margin:6px 0}.premium-empty-catalog p{max-width:600px;margin:auto;font-size:16px}.premium-empty-catalog .btn{justify-self:center}.play-bottom-cta{margin-top:24px;padding:19px;border:1px solid #e7e2f2;border-radius:21px;background:#faf8ff;display:grid;gap:15px;align-items:center}.play-bottom-cta>div{display:grid;grid-template-columns:42px 1fr;gap:12px}.play-bottom-cta>div>span{width:42px;height:42px;border-radius:13px;background:#ede6ff;display:grid;place-items:center}.play-bottom-cta small{font-size:16px;color:var(--primary);font-weight:800;letter-spacing:.09em}.play-bottom-cta h3{font-size:16px;margin:2px 0}.play-bottom-cta p{font-size:16px;margin:0}

/* Game detail */
.premium-back-link{display:inline-flex;margin-bottom:13px;color:#6d7487;font-size:16px;font-weight:600}.game-show-hero{display:grid;gap:18px;padding:24px;border-radius:27px;background:linear-gradient(135deg,#fbfaff,#f2edff 65%,#eff7ff);border:1px solid #e8e3f3}.game-show-icon{width:74px;height:74px;border-radius:23px;background:#fff;display:grid;place-items:center;font-size:35px;box-shadow:0 14px 30px rgba(50,42,92,.08)}.game-show-copy{min-width:0}.game-show-meta,.game-show-tags{display:flex;flex-wrap:wrap;gap:7px;align-items:center}.game-show-meta>span:not(.access-badge),.game-show-tags span{padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.75);border:1px solid #e5e0ef;color:#757c8e;font-size:16px;font-weight:700}.game-show-copy h1{font-family:var(--font-display);font-size:clamp(34px,5vw,52px);line-height:1.04;letter-spacing:-.045em;margin:11px 0}.game-show-copy>p{max-width:720px;margin:0 0 13px;font-size:16px;line-height:1.7}.game-show-access-card{padding:18px;border-radius:20px;background:linear-gradient(145deg,#17162a,#282445);color:#fff}.access-card-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:rgba(255,255,255,.09);font-size:20px;margin-bottom:15px}.game-show-access-card small{font-size:16px;letter-spacing:.1em;color:rgba(255,255,255,.45);font-weight:700}.game-show-access-card h3{color:#fff;font-size:17px;margin:4px 0}.game-show-access-card p{color:rgba(255,255,255,.62);font-size:16px;line-height:1.55;margin:0 0 14px}.game-show-access-card .btn-white{box-shadow:none}.game-show-layout{display:grid;gap:14px;margin-top:16px}.game-show-main,.game-show-side{display:grid;gap:12px;align-content:start}.premium-info-card{display:grid;grid-template-columns:46px 1fr;gap:13px;padding:18px;border:1px solid var(--premium-line);border-radius:20px;background:#fff}.info-card-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#f4eee4;font-size:20px}.violet-bg{background:#eee8ff}.sky-bg{background:#e9f5ff}.premium-info-card small,.mini-panel-head small{font-size:16px;color:var(--primary);font-weight:800;letter-spacing:.09em}.premium-info-card h2{font-family:var(--font-display);font-size:21px;margin:3px 0 6px}.premium-info-card h3{font-size:16px;margin:3px 0 6px}.premium-info-card p{margin:0;font-size:16px;line-height:1.65}.premium-info-grid{display:grid;gap:12px}.game-show-loop{padding:19px;border-radius:21px;background:#f8f6ff;border:1px solid #e7e2f3}.game-show-loop small{font-size:16px;color:var(--primary);font-weight:800;letter-spacing:.09em}.game-show-loop h2{font-family:var(--font-display);font-size:20px;margin:4px 0 14px}.game-loop-track{display:flex;flex-wrap:wrap;gap:7px;align-items:center}.game-loop-track span{padding:8px 10px;border-radius:11px;background:#fff;border:1px solid #e8e4f0;font-size:16px;font-weight:600}.game-loop-track span b{display:inline-grid;place-items:center;width:18px;height:18px;margin-right:5px;border-radius:6px;background:#ede7ff;color:#6549c5;font-size:16px}.game-loop-track>i{font-style:normal;color:#aca6b9}.personal-record-card{padding:20px;border-radius:21px;background:linear-gradient(145deg,#6448d5,#8065ed);color:#fff}.personal-record-card small{display:block;color:rgba(255,255,255,.57);font-size:16px;letter-spacing:.1em}.personal-record-card strong{display:block;font-family:var(--font-display);font-size:34px;margin:6px 0 2px}.personal-record-card span{font-size:16px;color:rgba(255,255,255,.72)}.premium-leader-mini{padding:17px;border:1px solid var(--premium-line);border-radius:21px;background:#fff}.mini-panel-head{display:flex;justify-content:space-between;gap:12px;align-items:end;margin-bottom:8px}.mini-panel-head h3{font-size:16px;margin:2px 0}.mini-panel-head a{font-size:16px;color:var(--primary);font-weight:700}.premium-mini-list>div{padding:10px 0}.premium-mini-list b,.premium-mini-list strong{font-size:16px}.premium-mini-list span{font-size:16px}.premium-mini-list small{font-size:16px}.mini-empty{display:grid!important;grid-template-columns:32px 1fr!important;border:0!important}.mini-empty span{font-size:18px!important}.mini-empty p{margin:0;font-size:16px;color:var(--muted)}.game-side-tip{display:grid;grid-template-columns:38px 1fr;gap:10px;padding:15px;border-radius:18px;background:#fff9ed;border:1px solid #f1e4c9}.game-side-tip>span{width:38px;height:38px;border-radius:12px;background:#fff;display:grid;place-items:center}.game-side-tip strong{font-size:16px}.game-side-tip p{font-size:16px;line-height:1.5;margin:3px 0 0}

/* Leaderboard */
.league-page-hero{display:grid;gap:18px;padding:25px;border-radius:27px;background:linear-gradient(135deg,#fbfaff,#f5f2ff);border:1px solid #e9e5f3}.premium-tabs{display:flex;gap:7px;flex-wrap:wrap}.premium-tabs a{padding:9px 12px;border-radius:12px;background:#fff;border:1px solid #e6e1ee;color:#73798a;font-size:16px;font-weight:700}.premium-tabs a.active{background:#1c1a31;color:#fff;border-color:#1c1a31}.league-summary-card{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;margin-top:15px;padding:20px;border-radius:22px;background:#fff;border:1px solid var(--premium-line)}.league-summary-card small{font-size:16px;color:var(--primary);font-weight:800;letter-spacing:.1em}.league-summary-card h2{font-family:var(--font-display);font-size:21px;margin:4px 0 6px}.league-summary-card p{font-size:16px;margin:0;max-width:650px}.league-big-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:#f0ebff;font-size:27px}.podium-wrap{display:grid;gap:10px;margin-top:15px}.podium-card{position:relative;padding:20px;border-radius:21px;border:1px solid var(--premium-line);background:#fff;text-align:center;display:flex;flex-direction:column;align-items:center}.podium-card.place-1{background:linear-gradient(145deg,#fffbef,#fff);border-color:#f0dfaa}.podium-medal{position:absolute;right:12px;top:10px;font-size:20px}.podium-avatar{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;background:#eee8ff;color:#684bc9;font-weight:800;font-size:18px;margin-bottom:9px}.podium-card strong{font-size:16px}.podium-card small{font-size:16px;color:var(--muted)}.podium-card>b{font-family:var(--font-display);font-size:21px;margin-top:9px}.podium-card em{font-style:normal;color:#898f9e;font-size:16px}.premium-ranking-list{margin-top:14px;border:1px solid var(--premium-line);border-radius:22px;background:#fff;overflow:hidden}.ranking-list-head{display:none;padding:11px 15px;background:#faf9fc;color:#9ba0ae;font-size:16px;font-weight:800;letter-spacing:.08em}.premium-rank-row{display:grid;grid-template-columns:38px 38px 1fr;gap:9px;align-items:center;padding:12px 14px;border-bottom:1px solid #efedf3}.premium-rank-row:last-child{border-bottom:0}.premium-rank-row.is-top{background:#fdfcff}.rank-chip{font-size:16px;font-weight:800}.rank-avatar{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#f0ebff;color:#684bc9;font-weight:800;font-size:16px}.rank-player{display:grid}.rank-player strong{font-size:16px}.rank-player small,.rank-score small{font-size:16px;color:var(--muted)}.rank-score{grid-column:3;display:grid;text-align:left}.rank-score strong{font-size:16px}.league-empty-premium{display:grid;gap:16px;align-items:center;margin-top:15px;padding:27px;border-radius:23px;background:#fff;border:1px solid var(--premium-line);text-align:center}.league-empty-premium>span{width:62px;height:62px;margin:auto;border-radius:20px;display:grid;place-items:center;background:#f1ecff;font-size:29px}.league-empty-premium small{font-size:16px;color:var(--primary);font-weight:800;letter-spacing:.1em}.league-empty-premium h2{font-family:var(--font-display);font-size:23px;margin:4px 0 5px}.league-empty-premium p{font-size:16px;max-width:620px;margin:auto}.league-empty-premium .btn{justify-self:center}.league-rule-strip{display:grid;gap:9px;margin-top:15px}.league-rule-strip article{display:grid;grid-template-columns:36px 1fr;gap:10px;padding:14px;border-radius:17px;background:#f8f6ff;border:1px solid #e9e4f3}.league-rule-strip article>span{width:36px;height:36px;border-radius:11px;background:#fff;display:grid;place-items:center;color:#684bc9;font-size:16px;font-weight:800}.league-rule-strip article div{display:grid}.league-rule-strip strong{font-size:16px}.league-rule-strip small{font-size:16px;color:var(--muted)}

/* Premium auth */
.premium-auth-header{height:68px;background:rgba(255,255,255,.95);border-bottom:1px solid var(--line);padding:0}.auth-header-inner{max-width:var(--premium-max);height:100%;margin:auto;padding:0 20px;display:flex;justify-content:space-between;align-items:center;gap:16px}.premium-auth-main{padding:68px 0 0;background:#f8f7fc;min-height:100vh}.auth-premium-shell{padding:24px 14px 50px}.auth-premium-panel{max-width:1020px;margin:auto;display:grid;border:1px solid #e8e4ef;border-radius:28px;background:#fff;overflow:hidden;box-shadow:0 28px 80px rgba(47,39,86,.10)}.auth-form-side{padding:29px 22px}.auth-form-side h1{font-family:var(--font-display);font-size:clamp(32px,5vw,45px);line-height:1.06;letter-spacing:-.045em;margin:10px 0 10px}.auth-form-side>p{font-size:16px;line-height:1.65;max-width:520px}.premium-auth-form{display:grid;gap:13px;margin-top:22px}.premium-auth-form label{display:grid;gap:6px}.premium-auth-form label>span{font-size:16px;font-weight:700;color:#596175}.premium-auth-form label em{font-style:normal;color:#9aa0ad;font-weight:500}.premium-auth-form label>small{font-size:16px;color:#969cab}.premium-auth-form input{min-height:48px;border:1px solid #e2dfE9;border-radius:13px;padding:11px 13px;background:#fbfbfd;color:var(--ink);font-size:16px;outline:none}.premium-auth-form input:focus{border-color:#b4a1e9;background:#fff;box-shadow:0 0 0 4px rgba(118,84,219,.08)}.auth-switch-note{margin-top:17px;text-align:center;font-size:16px;color:#8b91a0}.auth-switch-note a{color:var(--primary);font-weight:700}.auth-showcase{position:relative;padding:28px 22px;background:linear-gradient(145deg,#17162a,#29254b);color:#fff;overflow:hidden}.auth-showcase:before{content:"";position:absolute;width:300px;height:300px;border-radius:50%;right:-140px;top:-150px;background:radial-gradient(circle,rgba(135,107,238,.28),rgba(135,107,238,0) 70%)}.auth-showcase>*{position:relative;z-index:1}.auth-badge{display:inline-flex;padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.08);color:#d9ceff;font-size:16px;font-weight:800;letter-spacing:.1em}.auth-showcase h2{color:#fff;font-family:var(--font-display);font-size:26px;line-height:1.1;margin:10px 0}.auth-showcase p{color:rgba(255,255,255,.62);font-size:16px;line-height:1.6}.auth-feature-stack{display:grid;gap:8px;margin-top:24px}.auth-feature-stack article{display:grid;grid-template-columns:40px 1fr auto;gap:10px;align-items:center;padding:12px;border-radius:15px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.07)}.auth-feature-stack article>span{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.08);display:grid;place-items:center}.auth-feature-stack article div{display:grid}.auth-feature-stack small{font-size:16px;color:rgba(255,255,255,.42);letter-spacing:.09em}.auth-feature-stack strong{color:#fff;font-size:16px}.auth-feature-stack article>b{font-size:16px}.auth-preview-score{margin-top:19px;padding:15px;border-radius:16px;background:linear-gradient(135deg,#6c50de,#836bf1)}.auth-preview-score>span{font-size:16px;color:rgba(255,255,255,.62)}.auth-preview-score>strong{float:right;font-size:16px}.auth-preview-score>i{display:block;clear:both;height:6px;margin:9px 0 5px;border-radius:999px;background:rgba(255,255,255,.16);overflow:hidden}.auth-preview-score>i>b{display:block;width:72%;height:100%;border-radius:inherit;background:#fff}.auth-preview-score>small{font-size:16px;color:rgba(255,255,255,.58)}.register-benefit-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:22px}.register-benefit-grid article{padding:13px;border-radius:15px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.07);display:grid}.register-benefit-grid article>span{font-size:20px}.register-benefit-grid strong{color:#fff;font-size:16px;margin-top:6px}.register-benefit-grid small{font-size:16px;color:rgba(255,255,255,.48);line-height:1.45}.auth-foot-note{display:flex;gap:8px;margin-top:16px;padding:10px 11px;border-radius:13px;background:rgba(255,255,255,.055)}.auth-foot-note>span{color:#7de0b7}.auth-foot-note p{font-size:16px;margin:0}

/* Premium footer + error */
.premium-footer{max-width:none;padding:38px max(22px,calc((100vw - var(--premium-max))/2));display:grid;gap:25px;background:#17162a;color:#fff;border-top:0}.premium-footer .brand-copy b{color:#fff}.premium-footer .brand-copy small{color:rgba(255,255,255,.44)}.footer-brand-block p{max-width:310px;margin:10px 0 0;color:rgba(255,255,255,.48);font-size:16px}.footer-nav-block{display:grid;gap:7px;align-content:start}.footer-nav-block strong{font-size:16px;color:#fff;text-transform:uppercase;letter-spacing:.1em}.footer-nav-block a{color:rgba(255,255,255,.58);font-size:16px}.footer-nav-block a:hover{color:#fff}.footer-copyright{display:flex;flex-direction:column;gap:4px;color:rgba(255,255,255,.36);font-size:16px}.premium-error-page{max-width:900px;margin:auto;padding:70px 22px 100px;text-align:center;display:grid;gap:26px;justify-items:center}.error-orbit{position:relative;width:150px;height:150px;border-radius:50%;display:grid;place-items:center;background:#f1ecff;border:1px solid #e4ddf6}.error-orbit>span{font-family:var(--font-display);font-size:35px;color:#684bc9;font-weight:800}.error-orbit i{position:absolute;width:10px;height:10px;border-radius:50%;background:#7654db}.error-orbit i:nth-of-type(1){top:17px;left:31px}.error-orbit i:nth-of-type(2){right:17px;top:67px;background:#d7caff}.error-orbit i:nth-of-type(3){bottom:25px;left:50px;background:#9ed8ff}.premium-error-page h1{font-family:var(--font-display);font-size:clamp(34px,5vw,48px);margin:10px 0}.premium-error-page p{font-size:16px}.premium-error-actions{display:flex;flex-wrap:wrap;gap:9px;justify-content:center}

@media(min-width:700px){
  .header-basic-pill,.header-login{display:inline-flex}
  .premium-hero{grid-template-columns:minmax(0,1.06fr) minmax(350px,.94fr);padding:50px 42px;gap:38px}
  .premium-world-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .premium-game-grid,.premium-demo-games{grid-template-columns:repeat(2,minmax(0,1fr))}
  .premium-plan-inner{grid-template-columns:minmax(0,1fr) minmax(330px,.8fr);align-items:center;padding:38px 40px}.premium-flow-grid{grid-template-columns:repeat(2,1fr)}
  .premium-section-head{flex-direction:row;justify-content:space-between;align-items:end}.premium-section-head.centered-copy{display:flex;justify-content:center}
  .premium-final-cta{grid-template-columns:1fr auto;align-items:center;padding:38px 40px}
  .play-page-hero{grid-template-columns:minmax(0,1fr) 260px;padding:30px}.premium-filter-bar{grid-template-columns:minmax(260px,1fr) 180px 145px auto}.play-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.play-bottom-cta{grid-template-columns:1fr auto;padding:19px 21px}.premium-empty-catalog{grid-template-columns:auto 1fr auto;text-align:left}.premium-empty-catalog .empty-orb{margin:0}.premium-empty-catalog p{margin:0}.premium-empty-catalog .btn{justify-self:end}
  .game-show-hero{grid-template-columns:80px minmax(0,1fr) 250px;align-items:center;padding:28px}.premium-info-grid{grid-template-columns:1fr 1fr}.league-page-hero{grid-template-columns:1fr auto;align-items:end;padding:30px}.podium-wrap{grid-template-columns:repeat(3,1fr);align-items:end}.podium-card.place-1{min-height:210px;padding-top:28px;order:2}.podium-card.place-2{order:1}.podium-card.place-3{order:3}.premium-ranking-list{margin-top:18px}.ranking-list-head{display:grid;grid-template-columns:80px 1fr 160px}.premium-rank-row{grid-template-columns:48px 42px 1fr 160px}.rank-score{grid-column:auto;text-align:right}.league-empty-premium{grid-template-columns:auto 1fr auto;text-align:left}.league-empty-premium>span{margin:0}.league-empty-premium p{margin:0}.league-rule-strip{grid-template-columns:repeat(3,1fr)}
  .auth-premium-shell{padding:42px 20px 70px}.auth-premium-panel{grid-template-columns:minmax(0,.95fr) minmax(360px,1.05fr)}.auth-form-side{padding:44px 42px}.auth-showcase{padding:44px 38px}
  .premium-footer{grid-template-columns:1.4fr .7fr .7fr auto;align-items:start}.footer-copyright{text-align:right;align-items:flex-end}
}
@media(min-width:980px){
  .premium-public-nav{display:flex}
  .premium-world-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
  .premium-game-grid,.premium-demo-games{grid-template-columns:repeat(4,minmax(0,1fr))}
  .premium-flow-grid{grid-template-columns:repeat(4,1fr)}
  .play-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.game-show-layout{grid-template-columns:minmax(0,1fr) 300px}
}
@media(max-width:699px){
  .premium-hero-wrap{padding:10px 8px 0}.premium-hero{padding:32px 20px;border-radius:25px}.premium-hero-copy h1{font-size:clamp(40px,13vw,56px)}.premium-hero-actions{display:grid}.premium-hero-actions .btn{width:100%}.premium-metric-row{grid-template-columns:1fr 1fr}.premium-metric-row article:last-child{grid-column:1/-1}.premium-play-preview{border-radius:23px}.premium-section{padding:46px 18px}.premium-plan-band{padding:0 10px}.premium-plan-inner{border-radius:23px;padding:28px 20px}.premium-final-cta{margin:0 10px 46px;border-radius:23px;padding:28px 20px}.premium-final-actions .btn{width:100%}.premium-final-actions{display:grid}.play-page-shell,.league-page-shell,.game-show-shell{padding:24px 14px 54px}.play-page-hero,.league-page-hero{padding:22px;border-radius:23px}.play-page-copy h1,.league-page-hero h1{font-size:39px}.premium-filter-bar .btn{width:100%}.game-show-hero{padding:20px;border-radius:23px}.game-show-icon{width:62px;height:62px;border-radius:19px}.game-show-copy h1{font-size:36px}.game-loop-track>i{display:none}.premium-rank-row{grid-template-columns:36px 36px 1fr}.rank-score{grid-column:3}.premium-footer{padding:34px 22px}.auth-header-inner{padding:0 14px}.premium-auth-header .btn{padding:8px 10px;font-size:16px}.register-benefit-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:420px){
  .premium-metric-row{grid-template-columns:1fr}.premium-metric-row article:last-child{grid-column:auto}.preview-featured-game{grid-template-columns:64px 1fr}.preview-mini-grid{grid-template-columns:1fr}.premium-world-grid{grid-template-columns:1fr}.premium-game-grid,.premium-demo-games{grid-template-columns:1fr}.register-benefit-grid{grid-template-columns:1fr}.game-show-tags{gap:5px}.league-summary-card{grid-template-columns:1fr}.league-big-icon{display:none}
}

/* =========================================================
   SMARTSTUDY PLAY — PLAYFUL PREMIUM SKIN v0.5.0
   Inspired by game-like learning interfaces, implemented as
   real responsive HTML/CSS components (not a flattened image).
========================================================= */
:root{
  --play-purple:#6c4df6;
  --play-purple-2:#8a66ff;
  --play-blue:#3d8cff;
  --play-sky:#76d7ff;
  --play-pink:#ff5d9f;
  --play-yellow:#ffc83d;
  --play-green:#40cb70;
  --play-orange:#ff982f;
  --play-ink:#182153;
  --play-soft:#f6f2ff;
  --play-line:#e8defb;
  --play-shadow:0 20px 55px rgba(80,55,180,.16);
  --play-shadow-soft:0 12px 30px rgba(80,55,180,.11);
}
body{background:#f6f3ff;color:var(--play-ink)}
.public-main{background:linear-gradient(180deg,#fff 0,#fff 56%,#f7f3ff 100%)}
.public-header,.app-topbar{background:rgba(255,255,255,.93);border-bottom:1px solid #eee8fb;box-shadow:0 7px 24px rgba(81,57,155,.05)}
.premium-public-header .brand-copy b,.app-brand .brand-copy b{color:#242b61}.premium-public-header .brand-copy small,.app-brand .brand-copy small{color:#8c84aa}
.premium-public-nav a{border-radius:999px;padding:8px 13px}.premium-public-nav a.is-active,.premium-public-nav a:hover{background:#f2edff;color:var(--play-purple)}
.header-basic-pill{background:#fff5c9!important;color:#805500!important;border:1px solid #ffe18a!important}
.header-cta{background:linear-gradient(135deg,var(--play-purple),#865df8)!important;box-shadow:0 10px 25px rgba(108,77,246,.24)!important}

/* Public hero */
.kid-hero-shell{max-width:1240px;margin:0 auto;padding:22px 18px 10px}
.kid-hero{position:relative;overflow:hidden;border-radius:38px;padding:20px 22px 24px;background:linear-gradient(135deg,#69c9ff 0%,#6b82ff 42%,#8766ff 100%);box-shadow:0 25px 70px rgba(71,79,201,.22);isolation:isolate}
.kid-hero:before{content:"";position:absolute;inset:0;z-index:-3;background:radial-gradient(circle at 12% 15%,rgba(255,255,255,.35),transparent 22%),radial-gradient(circle at 90% 10%,rgba(255,255,255,.22),transparent 18%),linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,0))}
.kid-hero:after{content:"";position:absolute;z-index:-2;left:-8%;right:-8%;bottom:-90px;height:185px;border-radius:50% 50% 0 0/100% 100% 0 0;background:linear-gradient(180deg,#82dd75,#53bd66);box-shadow:0 -18px 60px rgba(41,149,109,.16)}
.kid-hero-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative;z-index:4}
.kid-player-chip{min-width:0;display:flex;align-items:center;gap:10px;padding:8px 13px 8px 8px;background:#fff;border:4px solid rgba(255,255,255,.6);border-radius:999px;box-shadow:0 12px 30px rgba(42,40,126,.18)}
.kid-player-chip .kid-avatar{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:28px;background:linear-gradient(145deg,#fff0c5,#ffd36c)}
.kid-player-chip div{display:grid;min-width:0}.kid-player-chip strong{font-family:var(--font-display);font-size:16px;color:#4f39b6}.kid-player-chip small{font-size:16px;color:#ad6f18;font-weight:700;white-space:nowrap}
.kid-hero-quick{display:flex;gap:7px}.kid-hero-quick a{width:44px;height:44px;border-radius:16px;background:rgba(255,255,255,.9);display:grid;place-items:center;font-size:20px;box-shadow:0 9px 22px rgba(34,42,110,.18);transition:.2s}.kid-hero-quick a:hover{transform:translateY(-2px) rotate(-2deg)}
.kid-hero-grid{position:relative;z-index:2;display:grid;gap:12px;align-items:center;padding-top:20px}
.kid-hero-copy{padding:8px 0 18px;text-align:left}.play-bubble-label{display:inline-flex;align-items:center;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.92);color:#6047d4;font-size:16px;font-weight:900;letter-spacing:.12em;box-shadow:0 8px 20px rgba(53,45,135,.12)}
.kid-hero-copy h1{display:grid;justify-items:start;gap:0;margin:8px 0 5px;font-family:var(--font-display);font-size:clamp(52px,12vw,86px);line-height:.78;letter-spacing:-.065em;text-shadow:0 7px 0 rgba(63,42,146,.18),0 12px 22px rgba(44,38,121,.16)}
.kid-hero-copy h1 span{-webkit-text-stroke:5px #fff;paint-order:stroke fill;filter:drop-shadow(0 4px 0 rgba(78,52,175,.2))}.word-play{color:#ffd13f;transform:rotate(-2deg)}.word-learn{color:#ff68a8;transform:translateX(26px) rotate(1deg)}.word-grow{color:#5cc9ff;transform:translateX(8px) rotate(-1deg)}
.wood-tag{display:inline-block;margin:13px 0 11px;padding:8px 17px;border-radius:15px;background:linear-gradient(#ffd886,#f3a94f);border:3px solid #ffe6a7;box-shadow:0 5px 0 #c97c31,0 12px 24px rgba(63,44,132,.16);font-family:var(--font-display);font-weight:800;color:#603b25;font-size:16px;transform:rotate(-1deg)}
.kid-hero-copy>p{max-width:610px;margin:5px 0 16px;color:#fff;font-weight:600;font-size:16px;line-height:1.65;text-shadow:0 1px 4px rgba(41,37,99,.25)}
.kid-hero-actions{display:flex;flex-wrap:wrap;gap:9px}.play-main-btn,.play-secondary-btn{min-height:46px;border-radius:16px;padding:10px 17px;display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:16px;box-shadow:0 11px 24px rgba(39,31,119,.2);transition:.2s}.play-main-btn{background:linear-gradient(180deg,#56dd77,#2dbf5f);color:#fff;border:2px solid rgba(255,255,255,.72)}.play-main-btn span{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#37bd62;font-size:16px}.play-secondary-btn{background:#fff;color:#5b45c7}.play-main-btn:hover,.play-secondary-btn:hover{transform:translateY(-2px)}
.kid-scene{position:relative;min-height:310px;align-self:end}.scene-kid{position:absolute;right:18%;bottom:5px;font-size:128px;line-height:1;filter:drop-shadow(0 14px 9px rgba(52,43,116,.20));transform:rotate(-3deg);z-index:3}.scene-tablet{position:absolute;right:-5px;bottom:3px;width:52px;height:63px;border-radius:11px;background:#3446a5;border:4px solid #91c9ff;display:grid;place-items:center;font-size:22px;transform:rotate(-6deg)}
.scene-robot{position:absolute;right:1%;bottom:8px;width:105px;height:132px;z-index:4;filter:drop-shadow(0 13px 10px rgba(52,43,116,.18))}.robot-head{height:73px;border-radius:33px;background:#fff;border:5px solid #c7e4ff;display:flex;align-items:center;justify-content:center;gap:13px;position:relative}.robot-head:before{content:"";position:absolute;inset:14px 11px;border-radius:22px;background:#172c69}.robot-head i,.robot-head b{position:relative;z-index:1}.robot-head i{width:8px;height:8px;border-radius:50%;background:#73f0ff;box-shadow:0 0 9px #65e4ff}.robot-head b{position:absolute;bottom:15px;color:#77efff;font-size:17px;line-height:1}.robot-body{width:68px;height:64px;border-radius:24px 24px 30px 30px;margin:-2px auto 0;background:linear-gradient(#fafdff,#d9e8ff);border:4px solid #c4ddff;display:grid;place-items:center;color:#5265dc;font-weight:900;font-size:25px}
.scene-castle{position:absolute;left:2%;bottom:12px;opacity:.95;z-index:0}.scene-castle>span{font-size:98px;filter:drop-shadow(0 8px 7px rgba(54,49,117,.12))}.scene-castle small{display:block;margin-top:-15px;padding:3px 8px;border-radius:999px;background:#fff5c8;color:#8b5a28;font-size:16px;font-weight:900;text-align:center}
.scene-speech{position:absolute;right:3%;top:3px;max-width:168px;padding:12px 15px;border-radius:22px 22px 5px 22px;background:#fff;color:#4050a4;font-size:16px;font-weight:700;line-height:1.35;box-shadow:0 10px 27px rgba(48,42,121,.17);z-index:6}.scene-speech strong{color:#6744cc}.scene-star{position:absolute;z-index:2;filter:drop-shadow(0 5px 5px rgba(48,42,121,.14))}.scene-star.s1{left:34%;top:1%;font-size:26px}.scene-star.s2{right:10%;top:31%;font-size:20px}.scene-star.s3{left:8%;top:31%;font-size:18px}
.kid-hero-stats{position:relative;z-index:4;display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:5px}.kid-hero-stats article{padding:10px 12px;border-radius:16px;background:rgba(255,255,255,.91);border:1px solid rgba(255,255,255,.8);box-shadow:0 8px 22px rgba(48,42,121,.12);display:grid}.kid-hero-stats strong{font-family:var(--font-display);font-size:18px;color:#3e3889}.kid-hero-stats span{font-size:16px;color:#77718e}

/* Worlds */
.play-world-strip{max-width:1200px;margin:0 auto;padding:46px 18px 24px}.play-section-title{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:17px}.play-section-title>div>span,.play-panel-head small,.library-result-head small,.player-section-card small,.detail-game-copy small,.league-intro-play small,.ranking-title small{color:var(--play-purple);font-size:16px;font-weight:900;letter-spacing:.11em}.play-section-title h2{font-family:var(--font-display);font-size:clamp(25px,5vw,36px);margin:5px 0 0}.play-section-title>a,.play-panel-head>a{color:var(--play-purple);font-size:16px;font-weight:800}
.play-world-scroller{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(132px,1fr);gap:10px;overflow-x:auto;padding:2px 0 8px;scroll-snap-type:x proximity;scrollbar-width:none}.play-world-scroller::-webkit-scrollbar{display:none}.play-world-pill{min-height:143px;border-radius:25px;padding:14px 10px;display:grid;justify-items:center;align-content:center;text-align:center;background:#fff;border:1px solid #eee8fb;box-shadow:var(--play-shadow-soft);scroll-snap-align:start;transition:.2s}.play-world-pill:hover{transform:translateY(-4px)}.play-world-pill>span{width:66px;height:66px;border-radius:22px;display:grid;place-items:center;font-size:35px;background:rgba(255,255,255,.62);box-shadow:inset 0 0 0 1px rgba(255,255,255,.75),0 9px 20px rgba(80,55,180,.08)}.play-world-pill strong{margin-top:8px;font-size:16px;line-height:1.25}.play-world-pill small{font-size:16px;color:#7f7899}.world-tone-1{background:linear-gradient(145deg,#fff3bf,#ffe394)}.world-tone-2{background:linear-gradient(145deg,#f1e8ff,#d9c8ff)}.world-tone-3{background:linear-gradient(145deg,#daf7ff,#b8e8ff)}.world-tone-4{background:linear-gradient(145deg,#ffe2ee,#ffc6de)}.world-tone-5{background:linear-gradient(145deg,#dff8e8,#c3efcf)}.world-tone-6{background:linear-gradient(145deg,#eee8ff,#d7c9ff)}

/* Home content */
.play-home-grid{max-width:1200px;margin:0 auto;padding:18px;display:grid;gap:14px}.play-popular-panel,.player-section-card{padding:18px;border-radius:30px;background:rgba(255,255,255,.95);border:1px solid #ece5fa;box-shadow:var(--play-shadow-soft)}.play-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.play-panel-head>div{display:flex;align-items:center;gap:10px}.panel-icon{width:43px;height:43px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,#7d62f8,#5f47dc);font-size:20px;box-shadow:0 8px 18px rgba(90,63,207,.24)}.play-panel-head h2{font-family:var(--font-display);margin:2px 0 0;font-size:21px}
.play-tile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.play-game-tile{position:relative;min-height:238px;border-radius:24px;overflow:hidden;border:3px solid rgba(255,255,255,.85);box-shadow:0 12px 25px rgba(54,44,135,.15);display:flex;flex-direction:column;transition:.22s;isolation:isolate}.play-game-tile:hover{transform:translateY(-4px) rotate(-.35deg);box-shadow:0 18px 35px rgba(54,44,135,.2)}.play-game-tile:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(39,28,101,.22));z-index:-1}.tile-tone-1{background:linear-gradient(160deg,#70d7ff,#3f9cff)}.tile-tone-2{background:linear-gradient(160deg,#ffc75a,#ff8e54)}.tile-tone-3{background:linear-gradient(160deg,#8e73ff,#6049d8)}.tile-tone-4{background:linear-gradient(160deg,#ff9c7b,#e55971)}.tile-tone-5{background:linear-gradient(160deg,#65e5b0,#2ec39c)}.tile-tone-6{background:linear-gradient(160deg,#7bc9ff,#4b73ee)}
.tile-access{position:absolute;z-index:4;right:9px;top:9px;padding:5px 8px;border-radius:999px;font-size:16px;font-weight:900;letter-spacing:.08em;border:2px solid rgba(255,255,255,.7)}.tile-access.is-basic{background:#fff7cc;color:#795400}.tile-access.is-pro{background:#6d49e9;color:#fff}.tile-art{position:relative;min-height:125px;display:grid;place-items:center;overflow:hidden}.tile-art>span{position:relative;z-index:2;font-size:67px;filter:drop-shadow(0 10px 8px rgba(42,34,103,.2));transform:rotate(-4deg)}.tile-art i{position:absolute;border-radius:50%;background:rgba(255,255,255,.24)}.tile-art i:nth-of-type(1){width:88px;height:88px;right:-20px;top:-20px}.tile-art i:nth-of-type(2){width:38px;height:38px;left:12px;bottom:3px}.tile-copy{margin-top:auto;padding:11px 12px 21px;color:#fff;text-align:center;text-shadow:0 1px 4px rgba(28,23,80,.2)}.tile-copy small{display:block;color:rgba(255,255,255,.82);font-size:16px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.tile-copy h3{color:#fff;font-family:var(--font-display);font-size:16px;line-height:1.05;margin:3px 0 3px;-webkit-text-stroke:2px rgba(56,39,126,.35);paint-order:stroke fill}.tile-copy p{color:rgba(255,255,255,.9);font-size:16px;line-height:1.35;margin:0}.tile-play{position:absolute;left:50%;bottom:-2px;transform:translate(-50%,35%);z-index:4;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#5e4de0;border:4px solid rgba(255,255,255,.75);box-shadow:0 5px 0 rgba(45,35,114,.18),0 11px 18px rgba(36,30,91,.18);font-size:16px}.tile-lock-note{position:absolute;left:8px;right:8px;bottom:10px;padding:5px;border-radius:9px;background:rgba(42,31,98,.72);color:#fff;font-size:16px;text-align:center}.play-game-tile.is-locked .tile-art,.play-game-tile.is-locked .tile-copy{filter:saturate(.68)}
.play-home-rail{display:grid;gap:11px}.reward-card,.level-card,.league-choice-card{border-radius:28px;border:1px solid rgba(105,77,217,.12);box-shadow:var(--play-shadow-soft);overflow:hidden}.reward-card{position:relative;min-height:225px;padding:18px;background:linear-gradient(145deg,#7454ef,#955ef9);color:#fff}.reward-card:after{content:"";position:absolute;width:170px;height:170px;border-radius:50%;right:-70px;top:-70px;background:rgba(255,255,255,.12)}.reward-copy{display:flex;gap:10px;align-items:flex-start}.reward-copy>span{font-size:24px}.reward-copy small{font-size:16px;color:#e7dcff;font-weight:900;letter-spacing:.09em}.reward-copy h3{color:#fff;margin:2px 0;font-family:var(--font-display);font-size:21px}.reward-copy p{color:#eee8ff;font-size:16px;max-width:190px}.reward-gift{font-size:66px;text-align:center;margin:0 auto -4px;filter:drop-shadow(0 12px 9px rgba(51,34,137,.25))}.reward-card>a{position:relative;z-index:2;min-height:39px;border-radius:999px;background:linear-gradient(#58df78,#2bc25d);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:16px;border:2px solid rgba(255,255,255,.6);box-shadow:0 6px 0 rgba(42,46,132,.18)}.level-card{padding:17px;background:linear-gradient(145deg,#fff,#f4f0ff)}.level-card-head{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center}.level-card-head>span{width:45px;height:45px;border-radius:50% 50% 48% 48%;background:linear-gradient(#ffd94f,#ffb42f);display:grid;place-items:center;font-size:22px;box-shadow:0 6px 0 #dc8d23}.level-card-head small{font-size:16px;color:#8b82a8}.level-card-head h3{margin:1px 0 0;font-size:16px}.level-card-head>b{padding:5px 8px;border-radius:999px;background:#efe9ff;color:#6548d0;font-size:16px}.level-progress-play{height:12px;margin:13px 0 7px;border-radius:999px;background:#e8e3f5;overflow:hidden;box-shadow:inset 0 2px 5px rgba(75,62,142,.08)}.level-progress-play>i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffc534,#ffde5c);box-shadow:0 0 10px rgba(255,193,38,.45)}.level-card>small{font-size:16px;color:#8b83a1}.league-choice-card{display:grid;grid-template-columns:1fr 1fr;background:#fff}.league-choice-card>a{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding:14px 11px}.league-choice-card>a+a{border-left:1px solid #eee8f7}.league-choice-card>a>span{font-size:25px}.league-choice-card strong{font-size:16px}.league-choice-card small{display:block;font-size:16px;color:#8c85a1}.league-choice-card b{color:#7f6ed6}
.parent-tip-band{max-width:1200px;margin:16px auto;padding:17px 19px;border-radius:28px;background:linear-gradient(135deg,#fff2c8,#fff,#ffe8f1);border:1px solid #f0e2bf;box-shadow:var(--play-shadow-soft);display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:center}.tip-character{font-size:58px}.parent-tip-band small{color:#7d52d5;font-size:16px;font-weight:900;letter-spacing:.1em}.parent-tip-band h2{margin:2px 0 4px;font-size:17px}.parent-tip-band p{margin:0;font-size:16px}.tip-quote{grid-column:1/-1;padding:11px;border-radius:15px;background:rgba(255,255,255,.66);color:#b13e70;font-size:16px;font-weight:600}.play-how-grid{max-width:1200px;margin:0 auto;padding:16px 18px 50px;display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.play-how-grid article{position:relative;padding:17px;border-radius:22px;background:#fff;border:1px solid #eee8fa;box-shadow:var(--play-shadow-soft)}.play-how-grid article>span{position:absolute;right:12px;top:11px;color:#c3b7e9;font-weight:900;font-size:16px}.play-how-grid article>b{font-size:28px}.play-how-grid h3{font-size:16px;margin:7px 0 3px}.play-how-grid p{font-size:16px;margin:0}.play-final-banner{max-width:1200px;margin:0 auto 50px;padding:26px;border-radius:30px;background:linear-gradient(135deg,#5b43dc,#8360f3);display:grid;gap:17px;color:#fff;box-shadow:0 20px 50px rgba(92,62,210,.22)}.play-final-banner small{font-size:16px;color:#dcd2ff;font-weight:900;letter-spacing:.1em}.play-final-banner h2{color:#fff;font-family:var(--font-display);font-size:25px;margin:4px 0}.play-final-banner p{color:#e7e0ff;font-size:16px;margin:0}.play-final-banner>a{min-height:46px;padding:10px 17px;border-radius:15px;background:#fff;color:#6547d8;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:16px}

/* Play library */
.play-library-shell,.play-ranking-shell,.play-detail-shell,.player-home-shell{max-width:1200px;margin:0 auto;padding:24px 18px 70px}.play-library-hero,.ranking-hero-play{position:relative;overflow:hidden;border-radius:32px;padding:25px;background:linear-gradient(135deg,#6dcfff,#7266ff 50%,#895ef2);color:#fff;display:grid;gap:18px;box-shadow:0 20px 55px rgba(74,71,199,.18)}.play-library-hero h1,.ranking-hero-play h1{font-family:var(--font-display);font-size:clamp(37px,8vw,57px);line-height:.92;margin:8px 0 9px;color:#fff;letter-spacing:-.05em}.play-library-hero h1 span,.ranking-hero-play h1 span{color:#ffda47}.play-library-hero p,.ranking-hero-play p{color:rgba(255,255,255,.88);font-size:16px;max-width:570px}.library-meta{display:flex;flex-wrap:wrap;gap:7px}.library-meta span{padding:7px 9px;border-radius:999px;background:rgba(255,255,255,.16);font-size:16px}.library-meta b{color:#fff;font-size:16px}.library-mascot{position:relative;min-height:160px}.mascot-boy{position:absolute;right:23%;bottom:-8px;font-size:105px;filter:drop-shadow(0 10px 8px rgba(44,39,122,.2))}.mascot-rocket{position:absolute;right:2%;top:20px;font-size:56px;transform:rotate(-8deg);filter:drop-shadow(0 9px 7px rgba(44,39,122,.16))}.mascot-note{position:absolute;left:0;top:13px;padding:10px 12px;border-radius:16px 16px 16px 3px;background:#fff;color:#5845ba;font-size:16px;font-weight:700;box-shadow:0 10px 23px rgba(42,37,117,.14)}
.play-search-bar{margin-top:15px;padding:10px;border-radius:21px;background:#fff;border:1px solid #eee7fb;box-shadow:var(--play-shadow-soft);display:grid;gap:8px}.play-search-input{min-width:0;display:flex;align-items:center;gap:8px;padding:0 12px;border-radius:14px;background:#f8f6ff}.play-search-input input{width:100%;min-width:0;min-height:46px;border:0;background:transparent;outline:none;font-size:16px}.play-search-bar select,.play-search-bar button{min-height:46px;border-radius:14px;border:1px solid #e8e0f6;padding:0 11px;background:#fff;font-size:16px;color:#433a6a}.play-search-bar button{border:0;background:linear-gradient(135deg,#6a4be8,#855ef4);color:#fff;font-weight:900;box-shadow:0 8px 17px rgba(98,70,220,.2);cursor:pointer}.play-category-tabs{display:flex;gap:7px;overflow:auto;padding:12px 1px 5px;scrollbar-width:none}.play-category-tabs::-webkit-scrollbar{display:none}.play-category-tabs a{flex:0 0 auto;padding:8px 11px;border-radius:999px;background:#fff;border:1px solid #eae3f8;color:#655e7f;font-size:16px;font-weight:700}.play-category-tabs a.active{background:#6b4ce7;color:#fff;border-color:#6b4ce7}.library-result-head{display:flex;align-items:end;justify-content:space-between;gap:13px;margin:28px 0 13px}.library-result-head h2{font-family:var(--font-display);font-size:23px;margin:4px 0 0}.library-result-head>span{font-size:16px;color:#8a82a4}.library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-sync-note{margin-top:16px;padding:14px 16px;border-radius:18px;background:#fff7d7;border:1px solid #f2df9a;display:flex;gap:10px}.catalog-sync-note>span{font-size:22px}.catalog-sync-note strong{font-size:16px}.catalog-sync-note p{margin:2px 0 0;font-size:16px}

/* Player dashboard */
.player-welcome-card{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.player-welcome-copy{display:flex;align-items:center;gap:9px}.player-mini-avatar{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#fff0b5,#ffd44c);border:3px solid #fff;box-shadow:0 8px 20px rgba(75,58,169,.13);font-size:29px}.player-welcome-copy small{font-size:16px;color:#8e83a8;font-weight:900;letter-spacing:.09em}.player-welcome-copy h1{margin:1px 0;font-size:19px}.player-welcome-copy p{margin:0;font-size:16px}.player-score-chip{padding:7px 9px;border-radius:16px;background:#fff;border:1px solid #ece5f9;display:grid;grid-template-columns:auto auto;column-gap:4px;align-items:center}.player-score-chip span{grid-row:1/3;font-size:22px}.player-score-chip strong{font-size:16px}.player-score-chip small{font-size:16px;color:#8c84a2}.player-hero-panel{position:relative;overflow:hidden;min-height:235px;padding:25px;border-radius:32px;background:linear-gradient(135deg,#67cfff,#6c72ff 49%,#855df0);box-shadow:0 20px 50px rgba(73,70,196,.18);display:grid;grid-template-columns:1fr .75fr;align-items:center}.player-hero-copy h2{font-family:var(--font-display);font-size:clamp(33px,7vw,51px);line-height:.92;margin:8px 0 10px;color:#fff}.player-hero-copy h2 span{color:#ffda45}.player-hero-copy p{color:#fff;font-size:16px}.player-hero-visual{position:relative;height:180px}.player-hero-kid{position:absolute;right:25%;bottom:-15px;font-size:105px}.player-hero-robot{position:absolute;right:-3px;bottom:3px;font-size:60px}.player-hero-star{position:absolute;right:10%;top:5px;font-size:30px}.player-dashboard-grid{display:grid;gap:13px;margin-top:14px}.player-main-column,.player-rail-column{display:grid;gap:13px;align-content:start}.player-game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.recent-play-list{display:grid;gap:7px}.recent-play-list>a{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:8px;padding:9px;border-radius:15px;background:#f9f7ff;border:1px solid #eee8fb}.recent-icon{width:41px;height:41px;border-radius:13px;background:#fff;display:grid;place-items:center;font-size:22px}.recent-play-list strong{font-size:16px}.recent-play-list small{display:block;font-size:16px;color:#8c85a2}.recent-play-list>a>b{font-size:16px}.recent-play-list>a>i{font-style:normal;color:#8a76dc}.friendly-empty{display:grid;justify-items:center;text-align:center;padding:24px 12px}.friendly-empty>span{font-size:42px}.friendly-empty strong{font-size:16px}.friendly-empty p{font-size:16px}.friendly-empty>a{font-size:16px;font-weight:900;color:#6b4edc}.player-progress-card,.milestone-reward-card,.player-profile-mini{border-radius:26px;border:1px solid #e9e1f7;box-shadow:var(--play-shadow-soft)}.player-progress-card{padding:17px;background:#fff}.progress-card-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px}.level-star{width:53px;height:53px;clip-path:polygon(50% 0,61% 34%,98% 35%,68% 56%,79% 92%,50% 71%,21% 92%,32% 56%,2% 35%,39% 34%);background:linear-gradient(#ffdf55,#ffb928);display:grid;place-items:center;padding-top:2px;color:#9a5b16;font-weight:900;font-size:16px}.progress-card-head small{font-size:16px;color:#8a82a2}.progress-card-head h3{font-size:16px;margin:1px 0}.progress-card-head>b{padding:5px 7px;border-radius:999px;background:#eee8ff;color:#6546cb;font-size:16px}.player-progress-card p{font-size:16px;margin:0;color:#8b84a0}.milestone-reward-card{position:relative;overflow:hidden;padding:16px;background:linear-gradient(145deg,#7656ed,#9861fb);color:#fff;display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center}.big-gift{font-size:55px}.milestone-reward-card small{font-size:16px;color:#ddd3ff}.milestone-reward-card h3{color:#fff;font-size:16px;margin:2px 0}.milestone-reward-card p{color:#eee8ff;font-size:16px;margin:0}.player-profile-mini{padding:13px;background:#fff;display:flex;gap:9px;align-items:center}.profile-face{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#fff1ba;font-size:24px}.player-profile-mini div{display:grid}.player-profile-mini small{font-size:16px;color:#8a82a0}.player-profile-mini strong{font-size:16px}.player-profile-mini div>span{font-size:16px;color:#8c84a2}

/* Ranking */
.ranking-hero-play{grid-template-columns:1fr;align-items:center}.ranking-trophy-scene{position:relative;min-height:155px;display:grid;place-items:center}.big-trophy{font-size:110px;filter:drop-shadow(0 15px 12px rgba(52,43,117,.22))}.rank-star{position:absolute}.rank-star.r1{left:12%;top:13%;font-size:25px}.rank-star.r2{right:14%;top:20%;font-size:18px}.rank-star.r3{right:5%;bottom:7%;font-size:28px}.league-toggle-play{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:13px 0}.league-toggle-play a{padding:11px;border-radius:16px;background:#fff;border:1px solid #eae3f8;text-align:center;font-size:16px;font-weight:800}.league-toggle-play a.active{background:linear-gradient(135deg,#6c4de8,#845ff2);color:#fff;box-shadow:0 8px 20px rgba(94,65,214,.22)}.league-intro-play{padding:17px;border-radius:25px;background:linear-gradient(145deg,#fff,#f2edff);border:1px solid #e8e0f6;display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}.league-intro-play h2{font-size:19px;margin:3px 0}.league-intro-play p{font-size:16px;margin:0}.league-intro-play>span{font-size:54px}.podium-play{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;align-items:end;margin:17px 0}.podium-player{padding:13px 7px;border-radius:22px 22px 16px 16px;background:#fff;border:1px solid #eee7fa;text-align:center;box-shadow:var(--play-shadow-soft);display:grid;justify-items:center}.podium-place-1{min-height:195px;background:linear-gradient(180deg,#fff7c9,#fff)}.podium-place-2{min-height:167px}.podium-place-3{min-height:154px}.podium-medal{font-size:24px}.podium-face{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#f3edff;font-size:26px;margin:5px}.podium-player strong{font-size:16px}.podium-player small{font-size:16px;color:#8b84a1}.podium-player>b{font-size:16px;color:#5e44c5;margin-top:4px}.podium-player em{font-style:normal;font-size:16px;color:#a47418}.ranking-list-play{padding:16px;border-radius:27px;background:#fff;border:1px solid #eae3f8;box-shadow:var(--play-shadow-soft)}.ranking-title{display:flex;gap:9px;align-items:center;margin-bottom:9px}.ranking-title>span{width:42px;height:42px;border-radius:14px;background:#fff3bf;display:grid;place-items:center;font-size:22px}.ranking-title h2{margin:1px 0;font-size:18px}.ranking-player-row{display:grid;grid-template-columns:36px 38px 1fr auto;gap:7px;align-items:center;padding:9px 4px;border-top:1px solid #f0ecf8}.ranking-player-row:first-of-type{border-top:0}.rank-number{font-size:16px;font-weight:900;text-align:center}.rank-face{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#f5f0ff;font-size:19px}.ranking-player-row>div strong{font-size:16px}.ranking-player-row>div small{display:block;font-size:16px;color:#8c84a1}.ranking-player-row>b{text-align:right;font-size:16px;color:#5d43c7}.ranking-player-row>b small{display:block;font-size:16px;color:#938aa7;font-weight:500}.ranking-empty-play{margin-top:14px;padding:23px;border-radius:27px;background:#fff;border:1px solid #eae3f8;text-align:center}.ranking-empty-play>span{font-size:55px}.ranking-empty-play h2{font-size:20px}.ranking-empty-play p{font-size:16px}.ranking-empty-play>a{display:inline-flex;margin-top:7px;padding:9px 13px;border-radius:14px;background:#6849e5;color:#fff;font-size:16px;font-weight:900}.ranking-rules-play{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}.ranking-rules-play article{position:relative;padding:13px;border-radius:20px;background:#fff;border:1px solid #eae3f8}.ranking-rules-play article>b{position:absolute;right:10px;top:8px;color:#c6bce8;font-size:16px}.ranking-rules-play article>span{font-size:24px}.ranking-rules-play strong{display:block;font-size:16px;margin:4px 0}.ranking-rules-play p{font-size:16px;margin:0}

/* Game detail */
.play-back-link{display:inline-flex;margin-bottom:11px;color:#6552c2;font-size:16px;font-weight:800}.play-detail-hero{position:relative;overflow:hidden;border-radius:31px;padding:20px;border:3px solid #fff;box-shadow:var(--play-shadow);display:grid;gap:14px;align-items:center}.detail-tone-1{background:linear-gradient(135deg,#6bcfff,#4c8ff7)}.detail-tone-2{background:linear-gradient(135deg,#ffd360,#ff9961)}.detail-tone-3{background:linear-gradient(135deg,#8f73ff,#684ad9)}.detail-tone-4{background:linear-gradient(135deg,#ff9a84,#e9637f)}.detail-tone-5{background:linear-gradient(135deg,#6be6b7,#33c49b)}.detail-tone-6{background:linear-gradient(135deg,#74cbff,#536fe9)}.detail-game-art{position:relative;min-height:150px;border-radius:24px;background:rgba(255,255,255,.2);display:grid;place-items:center;overflow:hidden}.detail-game-art>span{font-size:88px;position:relative;z-index:2;filter:drop-shadow(0 12px 10px rgba(47,38,116,.2))}.detail-game-art i{position:absolute;border-radius:50%;background:rgba(255,255,255,.2)}.detail-game-art i:nth-of-type(1){width:110px;height:110px;right:-25px;top:-25px}.detail-game-art i:nth-of-type(2){width:55px;height:55px;left:7px;bottom:5px}.detail-game-art>b{position:absolute;right:9px;top:9px;padding:5px 8px;border-radius:999px;background:#fff7cf;color:#705209;font-size:16px}.detail-game-copy{color:#fff}.detail-meta{display:flex;gap:6px;flex-wrap:wrap}.detail-meta span{padding:5px 7px;border-radius:999px;background:rgba(255,255,255,.17);font-size:16px;font-weight:800}.detail-game-copy h1{color:#fff;font-family:var(--font-display);font-size:clamp(32px,7vw,51px);line-height:.95;margin:8px 0}.detail-game-copy p{color:rgba(255,255,255,.9);font-size:16px}.detail-tags{display:flex;flex-wrap:wrap;gap:5px}.detail-tags span{padding:6px 8px;border-radius:999px;background:rgba(255,255,255,.14);font-size:16px}.detail-action-card{padding:15px;border-radius:22px;background:rgba(255,255,255,.93);color:#3b3566;box-shadow:0 12px 25px rgba(42,34,103,.15)}.detail-action-card>span{font-size:31px}.detail-action-card small{display:block;font-size:16px;color:#8c82a8;font-weight:900}.detail-action-card h3{margin:2px 0;font-size:17px}.detail-action-card p{font-size:16px}.detail-action-card>a,.detail-action-card>button{width:100%;min-height:42px;border:0;border-radius:13px;background:linear-gradient(135deg,#51d774,#2dbd5e);color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:900;cursor:pointer}.detail-content-grid{display:grid;gap:12px;margin-top:13px}.detail-content-grid>main,.detail-content-grid>aside{display:grid;gap:12px;align-content:start}.detail-learning-card,.detail-mini-grid>section,.detail-loop-card,.detail-record-card,.detail-ranking-card,.detail-tip-card{border-radius:24px;background:#fff;border:1px solid #eae3f8;box-shadow:var(--play-shadow-soft)}.detail-learning-card{padding:17px;display:grid;grid-template-columns:auto 1fr;gap:10px}.detail-learning-card>span,.detail-mini-grid>section>span,.detail-tip-card>span{width:45px;height:45px;border-radius:15px;background:#f3edff;display:grid;place-items:center;font-size:22px}.detail-learning-card small,.detail-mini-grid small,.detail-loop-card small,.detail-record-card small,.detail-ranking-card small{font-size:16px;color:#7b61d1;font-weight:900;letter-spacing:.08em}.detail-learning-card h2{font-size:18px;margin:2px 0}.detail-learning-card p,.detail-mini-grid p{font-size:16px;margin:0}.detail-mini-grid{display:grid;gap:10px}.detail-mini-grid>section{padding:15px;display:grid;grid-template-columns:auto 1fr;gap:9px}.detail-mini-grid h3{font-size:16px;margin:2px 0}.detail-loop-card{padding:17px}.detail-loop-card h2{font-size:18px;margin:2px 0 12px}.detail-loop{display:grid;grid-template-columns:1fr;gap:6px}.detail-loop span{padding:8px;border-radius:12px;background:#f7f4ff;font-size:16px;font-weight:700}.detail-loop span b{display:inline-grid;width:22px;height:22px;border-radius:8px;place-items:center;background:#6b4dde;color:#fff;margin-right:5px}.detail-loop i{display:none}.detail-record-card{padding:17px;text-align:center;background:linear-gradient(145deg,#fff8cc,#fff)}.detail-record-card>span{font-size:40px}.detail-record-card strong{display:block;font-size:30px;color:#5f47c3}.detail-record-card p{font-size:16px}.detail-ranking-card{padding:14px}.detail-side-head{display:flex;gap:8px;align-items:center;margin-bottom:8px}.detail-side-head>span{font-size:27px}.detail-side-head h3{margin:1px 0;font-size:16px}.detail-rank-list{display:grid;gap:5px}.detail-rank-list>div{display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:6px;padding:7px;border-radius:11px;background:#f8f6ff}.detail-rank-list>div>b{font-size:16px}.detail-rank-list span strong{font-size:16px}.detail-rank-list span small{display:block;font-size:16px;color:#8c84a0}.detail-rank-list em{font-style:normal;font-size:16px;font-weight:900;color:#5d44c1}.detail-empty-rank{padding:15px;text-align:center;color:#89809d;font-size:16px}.detail-tip-card{padding:13px;display:grid;grid-template-columns:auto 1fr;gap:9px;background:linear-gradient(145deg,#fff5cf,#fff)}.detail-tip-card strong{font-size:16px}.detail-tip-card p{font-size:16px;margin:2px 0 0}

/* Auth */
.premium-auth-main{background:linear-gradient(180deg,#eef7ff,#f7f2ff);min-height:calc(100vh - var(--header-h))}.play-auth-shell{max-width:960px;margin:0 auto;padding:28px 16px 60px;display:grid;gap:0}.play-auth-visual{position:relative;min-height:270px;overflow:hidden;border-radius:31px 31px 0 0;background:linear-gradient(145deg,#63caff,#6f73ff 50%,#8b60f2);display:flex;align-items:end;padding:24px;color:#fff}.play-auth-visual:after{content:"";position:absolute;left:-10%;right:-10%;bottom:-75px;height:135px;border-radius:50%;background:#63cf73}.auth-cloud{position:absolute;font-size:42px;opacity:.85}.auth-cloud.c1{left:7%;top:16%}.auth-cloud.c2{right:7%;top:26%;font-size:31px}.auth-star{position:absolute}.auth-star.a1{right:20%;top:9%;font-size:25px}.auth-star.a2{left:24%;top:36%;font-size:18px}.auth-visual-kid{position:absolute;right:8%;bottom:0;font-size:125px;z-index:2;filter:drop-shadow(0 12px 10px rgba(43,38,113,.2))}.auth-visual-logo{position:relative;z-index:3;max-width:53%;padding-bottom:10px}.auth-visual-logo small{font-size:16px;font-weight:900}.auth-visual-logo strong{display:block;font-family:var(--font-display);font-size:53px;line-height:.9;color:#ffda43;-webkit-text-stroke:5px #fff;paint-order:stroke fill;text-shadow:0 6px 0 rgba(68,45,154,.18)}.auth-visual-logo p{color:#fff;font-size:16px;font-weight:800}.register-art .auth-visual-logo strong{color:#66efff}.play-auth-card{padding:25px 20px;border-radius:0 0 31px 31px;background:#fff;border:1px solid #e9e2f6;border-top:0;box-shadow:0 22px 55px rgba(75,57,158,.13)}.play-auth-card h1{font-family:var(--font-display);font-size:31px;line-height:1.02;margin:10px 0}.play-auth-card>p{font-size:16px}.play-auth-form{display:grid;gap:11px;margin-top:19px}.play-auth-form label{display:grid;gap:5px}.play-auth-form label>span{font-size:16px;font-weight:800;color:#625b78}.play-auth-form label small{font-size:16px;color:#9b94ac}.play-auth-form label em{font-style:normal;color:#a09aad;font-weight:500}.play-auth-form input{min-height:48px;border-radius:14px;border:1px solid #e5def2;background:#faf9ff;padding:0 12px;font-size:16px;outline:none}.play-auth-form input:focus{border-color:#9f88ed;box-shadow:0 0 0 4px rgba(110,78,231,.08);background:#fff}.play-auth-form button{min-height:48px;border:0;border-radius:14px;background:linear-gradient(135deg,#6d4ce8,#885ff5);color:#fff;font-weight:900;font-size:16px;box-shadow:0 10px 22px rgba(96,65,211,.22);cursor:pointer}.play-auth-switch{text-align:center;margin-top:14px;font-size:16px;color:#8b84a0}.play-auth-switch a{color:#6748d2;font-weight:900}.play-auth-benefits{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:13px}.play-auth-benefits span{padding:6px 8px;border-radius:999px;background:#f4f0ff;color:#6e5aa9;font-size:16px;font-weight:700}

/* Navigation skin */
.layout-app .app-main{background:linear-gradient(180deg,#f8f6ff,#f3efff)}.app-topbar{height:72px}.topbar-search{border-radius:999px!important;background:#f7f4ff!important}.user-chip{border-radius:999px!important;background:#fff!important;box-shadow:0 7px 18px rgba(75,57,158,.08)!important}.app-sidebar{background:linear-gradient(180deg,#fff,#fbf9ff)!important;border-right:1px solid #eee8f7!important}.side-link{border-radius:15px!important}.side-link.is-active{background:linear-gradient(135deg,#6c4de8,#825cf2)!important;color:#fff!important;box-shadow:0 8px 18px rgba(96,66,214,.18)}.sidebar-promo{background:linear-gradient(145deg,#7858ed,#8c64f4)!important;color:#fff!important;border:0!important}.sidebar-promo p{color:#e9e2ff!important}.bottom-nav{grid-template-columns:repeat(4,1fr)!important;left:12px!important;right:12px!important;bottom:10px!important;border:2px solid rgba(255,255,255,.72)!important;background:linear-gradient(135deg,#6f4ce7,#775de9)!important;box-shadow:0 16px 38px rgba(67,45,169,.28)!important}.bottom-nav a{color:#dcd5ff!important}.bottom-nav a.is-active{color:#fff!important;position:relative}.bottom-nav a.is-active:after{content:"";position:absolute;bottom:1px;width:24px;height:4px;border-radius:999px;background:#ffd43f}.bottom-nav .ui-icon{stroke-width:2.1}.premium-footer{background:linear-gradient(135deg,#3d3477,#5b45ad)!important}.premium-footer .footer-nav-block a{color:#ddd5ff}.premium-footer .footer-brand-block p{color:#d9d2ef}

@media(min-width:700px){
  .kid-hero{padding:23px 30px 28px}.kid-hero-grid{grid-template-columns:minmax(0,1fr) minmax(320px,.85fr);gap:20px}.kid-hero-copy h1{font-size:72px}.kid-scene{min-height:355px}.scene-kid{font-size:155px}.scene-robot{width:118px;height:148px}.robot-head{height:80px}.kid-hero-stats{grid-template-columns:repeat(4,1fr)}
  .play-world-scroller{grid-auto-flow:initial;grid-template-columns:repeat(5,1fr);overflow:visible}.play-world-pill{min-width:0}
  .play-home-grid{grid-template-columns:minmax(0,1.55fr) minmax(250px,.72fr)}.play-how-grid{grid-template-columns:repeat(4,1fr)}.play-final-banner{grid-template-columns:1fr auto;align-items:center}.play-final-banner>a{min-width:165px}
  .play-library-hero,.ranking-hero-play{grid-template-columns:minmax(0,1fr) 290px;padding:32px}.play-search-bar{grid-template-columns:minmax(260px,1fr) 170px 135px auto}.library-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .player-dashboard-grid{grid-template-columns:minmax(0,1fr) 275px}.detail-content-grid{grid-template-columns:minmax(0,1fr) 285px}.detail-mini-grid{grid-template-columns:1fr 1fr}.detail-loop{grid-template-columns:repeat(7,auto);align-items:center}.detail-loop i{display:block;color:#aa9fe0;font-style:normal}.play-detail-hero{grid-template-columns:190px minmax(0,1fr) 235px;padding:23px}.play-auth-shell{grid-template-columns:minmax(330px,.9fr) minmax(0,1.1fr);align-items:stretch}.play-auth-visual{border-radius:31px 0 0 31px;min-height:570px}.play-auth-card{border-radius:0 31px 31px 0;border-left:0;padding:40px 36px}.auth-visual-kid{font-size:165px;right:4%;bottom:10%}.auth-visual-logo{max-width:85%;align-self:flex-start;margin-top:40px}.auth-visual-logo strong{font-size:70px}
  .parent-tip-band{grid-template-columns:auto 1fr minmax(220px,.6fr)}.tip-quote{grid-column:auto}.ranking-hero-play{grid-template-columns:1fr 260px}.ranking-trophy-scene{min-height:180px}.big-trophy{font-size:130px}
}
@media(min-width:980px){
  .kid-hero-shell{padding-top:28px}.kid-hero{padding:24px 40px 30px}.kid-hero-copy h1{font-size:82px}.kid-hero-copy>p{font-size:16px}.scene-kid{font-size:174px}.scene-robot{right:0}.scene-castle>span{font-size:118px}
  .play-home-grid{padding-top:24px}.play-tile-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.library-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.player-game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .play-game-tile{min-height:252px}.tile-art{min-height:138px}.tile-art>span{font-size:76px}.tile-copy h3{font-size:17px}
  .player-hero-panel{padding:30px 34px}.player-hero-kid{font-size:125px}.player-hero-robot{font-size:72px}.play-auth-card h1{font-size:38px}
}
@media(max-width:699px){
  .kid-hero-shell{padding-left:8px;padding-right:8px}.kid-hero{border-radius:28px;padding-left:15px;padding-right:15px}.kid-player-chip strong{font-size:16px}.kid-player-chip small{font-size:16px}.kid-hero-quick a{width:39px;height:39px;border-radius:14px}.kid-hero-copy{text-align:center;display:grid;justify-items:center}.kid-hero-copy h1{justify-items:center}.word-learn,.word-grow{transform:none}.kid-hero-copy>p{text-align:center}.kid-hero-actions{justify-content:center}.kid-scene{min-height:275px}.scene-castle{left:3%}.scene-castle>span{font-size:75px}.scene-kid{font-size:114px;right:24%}.scene-robot{transform:scale(.84);transform-origin:right bottom}.scene-speech{top:0;right:0;max-width:135px;font-size:16px}.kid-hero-stats article{padding:9px}.play-section-title h2{font-size:24px}.play-home-grid{padding-left:10px;padding-right:10px}.play-popular-panel,.player-section-card{padding:13px;border-radius:24px}.play-game-tile{min-height:220px}.tile-art{min-height:116px}.tile-art>span{font-size:61px}.tile-copy h3{font-size:16px}.reward-card{min-height:206px}.parent-tip-band{margin-left:10px;margin-right:10px}.play-final-banner{margin-left:10px;margin-right:10px}.play-library-shell,.play-ranking-shell,.play-detail-shell,.player-home-shell{padding-left:10px;padding-right:10px}.play-library-hero,.ranking-hero-play{border-radius:26px}.play-search-bar{border-radius:18px}.player-hero-panel{grid-template-columns:1fr .55fr;padding:21px 17px}.player-hero-kid{font-size:82px;right:20%;bottom:0}.player-hero-robot{font-size:44px}.player-welcome-copy p{display:none}.player-score-chip{display:none}.detail-game-copy{text-align:center}.detail-meta,.detail-tags{justify-content:center}.detail-game-art{min-height:135px}.ranking-rules-play{grid-template-columns:1fr}.play-auth-shell{padding-top:12px}.play-auth-visual{min-height:230px}.auth-visual-kid{font-size:105px}.auth-visual-logo strong{font-size:45px}
}
@media(max-width:430px){
  .kid-player-chip .kid-avatar{width:42px;height:42px}.kid-hero-copy h1{font-size:51px}.wood-tag{font-size:16px}.kid-hero-actions{display:grid;width:100%}.kid-hero-actions a{width:100%;justify-content:center}.kid-scene{min-height:250px}.scene-kid{font-size:100px}.scene-robot{right:-9px;transform:scale(.72)}.scene-speech{display:none}.kid-hero-stats{grid-template-columns:repeat(2,1fr)}
  .play-tile-grid{gap:8px}.play-game-tile{min-height:210px;border-radius:21px}.tile-art{min-height:105px}.tile-art>span{font-size:55px}.tile-copy{padding-left:7px;padding-right:7px}.tile-copy h3{font-size:16px}.tile-copy p{font-size:16px}.tile-play{width:40px;height:40px}
  .play-world-pill{min-height:132px}.play-world-pill>span{width:58px;height:58px;font-size:30px}.play-how-grid{grid-template-columns:1fr 1fr;padding-left:10px;padding-right:10px}.library-grid{grid-template-columns:1fr 1fr}.player-game-grid{grid-template-columns:1fr 1fr}.podium-player{padding-left:4px;padding-right:4px}.podium-face{width:42px;height:42px}.ranking-player-row{grid-template-columns:31px 34px 1fr auto}.rank-face{width:34px;height:34px}
}
.topbar-play-shortcuts{display:none;gap:6px}.topbar-play-shortcuts a{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:#fff;border:1px solid #ece5fa;box-shadow:0 6px 16px rgba(75,57,158,.08);font-size:17px}.topbar-play-shortcuts a:hover{transform:translateY(-1px)}
@media(min-width:760px){.topbar-play-shortcuts{display:flex}}

/* =========================================================
   v0.6.0 — PREMIUM PUBLIC SCHOOL LANDING
   Public pages use a lighter school/education visual language.
   Logged-in player pages keep the playful game-app identity.
========================================================= */
:root{
  --ss-purple:#6f50e9;
  --ss-purple-dark:#5134c2;
  --ss-orange:#ff7a2f;
  --ss-yellow:#ffd53d;
  --ss-cream:#fbfce9;
  --ss-cream-2:#f7f8df;
  --ss-soft-purple:#f1ecff;
  --ss-ink:#15203a;
  --ss-muted:#687086;
  --ss-green:#b9e8d0;
}
.layout-public{background:#fff;color:var(--ss-ink)}
.layout-public .public-main{background:#fff}
.ss-top-strip{min-height:30px;padding:5px max(18px,calc((100vw - 1180px)/2));display:flex;align-items:center;justify-content:space-between;gap:18px;background:var(--ss-purple);color:#fff;font-size:16px}
.ss-top-strip>div{display:flex;gap:18px;flex-wrap:wrap}.ss-top-strip a{font-weight:700;color:#fff}.ss-top-strip a:hover{text-decoration:underline}
.ss-school-header{position:sticky;top:0;z-index:70;background:rgba(255,255,255,.96);backdrop-filter:blur(15px);border-bottom:1px solid #eeeef3;box-shadow:0 8px 26px rgba(43,35,90,.04)}
.ss-school-header .public-header-inner{width:min(1180px,calc(100% - 28px));min-height:74px;margin:auto;padding:0;display:flex;align-items:center;gap:26px}
.ss-school-brand{margin-right:auto}.ss-school-brand .brand-copy b{font-size:17px}.ss-school-brand .brand-copy small{font-size:16px;text-transform:uppercase;letter-spacing:.12em;color:#8a90a0}
.ss-school-nav{display:none;gap:28px;align-items:center}.ss-school-nav a{position:relative;padding:26px 0;font-size:16px;font-weight:600;color:#353c50}.ss-school-nav a:hover,.ss-school-nav a.is-active{color:var(--ss-purple)}.ss-school-nav a.is-active:after{content:"";position:absolute;left:0;right:0;bottom:17px;height:2px;border-radius:3px;background:var(--ss-purple)}
.ss-header-login{display:none;padding:10px 14px;border-radius:12px;font-size:16px;font-weight:600;color:#333b50}.ss-header-login:hover{background:#f7f5fd}.ss-header-cta{min-height:42px;padding:10px 16px;border-radius:13px;background:var(--ss-orange);color:#fff;font-size:16px;font-weight:700;box-shadow:0 10px 22px rgba(255,122,47,.18)}
.ss-school-footer{background:#fff;border-top:1px solid #efeff4}
.ss-school-footer .footer-nav-block strong{color:var(--ss-ink)}
.ss-school-footer a:hover{color:var(--ss-purple)}
.ss-section-label{display:inline-flex;align-items:center;gap:8px;color:var(--ss-purple);font-size:16px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.ss-section-label:before{content:"";width:18px;height:3px;border-radius:10px;background:var(--ss-orange)}
.ss-section-head{max-width:760px;margin-bottom:34px}.ss-section-head.center{text-align:center;margin-left:auto;margin-right:auto}.ss-section-head.center .ss-section-label{justify-content:center}.ss-section-head h2{margin:10px 0 10px;font-size:clamp(27px,3.3vw,44px);letter-spacing:-.04em}.ss-section-head p{margin:0;font-size:16px;line-height:1.8}.ss-section-head.inverse .ss-section-label,.ss-section-head.inverse h2,.ss-section-head.inverse p{color:#fff}.ss-section-head.inverse .ss-section-label:before{background:var(--ss-yellow)}
.ss-school-hero{position:relative;overflow:hidden;background:linear-gradient(100deg,#fbfde5 0%,#f9fce8 62%,#f2f6d2 100%)}
.ss-school-hero-inner{width:min(1180px,calc(100% - 28px));min-height:570px;margin:auto;padding:48px 0 76px;display:grid;gap:34px;align-items:center}.ss-school-copy{position:relative;z-index:2}.ss-school-kicker{display:inline-flex;margin-bottom:16px;color:var(--ss-purple);font-size:16px;font-weight:800;letter-spacing:.12em}.ss-school-copy h1{max-width:670px;margin:0 0 18px;font-size:clamp(40px,6.4vw,72px);line-height:1.02;letter-spacing:-.055em;font-family:var(--font-display)}.ss-school-copy h1 span{color:var(--ss-purple)}.ss-school-copy p{max-width:620px;margin:0 0 25px;color:#6b7281;font-size:16px;line-height:1.85}
.ss-school-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.ss-btn-orange,.ss-btn-yellow,.ss-btn-light{min-height:46px;padding:12px 20px;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;font-size:16px;font-weight:800}.ss-btn-orange{background:var(--ss-orange);color:#fff;box-shadow:0 12px 25px rgba(255,122,47,.18)}.ss-btn-orange:hover{transform:translateY(-2px)}.ss-btn-video{display:inline-flex;align-items:center;gap:9px;font-size:16px;font-weight:700}.ss-btn-video span{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--ss-purple);box-shadow:0 10px 24px rgba(47,44,78,.10)}
.ss-school-proof{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.ss-school-proof span{min-width:112px;padding:11px 15px;border:1px solid rgba(105,104,125,.10);border-radius:16px;background:rgba(255,255,255,.64);display:grid;box-shadow:0 10px 24px rgba(55,50,80,.04)}.ss-school-proof b{font-size:19px;line-height:1.15}.ss-school-proof small{margin-top:3px;color:#7f8492;font-size:16px}
.ss-school-visual{position:relative;min-height:380px}.ss-student-card{position:absolute;bottom:22px;width:47%;min-height:300px;padding:20px 14px 18px;border-radius:48% 48% 24% 24% / 24% 24% 20% 20%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;box-shadow:0 24px 55px rgba(72,58,95,.14)}.ss-student-card strong{font-size:16px}.ss-student-card small{font-size:16px}.ss-student-face{font-size:116px;line-height:1;filter:drop-shadow(0 16px 14px rgba(35,30,65,.10))}.ss-student-a{left:5%;background:linear-gradient(160deg,#ffc75d,#ffb33c)}.ss-student-b{right:5%;background:linear-gradient(160deg,#fff,#e6dfff)}.ss-admission-sticker{position:absolute;z-index:5;left:42%;top:45%;transform:rotate(-4deg);padding:8px 12px;border-radius:9px;background:#fff;box-shadow:0 14px 24px rgba(55,50,80,.15);display:grid;text-align:center}.ss-admission-sticker small{font-size:16px;font-weight:800;color:#686f82}.ss-admission-sticker b{font-size:20px;line-height:1;color:var(--ss-purple)}.ss-admission-sticker span{margin-top:4px;padding:2px 6px;border-radius:4px;background:#ec4d39;color:#fff;font-size:16px;font-weight:800}.ss-floating-badge{position:absolute;z-index:4;padding:8px 12px;border-radius:999px;background:#fff;font-size:16px;font-weight:700;box-shadow:0 10px 24px rgba(55,50,80,.12)}.ss-floating-badge.b1{top:18%;left:0}.ss-floating-badge.b2{right:0;top:28%}.ss-doodle{position:absolute;font-size:28px;font-weight:800}.ss-doodle.d1{left:4%;top:4%;transform:rotate(-15deg)}.ss-doodle.d2{right:18%;top:5%;color:#f2b632}.ss-doodle.d3{right:1%;bottom:12%;color:#ff7248}
.ss-wave{pointer-events:none}.ss-wave-hero{position:absolute;left:-2%;right:-2%;bottom:-1px;height:52px;background:#fff;clip-path:polygon(0 48%,8% 62%,17% 47%,27% 65%,36% 48%,46% 62%,55% 44%,65% 64%,75% 48%,86% 63%,100% 45%,100% 100%,0 100%)}
.ss-about-section{width:min(1120px,calc(100% - 28px));margin:auto;padding:88px 0;display:grid;gap:46px;align-items:center}.ss-about-visual{position:relative;min-height:390px}.ss-about-blob{position:absolute;inset:30px 8% 25px;background:linear-gradient(145deg,#ffb941,#ff8d4c);border-radius:47% 53% 45% 55% / 58% 40% 60% 42%;transform:rotate(-6deg)}.ss-about-child{position:absolute;z-index:2;inset:38px 0 0;display:grid;place-items:center;font-size:190px;filter:drop-shadow(0 18px 22px rgba(45,35,70,.12))}.ss-exp-badge{position:absolute;z-index:3;right:7%;bottom:22%;width:96px;height:96px;border-radius:50%;display:grid;place-items:center;text-align:center;background:#27376d;color:#fff;border:7px solid #fff;box-shadow:0 14px 25px rgba(31,44,91,.16)}.ss-exp-badge strong{font-size:22px;line-height:1}.ss-exp-badge span{font-size:16px;line-height:1.3}.ss-sketch-light{position:absolute;z-index:4;right:0;top:3%;font-size:38px;transform:rotate(12deg)}.ss-about-copy h2{margin:10px 0 16px;font-size:clamp(29px,4vw,48px);letter-spacing:-.04em}.ss-about-copy>p{font-size:16px;line-height:1.85}.ss-feature-checks{display:grid;grid-template-columns:1fr;gap:10px;margin:24px 0}.ss-feature-checks span{font-size:16px;font-weight:600;color:#394154}.ss-feature-checks span::first-letter{color:var(--ss-purple)}.ss-text-link{display:inline-flex;color:var(--ss-orange);font-size:16px;font-weight:800}
.ss-worlds-section{width:min(1120px,calc(100% - 28px));margin:auto;padding:30px 0 92px}.ss-world-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ss-world-card{min-height:190px;padding:22px 16px;border-radius:34px;display:flex;flex-direction:column;align-items:center;text-align:center;transition:.22s ease;border:1px solid rgba(38,42,70,.05)}.ss-world-card:hover{transform:translateY(-5px);box-shadow:0 20px 36px rgba(54,48,84,.10)}.ss-world-icon{width:70px;height:70px;margin-bottom:12px;border-radius:24px;background:rgba(255,255,255,.73);display:grid;place-items:center;font-size:33px;box-shadow:0 10px 24px rgba(40,35,70,.06)}.ss-world-card strong{font-size:16px}.ss-world-card small{margin-top:4px;color:#6d7382;font-size:16px}.ss-world-card b{margin-top:auto;color:var(--ss-orange);font-size:16px}.ss-world-tone-1{background:#fff2e9}.ss-world-tone-2{background:#f3efff}.ss-world-tone-3{background:#eefbf7}.ss-world-tone-4{background:#eff7ff}.ss-world-tone-5{background:#fff9dd}
.ss-games-showcase{position:relative;overflow:hidden;background:var(--ss-purple);color:#fff}.ss-games-showcase-inner{width:min(1120px,calc(100% - 28px));margin:auto;padding:104px 0 100px}.ss-wave-purple-top{position:absolute;left:-2%;right:-2%;top:-1px;height:56px;background:#fff;clip-path:polygon(0 0,100% 0,100% 35%,89% 56%,78% 39%,66% 57%,55% 42%,44% 59%,34% 43%,23% 56%,11% 41%,0 58%)}.ss-wave-purple-bottom{position:absolute;left:-2%;right:-2%;bottom:-1px;height:52px;background:#fff;clip-path:polygon(0 54%,10% 39%,21% 58%,32% 41%,43% 60%,54% 42%,65% 58%,77% 39%,89% 58%,100% 43%,100% 100%,0 100%)}.ss-showcase-games{display:grid;gap:15px}.ss-showcase-card{position:relative;min-height:240px;padding:12px 12px 18px;border-radius:20px;background:#fff;color:var(--ss-ink);box-shadow:0 18px 34px rgba(40,23,100,.18);transition:.22s ease}.ss-showcase-card:hover{transform:translateY(-5px)}.ss-showcase-art{position:relative;height:125px;border-radius:14px;display:grid;place-items:center;overflow:hidden}.ss-showcase-art span{position:relative;z-index:2;font-size:68px;filter:drop-shadow(0 12px 10px rgba(25,30,60,.11))}.ss-showcase-art i{position:absolute;width:80px;height:80px;border-radius:50%;background:rgba(255,255,255,.25);right:-8px;top:-15px}.ss-showcase-art.tone-1{background:linear-gradient(135deg,#79d7ff,#d5f3ff)}.ss-showcase-art.tone-2{background:linear-gradient(135deg,#ffcb75,#fff0a7)}.ss-showcase-art.tone-3{background:linear-gradient(135deg,#a99bff,#e1ddff)}.ss-showcase-art.tone-4{background:linear-gradient(135deg,#90e2b6,#e4ffe9)}.ss-showcase-art.tone-5{background:linear-gradient(135deg,#ff99ba,#ffe0e9)}.ss-showcase-art.tone-6{background:linear-gradient(135deg,#8abaff,#d9e9ff)}.ss-showcase-card>div:nth-child(2){padding:13px 5px 0}.ss-showcase-card small{font-size:16px;color:#8a8fa0;text-transform:uppercase;letter-spacing:.08em}.ss-showcase-card h3{margin:4px 0 5px;font-size:16px}.ss-showcase-card p{margin:0;font-size:16px;line-height:1.55}.ss-access-badge{position:absolute;right:18px;top:18px;padding:5px 8px;border-radius:999px;font-size:16px;font-weight:800;letter-spacing:.06em}.ss-access-badge.basic{background:#e7f9ef;color:#28805c}.ss-access-badge.pro{background:#fff0c8;color:#9a6400}.ss-showcase-action{text-align:center;margin-top:30px}.ss-btn-light{background:#fff;color:var(--ss-purple)}
.ss-how-section{width:min(1120px,calc(100% - 28px));margin:auto;padding:95px 0}.ss-how-grid{display:grid;gap:14px}.ss-how-grid article{position:relative;min-height:210px;padding:23px;border:1px solid #ededf2;border-radius:22px;background:#fff;box-shadow:0 14px 32px rgba(52,48,75,.05)}.ss-how-grid article>span{width:35px;height:35px;border-radius:11px;display:grid;place-items:center;background:#fff0e8;color:#d76028;font-size:16px;font-weight:800}.ss-how-grid article>b{display:block;margin:20px 0 10px;font-size:29px}.ss-how-grid h3{margin-bottom:6px;font-size:16px}.ss-how-grid p{margin:0;font-size:16px;line-height:1.7}
.ss-plan-section{width:min(1120px,calc(100% - 28px));margin:auto;padding:20px 0 95px;display:grid;gap:28px;align-items:center}.ss-plan-copy h2{margin:10px 0 15px;font-size:clamp(28px,4vw,46px);letter-spacing:-.04em}.ss-plan-copy p{font-size:16px;line-height:1.8}.ss-plan-cards{display:grid;gap:14px}.ss-plan-card{min-height:235px;padding:26px;border-radius:26px;display:flex;flex-direction:column;align-items:flex-start}.ss-plan-card>span{font-size:35px}.ss-plan-card small{margin-top:20px;font-size:16px;font-weight:800;letter-spacing:.12em}.ss-plan-card strong{margin:3px 0 9px;font-size:27px}.ss-plan-card p{margin:0;font-size:16px;line-height:1.65}.ss-plan-card.basic{background:#fff5e9}.ss-plan-card.pro{background:#ede7ff}.ss-plan-card.pro strong{color:var(--ss-purple)}
.ss-parent-section{width:min(1120px,calc(100% - 28px));margin:0 auto 95px;padding:42px;border-radius:30px;background:linear-gradient(110deg,#fff4df,#fffaf1);display:grid;gap:24px;align-items:center;overflow:hidden}.ss-parent-copy h2{margin:10px 0 12px;font-size:clamp(25px,3.7vw,41px);letter-spacing:-.04em}.ss-parent-copy p{margin:0;font-size:16px;line-height:1.8}.ss-parent-people{display:flex;justify-content:center;align-items:flex-end}.ss-parent-people span{font-size:75px;margin:0 -8px;filter:drop-shadow(0 14px 14px rgba(60,50,80,.10))}
.ss-final-cta{width:min(1120px,calc(100% - 28px));margin:0 auto 90px;padding:38px;border-radius:28px;background:linear-gradient(115deg,#6e51ea,#8064ef);color:#fff;display:grid;gap:24px;align-items:center}.ss-final-cta span{font-size:16px;font-weight:800;letter-spacing:.13em}.ss-final-cta h2{margin:7px 0 7px;color:#fff;font-size:clamp(25px,3.5vw,40px)}.ss-final-cta p{margin:0;color:#e9e5ff;font-size:16px}.ss-btn-yellow{background:var(--ss-yellow);color:#332b18;box-shadow:0 12px 28px rgba(48,35,100,.18)}
/* Public catalog */
.is-public-library{width:min(1180px,calc(100% - 28px));margin:auto;padding:42px 0 80px}.ss-public-catalog-hero{margin-bottom:25px;padding:42px;border-radius:30px;background:linear-gradient(105deg,#fbfde9,#f6f8df);display:grid;gap:28px;align-items:center;overflow:hidden}.ss-public-catalog-hero h1{margin:10px 0 14px;font-size:clamp(36px,5vw,58px);letter-spacing:-.05em}.ss-public-catalog-hero h1 span{color:var(--ss-purple)}.ss-public-catalog-hero p{max-width:620px;margin:0;font-size:16px;line-height:1.8}.ss-catalog-summary{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.ss-catalog-summary span{min-width:100px;padding:9px 12px;border-radius:14px;background:#fff;display:grid;box-shadow:0 8px 20px rgba(50,45,75,.04)}.ss-catalog-summary b{font-size:17px}.ss-catalog-summary small{font-size:16px;color:#8a8e9c}.ss-catalog-visual{position:relative;min-height:250px;border-radius:24px;background:linear-gradient(145deg,#7a5cf0,#5b40d6);overflow:hidden}.ss-catalog-boy{position:absolute;left:50%;bottom:-8px;transform:translateX(-50%);font-size:145px}.ss-catalog-float{position:absolute;width:48px;height:48px;border-radius:16px;background:#fff;display:grid;place-items:center;font-size:23px;box-shadow:0 10px 22px rgba(39,27,95,.15)}.ss-catalog-float.one{left:10%;top:15%}.ss-catalog-float.two{right:12%;top:20%}.ss-catalog-float.three{right:24%;bottom:12%}.ss-catalog-visual>span{position:absolute;left:18px;bottom:16px;color:#fff;font-size:16px;font-weight:800;letter-spacing:.12em}.ss-public-filter{margin:0 0 14px;padding:12px;border:1px solid #ececf2;border-radius:18px;background:#fff;box-shadow:0 10px 24px rgba(50,45,75,.04)}.ss-public-tabs{margin-bottom:30px}.ss-public-result-head{margin:28px 0 15px}.ss-public-game-grid .play-game-tile{border:1px solid #ececf2;box-shadow:0 14px 30px rgba(50,45,75,.06)}.ss-catalog-cta{margin-top:45px;padding:30px;border-radius:24px;background:#f2edff;display:grid;gap:20px;align-items:center}.ss-catalog-cta span{font-size:16px;font-weight:800;color:var(--ss-purple);letter-spacing:.12em}.ss-catalog-cta h2{margin:5px 0 6px;font-size:25px}.ss-catalog-cta p{margin:0;font-size:16px}.ss-catalog-cta a{justify-self:start;padding:11px 16px;border-radius:12px;background:var(--ss-purple);color:#fff;font-size:16px;font-weight:800}
/* Public leaderboard */
.is-public-ranking{width:min(1120px,calc(100% - 28px));margin:auto;padding:44px 0 86px}.ss-public-ranking-hero{margin-bottom:24px;padding:42px;border-radius:30px;background:linear-gradient(105deg,#fbfde9,#f6f8df);display:grid;gap:28px;align-items:center}.ss-public-ranking-hero h1{margin:10px 0 14px;font-size:clamp(37px,5vw,58px);letter-spacing:-.05em}.ss-public-ranking-hero h1 span{color:var(--ss-purple)}.ss-public-ranking-hero p{max-width:620px;margin:0;font-size:16px;line-height:1.8}.ss-ranking-visual{position:relative;min-height:210px;border-radius:24px;background:#ede7ff;display:grid;place-items:center}.ss-ranking-visual .cup{font-size:110px;filter:drop-shadow(0 18px 16px rgba(58,45,105,.13))}.ss-ranking-visual .spark{position:absolute;font-size:27px}.ss-ranking-visual .s1{left:16%;top:20%}.ss-ranking-visual .s2{right:17%;top:16%}.ss-ranking-visual .s3{right:24%;bottom:18%}.ss-public-league-toggle{margin:0 auto 25px}.ss-public-league-intro{border:1px solid #ececf2;box-shadow:0 12px 28px rgba(50,45,75,.04)}.ss-public-podium .podium-player,.ss-public-ranking-list,.ss-public-ranking-rules article{border:1px solid #ececf2;box-shadow:0 12px 28px rgba(50,45,75,.05)}.ss-public-ranking-empty{border:1px solid #ececf2}.ss-ranking-cta{margin-top:34px;padding:30px;border-radius:24px;background:var(--ss-purple);color:#fff;display:grid;gap:18px;align-items:center}.ss-ranking-cta span{font-size:16px;font-weight:800;letter-spacing:.12em}.ss-ranking-cta h2{margin:4px 0 0;color:#fff}.ss-ranking-cta a{justify-self:start;padding:11px 16px;border-radius:12px;background:var(--ss-yellow);color:#2a251c;font-size:16px;font-weight:800}
/* Public game detail */
.is-public-detail{width:min(1120px,calc(100% - 28px));margin:auto;padding:38px 0 82px}.ss-public-detail-hero{border:1px solid #ececf2;box-shadow:0 18px 38px rgba(50,45,75,.06)}.ss-public-action-card{box-shadow:none}.ss-public-detail-grid section{border:1px solid #ececf2}.ss-detail-join{margin-top:35px;padding:28px;border-radius:24px;background:#f2edff;display:grid;gap:18px;align-items:center}.ss-detail-join span{font-size:16px;font-weight:800;color:var(--ss-purple);letter-spacing:.12em}.ss-detail-join h2{margin:5px 0 0;font-size:24px}.ss-detail-join a{justify-self:start;padding:11px 16px;border-radius:12px;background:var(--ss-purple);color:#fff;font-size:16px;font-weight:800}
/* Auth public */
.ss-auth-school-shell{width:min(1040px,calc(100% - 28px));margin:auto;padding:55px 0 80px;display:grid;gap:22px;align-items:stretch}.ss-auth-school-visual{position:relative;min-height:440px;padding:38px;border-radius:30px;background:linear-gradient(145deg,#fafce6,#f6f8d8);overflow:hidden}.ss-auth-school-visual.register{background:linear-gradient(145deg,#f1edff,#e9e3ff)}.ss-auth-school-visual h1{max-width:520px;margin:10px 0 14px;font-size:clamp(34px,4.7vw,54px);letter-spacing:-.05em}.ss-auth-school-visual>p{max-width:500px;font-size:16px;line-height:1.8}.ss-auth-visual-scene{position:absolute;right:25px;bottom:16px;width:270px;height:190px}.ss-auth-visual-scene .kid{position:absolute;right:55px;bottom:0;font-size:120px}.ss-auth-visual-scene .game,.ss-auth-visual-scene .star,.ss-auth-visual-scene .book{position:absolute;width:54px;height:54px;border-radius:18px;background:#fff;display:grid;place-items:center;font-size:25px;box-shadow:0 12px 25px rgba(50,45,75,.10)}.ss-auth-visual-scene .game{left:0;top:18px}.ss-auth-visual-scene .star{right:0;top:0}.ss-auth-visual-scene .book{left:28px;bottom:15px}.ss-auth-points{position:absolute;left:38px;bottom:30px;display:flex;gap:8px;flex-wrap:wrap}.ss-auth-points span{padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.72);font-size:16px;font-weight:700}.ss-auth-school-card{padding:32px;border:1px solid #ececf2;border-radius:30px;background:#fff;box-shadow:0 20px 50px rgba(50,45,75,.07)}.ss-auth-school-card h2{margin:9px 0 8px;font-size:31px}.ss-auth-school-card>p{font-size:16px}.ss-auth-school-form{display:grid;gap:13px;margin-top:22px}.ss-auth-school-form label{display:grid;gap:6px}.ss-auth-school-form label>span{font-size:16px;font-weight:700;color:#41495c}.ss-auth-school-form input{width:100%;min-height:48px;padding:11px 13px;border:1px solid #dedee7;border-radius:13px;outline:none;background:#fff;font-size:16px}.ss-auth-school-form input:focus{border-color:#9983ef;box-shadow:0 0 0 3px rgba(111,80,233,.09)}.ss-auth-school-form label small{font-size:16px;color:#888d9b}.ss-auth-school-form button{min-height:48px;border:0;border-radius:13px;background:var(--ss-orange);color:#fff;font-weight:800;cursor:pointer}.ss-auth-switch{margin-top:18px;padding-top:16px;border-top:1px solid #efeff3;font-size:16px;color:#717787}.ss-auth-switch a{color:var(--ss-purple);font-weight:700}
@media(min-width:620px){
  .ss-world-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ss-showcase-games{grid-template-columns:repeat(2,1fr)}.ss-how-grid{grid-template-columns:repeat(2,1fr)}.ss-plan-cards{grid-template-columns:1fr 1fr}.ss-catalog-cta,.ss-ranking-cta,.ss-detail-join,.ss-final-cta{grid-template-columns:1fr auto}.ss-catalog-cta a,.ss-ranking-cta a,.ss-detail-join a{justify-self:end}.ss-final-cta .ss-btn-yellow{justify-self:end}.ss-about-section,.ss-plan-section,.ss-parent-section,.ss-auth-school-shell{grid-template-columns:1fr 1fr}.ss-about-visual{min-height:430px}
}
@media(min-width:860px){
  .ss-school-nav{display:flex}.ss-header-login{display:inline-flex}.ss-school-hero-inner{grid-template-columns:1.02fr .98fr;padding-top:66px}.ss-school-visual{min-height:420px}.ss-world-card-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.ss-showcase-games{grid-template-columns:repeat(3,1fr)}.ss-how-grid{grid-template-columns:repeat(4,1fr)}.ss-public-catalog-hero,.ss-public-ranking-hero{grid-template-columns:1.15fr .85fr}.ss-auth-school-shell{grid-template-columns:1.12fr .88fr}.ss-auth-school-card{padding:42px}.ss-final-cta{padding:45px 52px}.ss-parent-section{padding:50px 55px}
}
@media(max-width:619px){
  .ss-top-strip{display:none}.ss-school-header .public-header-inner{min-height:66px}.ss-header-cta{padding:9px 12px}.ss-school-hero-inner{padding-top:34px}.ss-school-visual{min-height:330px}.ss-student-face{font-size:93px}.ss-student-card{min-height:245px}.ss-admission-sticker{left:39%;top:48%}.ss-about-section{padding-top:65px}.ss-about-visual{min-height:330px}.ss-about-child{font-size:155px}.ss-world-card{min-height:170px;padding:18px 12px}.ss-world-icon{width:58px;height:58px;font-size:28px}.ss-games-showcase-inner{padding-top:92px}.ss-auth-school-visual{min-height:390px;padding:27px}.ss-auth-points{left:27px;bottom:24px}.ss-auth-visual-scene{right:4px;bottom:48px;transform:scale(.82);transform-origin:right bottom}.ss-public-catalog-hero,.ss-public-ranking-hero{padding:28px}.ss-catalog-visual,.ss-ranking-visual{min-height:210px}
}

/* =========================================================
   v0.7.0 — SMARTSTUDY PUBLIC THEME
   Visual direction adapted from the supplied CikguAnita.my
   reference: floating white nav, orange hero, cream canvas,
   playful badges, organic waves and a strong blue footer.
========================================================= */
:root{
  --ca-orange:#ffad0a;
  --ca-orange-2:#ff8b20;
  --ca-orange-deep:#f56e19;
  --ca-blue:#1060bc;
  --ca-blue-dark:#0b438d;
  --ca-cyan:#56c8ed;
  --ca-pink:#f64b99;
  --ca-green:#46c879;
  --ca-yellow:#ffd735;
  --ca-cream:#fffaf0;
  --ca-cream-2:#fff6e5;
  --ca-ink:#102b60;
  --ca-muted:#59677f;
  --ca-line:rgba(16,43,96,.10);
  --ca-radius:24px;
  --ca-shadow:0 18px 45px rgba(42,35,73,.10);
}
.layout-public{background:var(--ca-cream);color:var(--ca-ink);font-family:"Nunito","Poppins",sans-serif}
.layout-public h1,.layout-public h2,.layout-public h3,.layout-public .ca-brand-lockup,.layout-public .ca-header-brand strong{font-family:"Fredoka","Nunito",sans-serif}
.layout-public .public-main{background:var(--ca-cream)}
.ca-shell{width:min(1120px,calc(100% - 30px));margin-inline:auto}

/* Floating public header */
.ca-public-header{position:absolute!important;z-index:90;top:16px;left:0;right:0;height:auto!important;background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important}
.ca-header-shell{width:min(1120px,calc(100% - 30px));min-height:64px;margin:auto;padding:8px 10px 8px 18px;border-radius:0 0 28px 28px;background:rgba(255,255,255,.97);display:flex;align-items:center;gap:20px;box-shadow:0 14px 34px rgba(70,42,15,.10);border:1px solid rgba(255,255,255,.65)}
.ca-header-brand{margin-right:auto;display:flex;align-items:center;gap:8px;min-width:0}
.ca-brand-spark{color:var(--ca-orange);font-size:18px}.ca-header-brand>span:last-child{display:grid;line-height:1}.ca-header-brand strong{font-size:19px;font-weight:700;color:var(--ca-blue);letter-spacing:-.03em}.ca-header-brand strong span{color:var(--ca-orange-deep)}.ca-header-brand small{margin-top:4px;font-size:16px;font-weight:800;letter-spacing:.045em;color:#46618f}
.ca-public-nav{display:none;align-items:center;gap:24px}.ca-public-nav a{position:relative;padding:16px 0;color:#163766;font-size:16px;font-weight:800}.ca-public-nav a:hover,.ca-public-nav a.is-active{color:var(--ca-orange-deep)}.ca-public-nav a.is-active:after{content:"";position:absolute;left:20%;right:20%;bottom:8px;height:3px;border-radius:999px;background:var(--ca-orange)}
.ca-header-actions{display:flex;align-items:center;gap:7px}.ca-login-link{display:none;padding:10px 12px;color:#163766;font-size:16px;font-weight:800}.ca-header-cta{min-height:42px;padding:10px 17px;border-radius:999px;background:linear-gradient(135deg,#1470d9,#0758b3);color:#fff;font-size:16px;font-weight:900;box-shadow:0 10px 22px rgba(16,96,188,.22)}.ca-header-cta:hover{transform:translateY(-1px)}
.ca-public-main{padding-top:0!important}

/* Home hero */
.ca-hero{position:relative;overflow:hidden;min-height:610px;padding-top:96px;background:linear-gradient(118deg,#ff9f00 0%,#ffb20d 52%,#ffc129 100%);color:#fff}
.ca-hero-grid{position:absolute;inset:0 0 0 54%;opacity:.16;background-image:linear-gradient(rgba(255,255,255,.7) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.7) 1px,transparent 1px);background-size:72px 72px}
.ca-hero-inner{position:relative;z-index:2;min-height:500px;padding:28px 0 75px;display:grid;gap:26px;align-items:center}.ca-hero-copy{position:relative;z-index:3}.ca-handnote{display:block;margin-bottom:6px;font-family:"Fredoka",sans-serif;font-size:16px;font-weight:600;line-height:1.25;transform:rotate(-1deg)}
.ca-brand-lockup{display:flex;align-items:flex-end;gap:0;flex-wrap:wrap;margin:4px 0 0;line-height:.88;letter-spacing:-.055em}.ca-brand-lockup>span{font-size:clamp(46px,7vw,78px);color:#0e62bd;text-shadow:0 3px 0 #fff,-2px 0 0 #fff,2px 0 0 #fff,0 -2px 0 #fff}.ca-brand-lockup>strong{font-size:clamp(46px,7vw,78px);color:#ff5c23;text-shadow:0 3px 0 #fff,-2px 0 0 #fff,2px 0 0 #fff,0 -2px 0 #fff}.ca-brand-lockup>b{margin:0 0 5px 3px;font-size:25px;color:#0e62bd;text-shadow:0 2px 0 #fff}
.ca-hero-copy h1{max-width:560px;margin:12px 0 8px;color:#123d82;font-size:clamp(27px,3.7vw,44px);line-height:1.08;letter-spacing:-.035em}.ca-hero-copy h1 span{color:#fff}.ca-hero-copy>p{max-width:585px;margin:0;color:#17376d;font-size:16px;font-weight:700;line-height:1.65}
.ca-hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.ca-btn{min-height:44px;padding:11px 18px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:16px;font-weight:900;transition:.2s ease}.ca-btn-blue{background:linear-gradient(135deg,#1272df,#0958b2);color:#fff;box-shadow:0 10px 22px rgba(16,96,188,.25)}.ca-btn-white{background:#fff;color:#173d74;box-shadow:0 9px 20px rgba(89,49,13,.12)}.ca-btn-orange{background:linear-gradient(135deg,#ff8d1d,#ff6e17);color:#fff;box-shadow:0 10px 22px rgba(237,104,27,.20)}.ca-btn:hover{transform:translateY(-2px)}
.ca-trust-row{display:flex;flex-wrap:wrap;gap:18px;margin-top:18px}.ca-trust-row>span{display:flex;align-items:center;gap:7px;color:#153d77}.ca-trust-row i{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;font-style:normal;font-size:16px;font-weight:900;background:rgba(255,255,255,.7)}.ca-trust-row i.blue{color:#0e62bd}.ca-trust-row i.pink{color:#ef478f}.ca-trust-row i.orange{color:#f07114}.ca-trust-row b{font-size:16px;line-height:1.15}
.ca-hero-visual{position:relative;min-height:360px}.ca-character-card{position:absolute;z-index:3;left:19%;right:20%;bottom:0;height:330px;display:flex;align-items:flex-end;justify-content:center}.ca-character{position:relative;z-index:2;font-size:215px;line-height:.9;filter:drop-shadow(0 18px 16px rgba(80,47,12,.15))}.ca-laptop{position:absolute;z-index:4;left:50%;bottom:4px;transform:translateX(-50%);width:142px;height:88px;border-radius:10px 10px 4px 4px;background:linear-gradient(145deg,#d9dde3,#a7afb8);border:3px solid rgba(255,255,255,.75);display:grid;place-items:center;color:#fff;font-size:24px;box-shadow:0 13px 20px rgba(63,46,32,.16)}
.ca-robot{position:absolute;z-index:4;right:3%;bottom:18px;font-size:92px;filter:drop-shadow(0 12px 12px rgba(34,43,80,.15))}.ca-paper-plane{position:absolute;z-index:2;left:6%;top:12%;font-size:44px;transform:rotate(-18deg);color:#fff}.ca-speech{position:absolute;z-index:5;right:0;top:18%;padding:13px 17px;border-radius:28px 28px 28px 6px;background:#fff;color:#1e4a87;font-size:16px;font-weight:700;line-height:1.35;box-shadow:0 12px 26px rgba(72,44,20,.10);transform:rotate(-4deg)}.ca-speech strong{color:#ef5b26}.ca-speech span{color:#f0468b}.ca-badges{position:absolute;z-index:5;right:0;top:4%;display:grid;gap:6px;width:122px}.ca-badges>span{padding:8px 10px;border:3px solid #fff;border-radius:10px;text-align:center;color:#0e407e;font-size:16px;font-weight:900;box-shadow:0 8px 18px rgba(59,42,25,.10)}.ca-badges .pink{background:#f84b96;color:#fff}.ca-badges .cyan{background:#5dd3f0}.ca-badges .yellow{background:#ffd840}.ca-badges .green{background:#61d083}.ca-side-note{position:absolute;z-index:5;right:13px;bottom:92px;color:#fff;font-family:"Fredoka",sans-serif;font-size:16px;font-weight:700;line-height:1.05;transform:rotate(-6deg)}
.ca-doodle{position:absolute;z-index:1;color:#fff;font-size:34px;font-weight:900}.ca-doodle-star{left:3%;top:24%}.ca-doodle-heart{right:1%;top:45%}.ca-doodle-spark{left:2%;bottom:19%}.ca-doodle-zap{right:3%;bottom:15%}
.ca-wave{position:absolute;left:-3%;right:-3%;bottom:-2px;height:62px;background:var(--ca-cream);clip-path:ellipse(55% 48% at 50% 100%)}

/* Public section heading */
.ca-products,.ca-flow,.ca-access,.ca-values{background:var(--ca-cream)}.ca-products{padding:68px 0 72px}.ca-section-heading{text-align:center;max-width:720px;margin:0 auto 32px}.ca-section-heading h2{margin:5px 0 7px;color:var(--ca-blue);font-size:clamp(29px,4vw,43px);letter-spacing:-.035em}.ca-section-heading h2 em{font-style:normal;color:#ff6725}.ca-section-heading p{margin:0;color:#4c6487;font-size:16px;font-weight:700;line-height:1.55}.ca-rays{display:block;color:var(--ca-orange);font-size:22px;transform:rotate(-25deg)}.ca-kicker{display:inline-flex;color:var(--ca-orange-deep);font-size:16px;font-weight:900;letter-spacing:.13em}.ca-section-heading.inverse h2,.ca-section-heading.inverse p{color:#fff}.ca-section-heading.inverse .ca-kicker{color:#ffd63d}

/* World cards — school product card feeling */
.ca-world-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.ca-world-card{position:relative;min-height:212px;padding:28px 15px 18px;border-radius:20px;display:flex;flex-direction:column;align-items:center;text-align:center;border:1px solid rgba(27,60,109,.09);box-shadow:0 14px 30px rgba(35,44,78,.06);overflow:hidden;transition:.2s ease}.ca-world-card:hover{transform:translateY(-4px);box-shadow:0 20px 35px rgba(35,44,78,.10)}.ca-world-card.tone-1{background:#fff1e8}.ca-world-card.tone-2{background:#e8f9ff}.ca-world-card.tone-3{background:#f0eaff}.ca-world-card.tone-4{background:#e9faef}.ca-world-card.tone-5{background:#fff7d9}.ca-world-ribbon{position:absolute;left:10px;top:10px;padding:4px 8px;border-radius:999px;background:#ff4d93;color:#fff;font-size:16px;font-weight:900}.ca-world-card:nth-child(2n) .ca-world-ribbon{background:#28b96b}.ca-world-icon{width:74px;height:74px;margin-top:8px;border-radius:24px;background:rgba(255,255,255,.82);display:grid;place-items:center;font-size:38px;box-shadow:0 10px 20px rgba(44,50,82,.06)}.ca-world-card h3{margin:12px 0 3px;color:#123f80;font-size:16px}.ca-world-card p{margin:0;color:#61708a;font-size:16px;line-height:1.45}.ca-world-card b{margin-top:auto;padding-top:13px;color:#ff6d1f;font-size:16px}

/* Popular games */
.ca-popular{position:relative;padding:70px 0 76px;background:linear-gradient(180deg,#5c47d6,#6c51e2);color:#fff;overflow:hidden}.ca-popular:before{content:"";position:absolute;left:-3%;right:-3%;top:-1px;height:34px;background:var(--ca-cream);clip-path:polygon(0 0,100% 0,100% 40%,89% 65%,76% 43%,64% 68%,52% 46%,38% 66%,25% 43%,12% 64%,0 45%)}.ca-popular-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ca-game-card{position:relative;min-height:250px;padding:10px 10px 15px;border-radius:18px;background:#fff;color:var(--ca-ink);box-shadow:0 16px 28px rgba(36,23,94,.19);transition:.2s ease}.ca-game-card:hover{transform:translateY(-4px)}.ca-game-art{height:125px;border-radius:13px;display:grid;place-items:center;position:relative;overflow:hidden}.ca-game-art>span{position:relative;z-index:2;font-size:68px;filter:drop-shadow(0 10px 10px rgba(20,30,60,.12))}.ca-game-art i{position:absolute;width:90px;height:90px;border-radius:50%;right:-25px;top:-25px;background:rgba(255,255,255,.3)}.ca-game-art.tone-1{background:linear-gradient(135deg,#6fd9ff,#dff8ff)}.ca-game-art.tone-2{background:linear-gradient(135deg,#ffc65a,#fff0a6)}.ca-game-art.tone-3{background:linear-gradient(135deg,#a68aff,#e2dcff)}.ca-game-art.tone-4{background:linear-gradient(135deg,#6ee1ad,#e1ffed)}.ca-game-art.tone-5{background:linear-gradient(135deg,#ff91b7,#ffe0eb)}.ca-game-art.tone-6{background:linear-gradient(135deg,#87baff,#dceaff)}.ca-game-card small{display:block;margin-top:9px;color:#77849a;font-size:16px;font-weight:900;text-transform:uppercase;letter-spacing:.09em}.ca-game-card h3{margin:2px 0 4px;color:#123f80;font-size:16px}.ca-game-card p{margin:0;color:#5c6d86;font-size:16px;line-height:1.5}.ca-game-card>b{display:inline-block;margin-top:9px;color:#ff6f1f;font-size:16px}.ca-game-access{position:absolute;z-index:3;right:14px;top:14px;padding:5px 7px;border-radius:999px;font-size:16px;font-weight:900}.ca-game-access.basic{background:#dff6e8;color:#1f7d4f}.ca-game-access.pro{background:#fff0b8;color:#986200}.ca-reward-card{grid-column:1/-1;min-height:240px;padding:24px;border-radius:22px;background:linear-gradient(145deg,#714df0,#945cff);color:#fff;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 16px 30px rgba(37,21,92,.18)}.ca-reward-kicker{font-size:16px;font-weight:900;letter-spacing:.1em}.ca-reward-card h3{margin:5px 0 4px;color:#fff;font-size:22px}.ca-gift{font-size:62px;filter:drop-shadow(0 12px 10px rgba(45,22,90,.25))}.ca-reward-card p{max-width:310px;margin:0;color:#f0eaff;font-size:16px;line-height:1.55}.ca-reward-card a{margin-top:12px;padding:9px 15px;border-radius:999px;background:#4bd05c;color:#fff;font-size:16px;font-weight:900;box-shadow:0 8px 18px rgba(25,85,35,.24)}

/* Flow */
.ca-flow{padding:72px 0}.ca-flow-grid{display:grid;gap:12px}.ca-flow-grid article{min-height:180px;padding:18px;border:1px solid var(--ca-line);border-radius:18px;background:#fff;box-shadow:0 10px 25px rgba(42,49,81,.05)}.ca-flow-grid .n{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font-size:16px;font-weight:900}.ca-flow-grid .n.orange{background:#ffe5cc;color:#ae4b13}.ca-flow-grid .n.purple{background:#e7ddff;color:#6141d6}.ca-flow-grid .n.blue{background:#d7efff;color:#1470be}.ca-flow-grid .n.green{background:#d9f5e7;color:#208157}.ca-flow-grid article>b{display:block;margin:15px 0 8px;font-size:27px}.ca-flow-grid h3{margin:0 0 5px;color:#143d77;font-size:16px}.ca-flow-grid p{margin:0;color:#64748d;font-size:16px;line-height:1.55}

/* Access */
.ca-access{padding:15px 0 75px}.ca-access-grid{display:grid;gap:22px;align-items:center}.ca-access-copy h2{margin:7px 0 10px;color:#123f80;font-size:clamp(30px,4.2vw,47px);line-height:1.04;letter-spacing:-.035em}.ca-access-copy h2 em{font-style:normal;color:#ff6b21}.ca-access-copy p{margin:0 0 18px;color:#536985;font-size:16px;line-height:1.7}.ca-access-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ca-access-cards article{min-height:205px;padding:20px;border-radius:19px;display:flex;flex-direction:column;box-shadow:0 12px 24px rgba(36,43,77,.06)}.ca-access-cards article.basic{background:#fff0dc}.ca-access-cards article.pro{background:#e8e2ff}.ca-access-cards article>span{font-size:31px}.ca-access-cards small{margin-top:16px;font-size:16px;font-weight:900;letter-spacing:.11em}.ca-access-cards strong{margin:2px 0 7px;color:#133f7d;font-size:24px}.ca-access-cards p{margin:0;color:#5b6c85;font-size:16px;line-height:1.5}

/* Values */
.ca-values{padding:0 0 65px}.ca-values-grid{display:grid;grid-template-columns:1fr 1fr;gap:0}.ca-values article{padding:15px 12px;display:flex;align-items:center;gap:9px;border-right:1px solid rgba(16,43,96,.08)}.ca-values article:last-child{border-right:0}.ca-values i{flex:0 0 auto;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;font-style:normal;font-size:16px;font-weight:900}.ca-values i.pink{background:#ef4f95}.ca-values i.green{background:#46c879}.ca-values i.orange{background:#f29316}.ca-values i.blue{background:#1871c9}.ca-values h3{margin:0 0 2px;color:#123f80;font-size:16px}.ca-values p{margin:0;color:#60708a;font-size:16px;line-height:1.35}

/* Footer */
.ca-footer{position:relative;background:#0e5db5;color:#fff}.ca-footer-wave{height:28px;background:var(--ca-cream);clip-path:polygon(0 0,100% 0,100% 45%,86% 65%,72% 46%,58% 66%,45% 48%,30% 66%,15% 47%,0 65%)}.ca-footer-main{min-height:120px;padding:22px 0;display:grid;gap:18px;align-items:center}.ca-footer-brand{display:flex;align-items:center;gap:7px;color:#fff}.ca-footer-brand>span{color:#ffb318}.ca-footer-brand>div{display:grid}.ca-footer-brand strong{font-family:"Fredoka",sans-serif;font-size:20px}.ca-footer-brand strong span{color:#ff9e1b}.ca-footer-brand small{font-size:16px;font-weight:800}.ca-footer blockquote{margin:0;font-size:16px;font-weight:700;font-style:italic;text-align:left;line-height:1.5}.ca-footer blockquote span{color:#ffbc2a}.ca-footer-main>nav{display:flex;flex-wrap:wrap;gap:7px}.ca-footer-main>nav a{padding:7px 10px;border:1px solid rgba(255,255,255,.25);border-radius:999px;color:#fff;font-size:16px;font-weight:800}.ca-footer-bottom{background:#dcedff;color:#245489}.ca-footer-bottom>.ca-shell{min-height:40px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:16px}.ca-footer-bottom nav{display:flex;gap:12px;align-items:center}.ca-footer-bottom a{color:#245489;font-weight:700}

/* Apply same public language to Play/Ranking/Game Detail */
.is-public-library,.is-public-ranking,.is-public-detail{padding-top:112px!important}
.ss-public-catalog-hero,.ss-public-ranking-hero{background:linear-gradient(118deg,#ff9f00,#ffb20d)!important;border-radius:26px!important;color:#173f7b!important;box-shadow:0 18px 40px rgba(104,61,13,.11)}
.ss-public-catalog-hero h1,.ss-public-ranking-hero h1{color:#123d82}.ss-public-catalog-hero h1 span,.ss-public-ranking-hero h1 span{color:#fff!important}.ss-public-catalog-hero p,.ss-public-ranking-hero p{color:#17376d!important;font-weight:700}.ss-catalog-summary span{border:1px solid rgba(19,62,118,.08);background:rgba(255,255,255,.82)}
.ss-catalog-visual{background:linear-gradient(145deg,#1471d8,#0c4f9d)!important}.ss-ranking-visual{background:linear-gradient(145deg,#fff2c4,#ffe39a)!important}.ss-public-filter{border-color:rgba(16,43,96,.09)!important;border-radius:17px!important}.ss-public-game-grid .play-game-tile{border-color:rgba(16,43,96,.09)!important;box-shadow:0 13px 28px rgba(35,44,78,.07)!important}.ss-catalog-cta,.ss-detail-join{background:#fff0db!important}.ss-catalog-cta span,.ss-detail-join span{color:#e66018!important}.ss-catalog-cta a,.ss-detail-join a{background:linear-gradient(135deg,#1471d8,#0a57aa)!important}.ss-ranking-cta{background:linear-gradient(118deg,#ff9f00,#ffb20d)!important;color:#153d77!important}.ss-ranking-cta h2{color:#153d77!important}.ss-ranking-cta a{background:#1060bc!important;color:#fff!important}
.ss-public-detail-hero{border-radius:24px!important;border-color:rgba(16,43,96,.09)!important;box-shadow:0 16px 35px rgba(43,46,76,.07)!important}.is-public-detail .play-back-link{color:#0e5db5!important;font-weight:800}

/* Auth pages — same brand language */
.layout-auth{background:var(--ca-cream)}.premium-auth-header{background:transparent!important;border:0!important}.auth-header-inner{width:min(1040px,calc(100% - 30px))!important;margin:16px auto 0!important;padding:10px 14px!important;border-radius:22px!important;background:#fff!important;box-shadow:0 12px 30px rgba(44,42,70,.08)!important}.premium-auth-main{background:var(--ca-cream)!important}.ss-auth-school-shell{padding-top:28px!important}.ss-auth-school-visual{background:linear-gradient(135deg,#ff9f00,#ffb20d)!important;color:#173f7b!important}.ss-auth-school-visual.register{background:linear-gradient(135deg,#ff9f00,#ffb20d)!important}.ss-auth-school-visual h1{color:#123d82!important}.ss-auth-school-visual>p{color:#17376d!important;font-weight:700}.ss-auth-points span{background:rgba(255,255,255,.82)!important;color:#17447e!important}.ss-auth-school-card{border-color:rgba(16,43,96,.09)!important}.ss-auth-school-form button{background:linear-gradient(135deg,#1471d8,#0a57aa)!important}.ss-auth-switch a{color:#e9681e!important}

/* Responsive */
@media(min-width:620px){
  .ca-world-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ca-popular-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ca-reward-card{grid-column:span 3}.ca-flow-grid{grid-template-columns:repeat(2,1fr)}.ca-access-grid{grid-template-columns:1fr 1fr}.ca-footer-main{grid-template-columns:1fr 1fr}.ca-footer-main>nav{grid-column:1/-1}.ca-values-grid{grid-template-columns:repeat(4,1fr)}
}
@media(min-width:860px){
  .ca-public-nav{display:flex}.ca-login-link{display:inline-flex}.ca-hero-inner{grid-template-columns:1.02fr .98fr;padding-top:36px}.ca-hero-visual{min-height:400px}.ca-world-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.ca-popular-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.ca-reward-card{grid-column:span 2;grid-row:span 1}.ca-flow-grid{grid-template-columns:repeat(4,1fr)}.ca-footer-main{grid-template-columns:1.05fr 1.25fr auto}.ca-footer-main>nav{grid-column:auto;justify-content:flex-end}.ca-footer blockquote{text-align:center}
}
@media(max-width:859px){
  .ca-header-shell{border-radius:0 0 22px 22px}.ca-hero{padding-top:90px}.ca-hero-inner{padding-top:24px}.ca-badges{right:2%;width:110px}.ca-character{font-size:180px}.ca-robot{font-size:72px}.ca-hero-visual{min-height:330px}.ca-side-note{display:none}
}
@media(max-width:619px){
  .ca-public-header{top:8px}.ca-header-shell{width:calc(100% - 16px);min-height:58px;padding:7px 8px 7px 12px}.ca-header-brand strong{font-size:16px}.ca-header-brand small{font-size:16px}.ca-header-cta{padding:9px 11px;font-size:16px}.ca-hero{padding-top:78px}.ca-hero-inner{text-align:center}.ca-handnote{font-size:16px}.ca-brand-lockup{justify-content:center}.ca-brand-lockup>b{font-size:19px}.ca-hero-copy h1{margin-left:auto;margin-right:auto}.ca-hero-copy>p{margin-left:auto;margin-right:auto;font-size:16px}.ca-hero-actions,.ca-trust-row{justify-content:center}.ca-hero-visual{min-height:285px}.ca-character-card{left:12%;right:24%;height:260px}.ca-character{font-size:150px}.ca-laptop{width:105px;height:62px}.ca-robot{right:0;font-size:61px}.ca-paper-plane{font-size:32px}.ca-speech{right:0;top:18%;font-size:16px}.ca-badges{left:0;right:auto;top:7%;width:92px}.ca-badges>span{padding:5px 7px;font-size:16px;border-width:2px}.ca-world-grid{grid-template-columns:repeat(2,1fr)}.ca-world-card{min-height:188px}.ca-popular-grid{grid-template-columns:repeat(2,1fr)}.ca-reward-card{grid-column:1/-1}.ca-flow-grid{grid-template-columns:repeat(2,1fr)}.ca-access-cards{grid-template-columns:1fr 1fr}.ca-values-grid{grid-template-columns:1fr 1fr}.ca-values article{border-bottom:1px solid rgba(16,43,96,.07)}.ca-footer-main{text-align:center}.ca-footer-brand{justify-content:center}.ca-footer blockquote{text-align:center}.ca-footer-main>nav{justify-content:center}.ca-footer-bottom>.ca-shell{flex-direction:column;justify-content:center;padding:8px 0}.is-public-library,.is-public-ranking,.is-public-detail{padding-top:90px!important}
}
@media(max-width:420px){
  .ca-world-card{padding-left:10px;padding-right:10px}.ca-world-icon{width:64px;height:64px;font-size:32px}.ca-game-card{min-height:230px}.ca-game-art{height:110px}.ca-game-art>span{font-size:58px}.ca-flow-grid{grid-template-columns:1fr 1fr}.ca-flow-grid article{padding:14px}.ca-access-cards{grid-template-columns:1fr}.ca-values-grid{grid-template-columns:1fr}.ca-header-brand small{display:none}
}

/* =========================================================
   v0.7.1 — HERO VISUAL IMAGE
   Uses the approved SmartStudy Play hero artwork as the real
   visual layer while keeping copy, CTA and navigation as HTML.
   ========================================================= */
.ca-header-shell{border-radius:28px!important}
.ca-hero.ca-hero--image{min-height:650px;padding-top:104px;background:linear-gradient(118deg,#ffa300 0%,#ffb20d 55%,#ffc12a 100%)}
.ca-hero--image .ca-hero-grid{inset:0 0 0 48%;opacity:.12;background-size:70px 70px}
.ca-hero--image .ca-hero-inner{min-height:535px;padding:34px 0 86px;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:20px}
.ca-hero--image .ca-hero-copy{padding-left:4px}
.ca-hero--image .ca-handnote{margin-bottom:10px;color:#fff;font-size:17px;text-shadow:0 1px 0 rgba(118,65,0,.08)}
.ca-hero--image .ca-brand-lockup{align-items:center;margin-bottom:13px;line-height:.9}
.ca-hero--image .ca-brand-lockup>span{font-size:clamp(42px,5.5vw,67px);color:#0d5fc0;text-shadow:0 3px 0 #fff,-2px 0 #fff,2px 0 #fff,0 -2px 0 #fff}
.ca-hero--image .ca-brand-lockup>strong{margin-left:5px;font-size:clamp(42px,5.5vw,67px);color:#ffd916;text-shadow:0 4px 0 #173f96,-2px 0 #fff,2px 0 #fff,0 -2px #fff}
.ca-hero--image .ca-hero-copy h1{max-width:620px;margin:4px 0 10px;color:#123e7d;font-size:clamp(31px,3.4vw,45px);line-height:1.02}.ca-hero--image .ca-hero-copy h1 span{color:#123e7d}
.ca-hero--image .ca-hero-copy>p{max-width:610px;color:#17376d;font-size:16px;line-height:1.7}
.ca-hero--image .ca-hero-actions{margin-top:24px;gap:12px}.ca-hero--image .ca-btn{min-height:50px;padding:13px 22px;font-size:16px}
.ca-hero--image .ca-trust-row{margin-top:22px;gap:0}.ca-hero--image .ca-trust-row>span{padding:0 18px;border-right:1px solid rgba(22,65,121,.22)}.ca-hero--image .ca-trust-row>span:first-child{padding-left:0}.ca-hero--image .ca-trust-row>span:last-child{border-right:0}.ca-hero--image .ca-trust-row i{width:31px;height:31px;border-radius:50%;background:#fff;box-shadow:0 7px 16px rgba(96,60,10,.08)}.ca-hero--image .ca-trust-row i.green{color:#24a96b}.ca-hero--image .ca-trust-row i.pink{color:#eb3d7f}.ca-hero--image .ca-trust-row i.blue{color:#1265c3}.ca-hero--image .ca-trust-row b{font-size:16px;line-height:1.2}
.ca-hero-image-card{position:relative;z-index:3;min-width:0;margin:0;align-self:end;display:flex;align-items:flex-end;justify-content:flex-end;filter:drop-shadow(0 18px 18px rgba(104,60,0,.07))}
.ca-hero-image-card:before{content:"";position:absolute;left:9%;right:4%;bottom:4%;height:18%;border-radius:50%;background:rgba(122,72,0,.12);filter:blur(22px);z-index:-1}
.ca-hero-image-card img{display:block;width:min(100%,660px);height:auto;max-height:505px;object-fit:contain;object-position:right bottom}
.ca-hero--image .ca-doodle-star{left:2.5%;top:24%;font-size:42px}.ca-hero--image .ca-doodle-spark{left:2%;bottom:20%;font-size:30px}.ca-hero--image .ca-wave{height:72px}

@media(max-width:1050px){
  .ca-hero--image .ca-hero-inner{grid-template-columns:.96fr 1.04fr;gap:8px}
  .ca-hero-image-card img{max-height:455px}
  .ca-hero--image .ca-brand-lockup>span,.ca-hero--image .ca-brand-lockup>strong{font-size:clamp(39px,5.2vw,58px)}
}
@media(max-width:859px){
  .ca-header-shell{border-radius:22px!important}
  .ca-hero.ca-hero--image{padding-top:92px;min-height:auto}
  .ca-hero--image .ca-hero-inner{grid-template-columns:1fr;gap:18px;padding:28px 0 78px;text-align:center}
  .ca-hero--image .ca-hero-copy{padding:0 10px}
  .ca-hero--image .ca-brand-lockup{justify-content:center}
  .ca-hero--image .ca-hero-copy h1,.ca-hero--image .ca-hero-copy>p{margin-left:auto;margin-right:auto}
  .ca-hero--image .ca-hero-actions,.ca-hero--image .ca-trust-row{justify-content:center}
  .ca-hero-image-card{justify-content:center;margin-top:0}
  .ca-hero-image-card img{width:min(100%,650px);max-height:none}
}
@media(max-width:619px){
  .ca-hero.ca-hero--image{padding-top:76px}
  .ca-hero--image .ca-hero-inner{padding:22px 0 62px;gap:14px}
  .ca-hero--image .ca-handnote{font-size:16px}
  .ca-hero--image .ca-brand-lockup>span,.ca-hero--image .ca-brand-lockup>strong{font-size:clamp(38px,13vw,54px)}
  .ca-hero--image .ca-brand-lockup>strong{margin-left:3px}
  .ca-hero--image .ca-hero-copy h1{font-size:clamp(27px,8.5vw,38px)}
  .ca-hero--image .ca-hero-copy>p{font-size:16px;line-height:1.65}
  .ca-hero--image .ca-btn{min-height:46px;padding:11px 16px;font-size:16px;flex:1 1 145px}
  .ca-hero--image .ca-trust-row{gap:10px}.ca-hero--image .ca-trust-row>span{padding:0 7px;border-right:0}.ca-hero--image .ca-trust-row i{width:27px;height:27px}.ca-hero--image .ca-trust-row b{font-size:16px}
  .ca-hero-image-card{margin-left:-8px;margin-right:-8px}
  .ca-hero-image-card img{width:100%;border-radius:22px}
  .ca-hero--image .ca-wave{height:48px}
}


/* =========================================================
   v0.7.2 — Minimum readable text size
   SmartStudy accessibility baseline: all interface copy >=16px
   ========================================================= */
html{font-size:16px}
body{font-size:16px}
input,select,textarea,button{font-size:16px}
small{font-size:16px}

/* Give components more breathing room after raising small copy to 16px. */
.brand-copy small{line-height:1.35}
.premium-public-nav a,.header-cta,.btn,.league-tabs a,.category-chip-row a,.access-badge,.status-pill{line-height:1.25}
.hero-trust,.premium-trust-row,.subject-meta,.game-card-foot,.leaderboard-label,.preview-list-head,.preview-game-copy,.hero-board-topline,.hero-progress,.game-detail-main,.detail-meta{line-height:1.45}
.game-filter-bar input,.game-filter-bar select{min-height:48px}
.bottom-nav a,.bottom-nav button{min-height:56px;line-height:1.2}
@media(max-width:760px){
  body{font-size:16px}
  .premium-public-nav a,.header-cta,.btn,.category-chip-row a,.league-tabs a{font-size:16px}
  .game-hero-copy>p,.premium-hero-copy>p,.section-heading p,.game-library-head p,.leaderboard-head p{font-size:16px}
}

/* =========================================================
   v0.12.0 — Brand logo refresh + premium auth polish
   ========================================================= */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.ss-brand-image{display:block;max-width:100%;height:auto}
.ca-header-brand--logo{flex:0 0 auto;max-width:min(43vw,260px)}
.ss-brand-image--header{width:min(100%,250px)}
.ca-footer-brand{display:inline-flex;align-items:center}
.ss-brand-image--footer{width:min(100%,280px)}
.brand--logo{display:inline-flex;align-items:center;min-width:0}
.ss-brand-image--auth{width:min(100%,260px)}
.app-brand--logo{gap:12px;align-items:center}
.ss-brand-image--app{width:210px;min-width:150px}
.plan-pill{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;background:linear-gradient(135deg,#f4f1ff,#fff7d8);border:1px solid rgba(100,72,190,.10);font-size:16px;font-weight:900;color:#6a54c4;box-shadow:0 10px 20px rgba(70,52,160,.08)}
.ca-brand-lockup--image{display:block;max-width:min(100%,560px);margin-bottom:16px}
.ca-brand-lockup--image img{display:block;width:100%;height:auto;filter:drop-shadow(0 12px 18px rgba(88,45,0,.10))}
.ca-header-shell{align-items:center}
.ca-header-brand--logo,.ca-footer-brand{filter:drop-shadow(0 8px 12px rgba(81,47,9,.06))}

/* Premium auth refresh */
.premium-auth-main{background:
  radial-gradient(circle at top left, rgba(255,190,38,.18), transparent 25%),
  radial-gradient(circle at top right, rgba(110,89,235,.12), transparent 26%),
  linear-gradient(180deg,#fffaf1 0%,#fffdf7 44%,#f7f3ff 100%)!important}
.auth-header-inner{align-items:center}
.auth-header-inner .btn{box-shadow:0 10px 18px rgba(51,61,110,.07)}
.ss-auth-school-shell{gap:24px!important}
.ss-auth-school-visual,.ss-auth-school-card{position:relative;overflow:hidden}
.ss-auth-school-visual:before{content:"";position:absolute;inset:auto -16% -38% auto;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.34),rgba(255,255,255,0) 72%)}
.ss-auth-school-visual:after{content:"";position:absolute;left:-10%;right:-10%;bottom:-80px;height:150px;border-radius:50%;background:rgba(255,250,240,.96)}
.ss-auth-logo{position:relative;z-index:2;display:block;width:min(100%,340px);margin:8px 0 14px;filter:drop-shadow(0 14px 18px rgba(102,58,0,.10))}
.ss-auth-school-visual h1,.ss-auth-school-visual>p,.ss-auth-points,.ss-auth-visual-scene,.ss-section-label{position:relative;z-index:2}
.ss-auth-school-visual h1{max-width:510px;font-family:"Fredoka","Nunito",sans-serif;line-height:1.02!important}
.ss-auth-school-visual>p{max-width:540px}
.ss-auth-points{gap:10px}
.ss-auth-points span{padding:9px 13px!important;border:1px solid rgba(255,255,255,.55);box-shadow:0 10px 18px rgba(65,50,30,.07)}
.ss-auth-school-card{background:linear-gradient(180deg,#ffffff 0%,#fffdfa 100%);box-shadow:0 26px 60px rgba(59,46,103,.10);border:1px solid rgba(16,43,96,.07)!important}
.ss-auth-school-card:before{content:"";position:absolute;top:0;left:0;right:0;height:7px;background:linear-gradient(90deg,#ffb324,#ff6f21,#7c58ef,#3bc8ff)}
.ss-auth-school-card h2{font-family:"Fredoka","Nunito",sans-serif;color:#16386f}
.ss-auth-school-card>p{color:#5d6e86;font-weight:700;line-height:1.65}
.ss-auth-school-form{gap:14px;margin-top:24px}
.ss-auth-school-form input{background:#fffdfb;border-color:#e6e2f1;box-shadow:inset 0 1px 0 rgba(255,255,255,.75)}
.ss-auth-school-form input:focus{background:#fff;box-shadow:0 0 0 4px rgba(89,70,205,.09)}
.ss-auth-school-form button{min-height:52px;font-size:17px;border-radius:16px;box-shadow:0 14px 26px rgba(15,87,170,.18)}
.ss-auth-card-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.ss-auth-card-meta span{padding:9px 12px;border-radius:999px;background:#f5f3ff;color:#5f52a7;font-size:16px;font-weight:800;border:1px solid rgba(101,85,183,.09)}
.ss-auth-switch{margin-top:18px;padding-top:18px}
.ca-footer-main{align-items:center}
.ca-footer blockquote{font-size:18px}
@media(max-width:859px){
  .ca-header-brand--logo{max-width:220px}
  .ss-brand-image--header{width:220px}
  .ss-brand-image--app{width:165px}
  .plan-pill{padding:7px 10px}
}
@media(max-width:619px){
  .ca-header-brand--logo{max-width:170px}
  .ss-brand-image--header{width:170px}
  .ss-brand-image--footer{width:220px}
  .ss-brand-image--auth{width:210px}
  .ca-brand-lockup--image{margin-inline:auto;max-width:430px}
  .ss-auth-logo{width:min(100%,260px)}
  .app-brand--logo{gap:8px}
  .ss-brand-image--app{width:136px}
  .plan-pill{display:none}
}


/* =========================================================
   v0.12.1 — Header logo rebalance
   ========================================================= */
.ca-header-shell{gap:16px;padding:8px 14px 8px 16px}
.ca-header-brand--logo{flex:0 0 auto;max-width:min(32vw,210px);margin-right:6px}
.ss-brand-image--header{width:min(100%,205px)}
.ca-public-nav{margin-left:6px;margin-right:auto;justify-content:center;gap:20px}
.ca-public-nav a{font-size:16px}
.ca-header-actions{gap:12px}
.ca-login-link{padding:10px 16px}
.ca-header-cta{padding:12px 18px}
@media(max-width:859px){
  .ca-header-shell{gap:12px;padding:7px 10px 7px 14px}
  .ca-header-brand--logo{max-width:190px}
  .ss-brand-image--header{width:185px}
  .ca-public-nav{gap:16px}
}
@media(max-width:619px){
  .ca-header-shell{padding:7px 8px 7px 12px}
  .ca-header-brand--logo{max-width:150px}
  .ss-brand-image--header{width:146px}
}


/* =========================================================
   v0.12.2 — Smaller header logo + shorter CTA
   ========================================================= */
.ca-header-shell{gap:14px;padding:8px 14px 8px 16px;min-height:60px}
.ca-header-brand--logo{max-width:min(28vw,182px);margin-right:4px}
.ss-brand-image--header{width:min(100%,178px)}
.ca-public-nav{gap:18px}
.ca-public-nav a{padding:14px 0}
.ca-header-actions{gap:10px}
.ca-login-link{padding:9px 15px;font-size:16px}
.ca-header-cta{padding:10px 16px;font-size:16px;border-radius:18px;box-shadow:0 10px 20px rgba(15,87,170,.16)}
@media(max-width:859px){
  .ca-header-shell{min-height:56px;gap:10px;padding:7px 10px 7px 14px}
  .ca-header-brand--logo{max-width:168px}
  .ss-brand-image--header{width:162px}
  .ca-public-nav{gap:14px}
  .ca-login-link{padding:8px 13px}
  .ca-header-cta{padding:9px 14px}
}
@media(max-width:619px){
  .ca-header-shell{min-height:54px;padding:7px 8px 7px 12px}
  .ca-header-brand--logo{max-width:138px}
  .ss-brand-image--header{width:134px}
  .ca-login-link{padding:8px 12px}
  .ca-header-cta{padding:8px 12px;border-radius:16px}
}


/* =========================================================
   v0.12.3 — Simple balanced public header
   Target: compact logo, single-line menu, clean CTA
   ========================================================= */
.ca-public-header{top:8px!important}
.ca-header-shell{
  width:min(1120px,calc(100% - 32px));
  min-height:70px;
  padding:7px 12px 7px 18px;
  gap:18px;
  border-radius:28px!important;
  background:#fff!important;
  box-shadow:0 10px 24px rgba(60,45,16,.08)!important;
}
.ca-header-brand--logo{
  flex:0 0 auto;
  width:142px;
  max-width:142px;
  margin:0 18px 0 0;
}
.ss-brand-image--header{
  display:block;
  width:142px;
  height:auto;
}
.ca-public-nav{
  margin:0 auto 0 0;
  gap:22px;
}
.ca-public-nav a{
  padding:10px 0;
  font-size:16px;
  line-height:1;
  font-weight:800;
}
.ca-header-actions{gap:14px;margin-left:auto}
.ca-login-link{
  padding:10px 8px;
  font-size:16px;
  line-height:1;
  font-weight:800;
}
.ca-header-cta{
  min-height:46px;
  padding:0 18px;
  border-radius:999px;
  font-size:16px;
  line-height:46px;
  font-weight:900;
  box-shadow:0 8px 18px rgba(15,87,170,.15);
}
@media(max-width:859px){
  .ca-header-shell{min-height:62px;padding:6px 10px 6px 14px;gap:12px}
  .ca-header-brand--logo{width:126px;max-width:126px;margin-right:6px}
  .ss-brand-image--header{width:126px}
  .ca-header-cta{min-height:42px;line-height:42px;padding:0 14px}
}
@media(max-width:619px){
  .ca-header-shell{width:calc(100% - 16px);min-height:58px;padding:6px 8px 6px 10px}
  .ca-header-brand--logo{width:116px;max-width:116px;margin-right:auto}
  .ss-brand-image--header{width:116px}
  .ca-header-cta{min-height:40px;line-height:40px;padding:0 12px;font-size:16px}
}

/* =========================================================
   v0.12.5 — Restore homepage, update /play hero only
   ========================================================= */
.ss-public-catalog-hero{position:relative}
.ss-catalog-copy{min-width:0}
.ss-catalog-visual--image{display:flex;align-items:flex-end;justify-content:center;background:linear-gradient(145deg,#1d71df,#0f64d7 56%,#2a84f5);padding:0;min-height:250px}
.ss-catalog-visual--image img{display:block;width:min(100%,760px);height:auto;align-self:flex-end;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 14px 18px rgba(28,46,116,.14))}
.ss-catalog-visual--image .ss-catalog-float,.ss-catalog-visual--image .ss-catalog-boy{display:none}
.ss-catalog-visual--image>span{left:24px;bottom:18px;font-size:16px;letter-spacing:.14em;text-shadow:0 2px 8px rgba(0,0,0,.12)}
@media(max-width:1023px){
  .ss-catalog-visual--image img{width:min(100%,680px)}
}
@media(max-width:859px){
  .ss-catalog-visual--image{min-height:220px}
  .ss-catalog-visual--image img{width:min(100%,620px)}
}
@media(max-width:619px){
  .ss-catalog-visual--image{min-height:auto;padding-top:10px}
  .ss-catalog-visual--image img{width:100%}
  .ss-catalog-visual--image>span{left:16px;bottom:14px;font-size:16px}
}

/* =========================================================
   v0.12.6 — Custom game artwork (Ninja Kata)
   ========================================================= */
.tile-art.has-cover,.detail-game-art.has-cover,.ca-game-art.has-cover{background:rgba(255,255,255,.14)}
.tile-art.has-cover img,.detail-game-art.has-cover img,.ca-game-art.has-cover img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top;position:relative;z-index:2}
.tile-art.has-cover>span,.detail-game-art.has-cover>span,.ca-game-art.has-cover>span{display:none}
.tile-art.has-cover::after,.detail-game-art.has-cover::after,.ca-game-art.has-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(20,21,44,.04));z-index:3;pointer-events:none}
.detail-game-art.has-cover{background:#fff}
.detail-game-art.has-cover img{object-position:center center}
.ca-game-art.has-cover{background:#fff}


/* =========================================================
   v0.13.0 — Basic 47 Draft Pipeline
   ========================================================= */
.tile-access.is-coming{background:#fff2d1!important;color:#9b6200!important;border-color:#ffe0a0!important}
.play-game-tile.is-coming .tile-art{filter:saturate(.82)}
.play-game-tile.is-coming .tile-play{color:#d28500}
.ca-game-access.coming{background:#fff0ca;color:#9a6100}
.ca-game-card.is-coming .ca-game-art{filter:saturate(.82)}
.basic-game-admin-panel{margin-top:18px}
.basic-game-admin-panel .panel-heading{align-items:flex-start;gap:18px}
.basic-game-admin-list{display:grid;gap:6px;margin-top:14px}
.basic-admin-category{margin-top:12px;padding:8px 10px;border-radius:12px;background:#f5f2ff;color:#654fbd;font-size:16px;font-weight:900;letter-spacing:.06em}
.basic-admin-row{display:grid;grid-template-columns:105px 42px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid #eceaf2;border-radius:14px;background:#fff;transition:.18s ease}
.basic-admin-row:hover{transform:translateY(-1px);border-color:#ded7f5;box-shadow:0 8px 18px rgba(47,39,86,.06)}
.basic-admin-code{font-size:16px;font-weight:900;color:#7c6c9e}
.basic-admin-icon{width:38px;height:38px;border-radius:12px;background:#f7f4ff;display:grid;place-items:center;font-size:21px}
.basic-admin-title{display:grid;min-width:0}.basic-admin-title strong{font-size:16px;color:#25283a}.basic-admin-title small{font-size:16px;color:#9791a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.basic-admin-status{min-width:78px;padding:7px 10px;border-radius:999px;text-align:center;font-size:16px;font-weight:900;letter-spacing:.06em}
.basic-admin-status.live{background:#dff7e8;color:#19794a}.basic-admin-status.draft{background:#fff0cb;color:#976000}
@media(max-width:700px){
  .basic-admin-row{grid-template-columns:82px 38px minmax(0,1fr)}
  .basic-admin-status{grid-column:3;justify-self:start;min-width:72px}
  .basic-admin-code{font-size:16px}.basic-admin-title small{white-space:normal}
  .basic-game-admin-panel .panel-heading{display:grid}
}


/* =========================================================
   v0.13.6 — Cover tunggal 4:5 tanpa crop + panel upload
   ========================================================= */
.tile-art.has-cover,.ca-game-art.has-cover,.detail-game-art.has-cover{aspect-ratio:4/5;height:auto!important;min-height:0!important;background:#f6f7fb!important}
.tile-art.has-cover img,.ca-game-art.has-cover img,.detail-game-art.has-cover img{width:100%;height:100%;object-fit:contain!important;object-position:center center!important;background:#f6f7fb}
.tile-art.has-cover i,.ca-game-art.has-cover i,.detail-game-art.has-cover i{display:none}
.detail-game-art>b{display:none!important}

.game-cover-admin-row{display:grid!important;grid-template-columns:68px 92px minmax(170px,1fr) auto minmax(190px,auto)!important;gap:12px!important;align-items:center!important;padding:12px!important;text-decoration:none!important}
.admin-cover-preview{width:58px;aspect-ratio:4/5;border-radius:10px;overflow:hidden;background:#f2f4f8;border:1px solid #e3e7ef;display:grid;place-items:center;font-size:28px}
.admin-cover-preview img{width:100%;height:100%;object-fit:contain;background:#f6f7fb}
.admin-cover-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.admin-cover-form{margin:0}.admin-cover-upload,.admin-view-game{min-height:38px;padding:8px 12px;border-radius:10px;font-size:16px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;text-decoration:none}
.admin-cover-upload{background:#1269c7;color:#fff}.admin-cover-upload input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.admin-view-game{background:#f2f4f8;color:#18315e;border:1px solid #e0e5ee}
.admin-cover-notice{margin:0 0 14px;padding:12px 15px;border-radius:14px;font-size:16px;font-weight:800}.admin-cover-notice.success{background:#e9f9ef;color:#16733a;border:1px solid #bce8cb}.admin-cover-notice.error{background:#fff0f1;color:#a52d39;border:1px solid #f0c3c8}
@media(max-width:860px){.game-cover-admin-row{grid-template-columns:58px 1fr auto!important}.basic-admin-code{display:none}.game-cover-admin-row .basic-admin-title{min-width:0}.admin-cover-actions{grid-column:2/-1;justify-content:flex-start}.admin-cover-preview{grid-row:1/3}.admin-cover-upload,.admin-view-game{font-size:16px}}


/* =========================================================
   v0.14.0 — /play mobile focus + resilient catalog skin
   - compact first screen on phone
   - game covers become the main visual
   - no Basic/Pro labels in the public catalog
   - uploaded cover replaces repeated title/icon copy
   ========================================================= */
.ss-public-game-grid .play-game-tile.has-game-cover{min-height:0;background:#fff!important;border:1px solid rgba(16,43,96,.09)!important;box-shadow:0 12px 28px rgba(26,47,87,.09)!important}
.ss-public-game-grid .play-game-tile.has-game-cover:before{display:none}
.ss-public-game-grid .play-game-tile.has-game-cover .tile-art{width:100%;aspect-ratio:4/5;border-radius:20px;margin:0;background:#f6f7fb!important}
.ss-public-game-grid .play-game-tile.has-game-cover .tile-art img{width:100%;height:100%;object-fit:contain!important;object-position:center!important;background:#f6f7fb}
.ss-public-game-grid .play-game-tile.has-game-cover .tile-play{left:auto;right:10px;bottom:10px;transform:none;width:42px;height:42px;border-width:3px;background:rgba(255,255,255,.96)}
.ss-public-game-grid .play-game-tile.has-game-cover .tile-access{top:9px;right:9px;background:rgba(255,255,255,.94);color:#135bb4;border:1px solid rgba(20,79,151,.12);box-shadow:0 5px 14px rgba(25,49,92,.12);font-size:14px;letter-spacing:.04em;padding:6px 8px}
.ss-public-game-grid .play-game-tile.no-game-cover{background:linear-gradient(160deg,#70d7ff,#3f9cff)}

@media(max-width:619px){
  html,body{max-width:100%;overflow-x:hidden}
  .is-public-library{width:100%;min-height:calc(100dvh - 66px);padding:8px 10px 76px}
  .ss-public-catalog-hero{margin:0 0 10px;padding:14px 15px;border-radius:20px;display:block;min-height:0;background:linear-gradient(118deg,#ff9f00,#ffb20d)!important;box-shadow:0 10px 24px rgba(104,61,13,.09)}
  .ss-public-catalog-hero .ss-section-label{font-size:13px;letter-spacing:.11em}
  .ss-public-catalog-hero h1{margin:4px 0 5px;font-size:28px;line-height:1.02;letter-spacing:-.04em}
  .ss-public-catalog-hero h1 span{display:inline;color:#fff!important}
  .ss-public-catalog-hero p{display:none}
  .ss-catalog-summary{margin-top:9px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
  .ss-catalog-summary span{min-width:0;padding:6px 8px;border-radius:11px;display:flex;align-items:center;justify-content:center;gap:4px;background:rgba(255,255,255,.86)}
  .ss-catalog-summary b{font-size:16px}.ss-catalog-summary small{font-size:13px}
  .ss-catalog-visual{display:none!important}

  .play-search-bar.ss-public-filter{position:sticky;top:66px;z-index:45;margin:0 0 8px;padding:7px;border-radius:14px;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);box-shadow:0 8px 20px rgba(30,45,78,.08);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px}
  .ss-public-filter .play-search-input{grid-column:1/-1;min-height:42px;border-radius:11px}
  .ss-public-filter .play-search-input input{font-size:16px;min-width:0}
  .ss-public-filter select[name="category"]{min-width:0;min-height:40px;border-radius:11px;font-size:14px}
  .ss-public-filter button{min-height:40px;padding:8px 14px;border-radius:11px;font-size:14px}

  .play-category-tabs.ss-public-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:6px;margin:0 -10px 10px;padding:1px 10px 5px;overscroll-behavior-x:contain}
  .play-category-tabs.ss-public-tabs::-webkit-scrollbar{display:none}
  .play-category-tabs.ss-public-tabs a{flex:0 0 auto;min-height:38px;padding:8px 11px;border-radius:999px;font-size:14px;white-space:nowrap}

  .library-result-head.ss-public-result-head{margin:8px 1px 10px;align-items:end}
  .ss-public-result-head small{display:none}
  .ss-public-result-head h2{margin:0;font-size:20px;line-height:1.1}
  .ss-public-result-head>span{font-size:14px}

  .play-tile-grid.library-grid.ss-public-game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .ss-public-game-grid .play-game-tile{border-radius:18px;min-width:0;overflow:hidden}
  .ss-public-game-grid .play-game-tile.has-game-cover{border-radius:18px}
  .ss-public-game-grid .play-game-tile.has-game-cover .tile-art{border-radius:17px;aspect-ratio:4/5}
  .ss-public-game-grid .play-game-tile.has-game-cover .tile-access{font-size:12px;padding:5px 7px;top:7px;right:7px}
  .ss-public-game-grid .play-game-tile.has-game-cover .tile-play{width:36px;height:36px;right:7px;bottom:7px;font-size:14px}
  .ss-public-game-grid .play-game-tile.no-game-cover{min-height:238px}
  .ss-public-game-grid .play-game-tile.no-game-cover .tile-art{min-height:112px}
  .ss-public-game-grid .play-game-tile.no-game-cover .tile-copy{padding:9px 8px 22px}
  .ss-public-game-grid .play-game-tile.no-game-cover .tile-copy small{font-size:12px}
  .ss-public-game-grid .play-game-tile.no-game-cover .tile-copy h3{font-size:17px;line-height:1.08}
  .ss-public-game-grid .play-game-tile.no-game-cover .tile-copy p{display:none}
  .ss-public-game-grid .tile-lock-note{font-size:12px;padding:4px 6px}

  .ss-catalog-cta{margin-top:22px;padding:18px;border-radius:18px}
  .ss-catalog-cta span{font-size:13px}.ss-catalog-cta h2{font-size:21px}.ss-catalog-cta p{display:none}
  .ss-catalog-cta a{width:100%;justify-content:center;text-align:center}
}

@media(max-width:380px){
  .is-public-library{padding-left:8px;padding-right:8px}
  .ss-public-catalog-hero{padding:12px}
  .ss-public-catalog-hero h1{font-size:25px}
  .play-tile-grid.library-grid.ss-public-game-grid{gap:8px}
}


/* =========================================================
   v0.14.1 — Admin publish / draft controls
   ========================================================= */
.basic-admin-state{display:grid;justify-items:center;gap:5px;min-width:92px}.admin-game-ready,.admin-game-waiting{font-size:16px;font-weight:800;white-space:nowrap}.admin-game-ready{color:#178553}.admin-game-waiting{color:#8d7b58}.admin-game-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.admin-status-form{margin:0}.admin-status-btn{min-height:42px;border:0;border-radius:12px;padding:9px 13px;font-size:16px;font-weight:900;cursor:pointer;white-space:nowrap}.admin-status-btn.publish-btn{background:linear-gradient(135deg,#22b96d,#159653);color:#fff;box-shadow:0 8px 18px rgba(21,150,83,.18)}.admin-status-btn.draft-btn{background:#fff2cf;color:#855b00;border:1px solid #f0d28c}.admin-status-btn:disabled{cursor:not-allowed;opacity:.48;box-shadow:none}.admin-cover-notice{width:min(1180px,calc(100% - 28px));margin:14px auto 0;padding:12px 15px;border-radius:14px;font-size:16px;font-weight:800}.admin-cover-notice.success{background:#e7f8ef;color:#147a48;border:1px solid #bce8d0}.admin-cover-notice.error{background:#fff0f0;color:#ad3f4b;border:1px solid #f3c5c9}@media(max-width:820px){.admin-game-actions{justify-content:flex-start}.basic-admin-state{justify-items:start}.admin-status-btn,.admin-cover-upload,.admin-view-game{width:100%;justify-content:center;text-align:center}.admin-status-form,.admin-cover-form{flex:1 1 145px}.admin-view-game{flex:1 1 100px}}


/* v0.14.8 — Hero Main Tapi Belajar + trio visual */
.ca-hero--image .ca-hero-inner{min-height:560px;grid-template-columns:minmax(0,.98fr) minmax(0,1.02fr);gap:34px;align-items:center}
.ca-hero--image .ca-hero-copy{padding-left:2px;padding-right:8px}
.ca-brand-lockup--image.ca-brand-lockup--main{display:block;max-width:min(100%,355px);margin-bottom:18px}
.ca-brand-lockup--image.ca-brand-lockup--main img{display:block;width:100%;height:auto;filter:drop-shadow(0 12px 18px rgba(88,45,0,.10))}
.ca-hero--image .ca-hero-copy h1{max-width:560px;margin:2px 0 10px}
.ca-hero--image .ca-hero-copy>p{max-width:560px}
.ca-hero-image-card.ca-hero-image-card--trio{align-self:center;justify-content:center;padding:0 0 0 8px;filter:drop-shadow(0 18px 22px rgba(104,60,0,.08))}
.ca-hero-image-card.ca-hero-image-card--trio:before{left:14%;right:14%;bottom:5%;height:13%;background:rgba(122,72,0,.10);filter:blur(18px)}
.ca-hero-image-card.ca-hero-image-card--trio img{display:block;width:min(100%,575px);max-height:620px;object-fit:contain;object-position:center bottom;margin-inline:auto}
@media (max-width:1199px){
  .ca-hero--image .ca-hero-inner{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:20px}
  .ca-brand-lockup--image.ca-brand-lockup--main{max-width:min(100%,320px)}
  .ca-hero-image-card.ca-hero-image-card--trio img{width:min(100%,520px)}
}
@media (max-width:991px){
  .ca-hero--image .ca-hero-inner{grid-template-columns:1fr;gap:18px;padding:28px 0 74px;text-align:center}
  .ca-hero--image .ca-hero-copy{padding:0 10px}
  .ca-brand-lockup--image.ca-brand-lockup--main{margin-inline:auto;max-width:300px}
  .ca-hero--image .ca-hero-copy h1,.ca-hero--image .ca-hero-copy>p{margin-left:auto;margin-right:auto}
  .ca-hero-image-card.ca-hero-image-card--trio{padding-left:0;justify-content:center}
  .ca-hero-image-card.ca-hero-image-card--trio img{width:min(100%,500px);max-height:none}
}
@media (max-width:767px){
  .ca-brand-lockup--image.ca-brand-lockup--main{max-width:250px;margin-bottom:14px}
  .ca-hero-image-card.ca-hero-image-card--trio{margin-left:-4px;margin-right:-4px}
  .ca-hero-image-card.ca-hero-image-card--trio img{width:min(100%,410px)}
}

/* =========================================================
   SmartStudy v0.15.0 — Premium Fixed Auth / Main Tapi Belajar
   ========================================================= */
.layout-auth{overflow:hidden;background:#fff8e8!important}
.ss-auth-v2-header{height:66px!important;background:transparent!important;border:0!important;padding:0!important}
.ss-auth-v2-header .auth-header-inner{
  width:min(1040px,calc(100% - 24px))!important;
  height:54px!important;
  margin:8px auto 0!important;
  padding:6px 10px 6px 14px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 10px 28px rgba(33,45,82,.09)!important;
  border:1px solid rgba(16,43,96,.06)!important;
}
.ss-auth-v2-header-brand{height:42px!important;display:flex!important;align-items:center!important;overflow:visible!important}
.ss-auth-v2-header .ss-brand-image--auth{
  width:auto!important;height:42px!important;max-width:115px!important;object-fit:contain!important;
  filter:drop-shadow(0 4px 7px rgba(22,53,135,.10));
}
.ss-auth-v2-header .btn{
  display:inline-flex!important;min-height:38px!important;padding:7px 12px!important;border-radius:12px!important;
  background:#f7f9ff!important;border:1px solid #e7ebf5!important;color:#17376d!important;font-size:16px!important;
  font-weight:800!important;box-shadow:none!important;
}
.ss-auth-v2-main{
  min-height:100dvh!important;height:100dvh!important;
  padding:66px 12px 10px!important;
  display:grid!important;place-items:center!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 10% 10%,rgba(255,193,58,.16),transparent 28%),
    radial-gradient(circle at 88% 85%,rgba(112,72,239,.10),transparent 30%),
    linear-gradient(180deg,#fff9ec,#f8f7ff)!important;
}
.ss-auth-v2-shell{
  width:min(1040px,100%);
  height:min(720px,calc(100dvh - 84px));
  min-height:560px;
  display:grid;
  grid-template-columns:minmax(0,1.03fr) minmax(340px,.97fr);
  gap:14px;
  align-items:stretch;
}
.ss-auth-v2-showcase,
.ss-auth-v2-card{
  min-height:0;
  border-radius:26px;
  overflow:hidden;
}
.ss-auth-v2-showcase{
  position:relative;
  padding:24px 30px 22px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  background:
    radial-gradient(circle at 90% 10%,rgba(255,255,255,.30),transparent 28%),
    linear-gradient(145deg,#ff9d00,#ffb817 62%,#ffc72f);
  color:#123d82;
  box-shadow:0 22px 55px rgba(133,78,0,.13);
}
.ss-auth-v2-showcase:before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.34;
  background-image:linear-gradient(rgba(255,255,255,.20) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.20) 1px,transparent 1px);
  background-size:62px 62px;
  mask-image:linear-gradient(to right,transparent 0,#000 35%,#000 100%);
}
.ss-auth-v2-showcase:after{
  content:"";position:absolute;left:-8%;right:-8%;bottom:-78px;height:126px;border-radius:50%;
  background:#fff6dd;opacity:.96;
}
.ss-auth-v2-showcase>*{position:relative;z-index:2}
.ss-auth-v2-kicker{
  display:inline-flex;align-items:center;min-height:32px;padding:6px 10px;border-radius:999px;
  background:rgba(255,255,255,.72);color:#6548dc;font-size:16px;font-weight:900;letter-spacing:.055em;
}
.ss-auth-v2-logo{
  width:auto;height:min(260px,34vh);max-width:230px;object-fit:contain;
  margin:8px 0 4px;align-self:center;
  filter:drop-shadow(0 15px 18px rgba(81,42,0,.12));
}
.ss-auth-v2-copy{max-width:500px;margin-top:2px}
.ss-auth-v2-copy h1{
  margin:0;color:#123d82;font-family:"Fredoka","Nunito",sans-serif;
  font-size:clamp(34px,4.2vw,50px);line-height:1.02;letter-spacing:-.045em;
}
.ss-auth-v2-copy p{
  max-width:470px;margin:10px 0 0;color:#17376d;font-size:17px;line-height:1.55;font-weight:750;
}
.ss-auth-v2-mini{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
.ss-auth-v2-mini span{
  min-width:94px;display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:16px;
  background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.60);box-shadow:0 8px 18px rgba(91,56,0,.06);
}
.ss-auth-v2-mini b{font-size:21px}.ss-auth-v2-mini small{font-size:16px;color:#17376d;font-weight:900}

.ss-auth-v2-card{
  position:relative;
  display:grid;place-items:center;
  padding:26px;
  background:rgba(255,255,255,.97);
  border:1px solid rgba(16,43,96,.07);
  box-shadow:0 24px 62px rgba(49,42,89,.10);
}
.ss-auth-v2-card:before{
  content:"";position:absolute;left:0;right:0;top:0;height:6px;
  background:linear-gradient(90deg,#ffad1f,#ff7626,#8059ef,#38c5ff);
}
.ss-auth-v2-card-inner{width:min(100%,390px)}
.ss-auth-v2-label{
  display:inline-flex;align-items:center;gap:8px;color:#7557df;font-size:16px;font-weight:900;letter-spacing:.08em;
}
.ss-auth-v2-label:before{content:"";width:20px;height:3px;border-radius:999px;background:#ff7729}
.ss-auth-v2-card h2{
  margin:10px 0 5px;color:#15386f;font-family:"Fredoka","Nunito",sans-serif;
  font-size:clamp(30px,4vw,39px);line-height:1.05;letter-spacing:-.035em;
}
.ss-auth-v2-lead{margin:0;color:#66758b;font-size:16px;font-weight:700}
.ss-auth-v2-form{display:grid;gap:13px;margin-top:22px}
.ss-auth-v2-form label{display:grid;gap:6px}
.ss-auth-v2-form label>span{font-size:16px;color:#263957;font-weight:850}
.ss-auth-v2-form label em{font-style:normal;color:#8c96a8;font-weight:650}
.ss-auth-v2-form input{
  width:100%;min-height:50px;padding:11px 13px;border-radius:14px;
  border:1px solid #e0e5ef;background:#f8faff;color:#172b4d;font-size:16px;outline:0;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.ss-auth-v2-form input:focus{background:#fff;border-color:#8f79ea;box-shadow:0 0 0 4px rgba(111,80,233,.09)}
.ss-auth-v2-form button{
  min-height:52px;margin-top:2px;border:0;border-radius:15px;
  display:flex;align-items:center;justify-content:center;gap:8px;
  background:linear-gradient(135deg,#1777df,#0b59ad);color:#fff;font-size:17px;font-weight:900;cursor:pointer;
  box-shadow:0 14px 26px rgba(15,87,170,.18);
}
.ss-auth-v2-form button b{font-size:20px}
.ss-auth-v2-divider{display:flex;align-items:center;gap:10px;margin:18px 0 12px;color:#9aa3b2;font-size:16px}
.ss-auth-v2-divider:before,.ss-auth-v2-divider:after{content:"";height:1px;background:#edf0f5;flex:1}
.ss-auth-v2-create{
  min-height:46px;display:flex;align-items:center;justify-content:center;border-radius:14px;
  background:#fff7e8;border:1px solid #ffe2ae;color:#b95b09;text-decoration:none;font-size:16px;font-weight:900;
}
.ss-auth-v2-switch{margin:17px 0 0;text-align:center;color:#7b8596;font-size:16px}
.ss-auth-v2-switch a{color:#e7661f;font-weight:900;text-decoration:none}
.ss-auth-v2-back{margin:14px 0 0;text-align:center}
.ss-auth-v2-back a{color:#6c7890;text-decoration:none;font-size:16px;font-weight:800}

/* Register sedikit lebih padat supaya kekal dalam viewport. */
.ss-auth-v2-register .ss-auth-v2-form{gap:9px;margin-top:15px}
.ss-auth-v2-register .ss-auth-v2-form input{min-height:45px;padding:9px 12px}
.ss-auth-v2-register .ss-auth-v2-card h2{font-size:34px}
.ss-auth-v2-register .ss-auth-v2-card{padding-top:20px;padding-bottom:20px}

@media(max-width:820px){
  .layout-auth{overflow:hidden}
  .ss-auth-v2-header{height:58px!important}
  .ss-auth-v2-header .auth-header-inner{height:48px!important;margin-top:5px!important;width:calc(100% - 10px)!important;padding:4px 7px 4px 9px!important;border-radius:15px!important}
  .ss-auth-v2-header .ss-brand-image--auth{height:37px!important;max-width:90px!important}
  .ss-auth-v2-header .btn{min-height:36px!important;padding:5px 9px!important}
  .ss-auth-v2-main{height:100dvh!important;min-height:100dvh!important;padding:58px 5px 5px!important}
  .ss-auth-v2-shell{
    height:calc(100dvh - 63px);min-height:0;width:100%;grid-template-columns:1fr;grid-template-rows:132px minmax(0,1fr);gap:6px;
  }
  .ss-auth-v2-showcase{border-radius:18px;padding:10px 14px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;justify-content:stretch}
  .ss-auth-v2-showcase:after,.ss-auth-v2-showcase:before{display:none}
  .ss-auth-v2-kicker{display:none}
  .ss-auth-v2-logo{height:108px;width:auto;max-width:92px;margin:0;align-self:center}
  .ss-auth-v2-copy{margin:0;min-width:0}
  .ss-auth-v2-copy h1{font-size:25px;line-height:1.02}
  .ss-auth-v2-copy p{font-size:16px;line-height:1.35;margin-top:5px}
  .ss-auth-v2-mini{display:none}
  .ss-auth-v2-card{border-radius:18px;padding:15px 16px;overflow:auto;align-items:start}
  .ss-auth-v2-card-inner{width:min(100%,430px);margin:auto}
  .ss-auth-v2-card h2{font-size:29px;margin-top:7px}
  .ss-auth-v2-form{gap:9px;margin-top:14px}
  .ss-auth-v2-form input{min-height:46px;padding:9px 11px}
  .ss-auth-v2-form button{min-height:48px}
  .ss-auth-v2-divider{margin:12px 0 9px}
  .ss-auth-v2-create{min-height:42px}
  .ss-auth-v2-back{margin-top:9px}
  .ss-auth-v2-register .ss-auth-v2-shell{grid-template-rows:104px minmax(0,1fr)}
  .ss-auth-v2-register .ss-auth-v2-showcase{grid-template-columns:auto 1fr}
  .ss-auth-v2-register .ss-auth-v2-logo{height:82px}
  .ss-auth-v2-register .ss-auth-v2-copy h1{font-size:22px}
  .ss-auth-v2-register .ss-auth-v2-copy p{display:none}
  .ss-auth-v2-register .ss-auth-v2-card{padding:10px 14px}
  .ss-auth-v2-register .ss-auth-v2-form{gap:6px;margin-top:9px}
  .ss-auth-v2-register .ss-auth-v2-form input{min-height:42px;padding:7px 10px}
  .ss-auth-v2-register .ss-auth-v2-form button{min-height:45px}
  .ss-auth-v2-register .ss-auth-v2-switch{margin-top:9px}
  .ss-auth-v2-register .ss-auth-v2-back{display:none}
}

@media(max-width:480px){
  .ss-auth-v2-showcase{grid-template-columns:82px 1fr;padding:8px 11px}
  .ss-auth-v2-logo{height:100px;max-width:80px}
  .ss-auth-v2-copy h1{font-size:22px}
  .ss-auth-v2-copy p{font-size:16px}
  .ss-auth-v2-card{padding:13px}
  .ss-auth-v2-label{font-size:16px}
  .ss-auth-v2-card h2{font-size:27px}
}

@media(max-height:680px) and (min-width:821px){
  .ss-auth-v2-shell{height:calc(100dvh - 78px);min-height:0}
  .ss-auth-v2-logo{height:min(210px,31vh)}
  .ss-auth-v2-copy h1{font-size:36px}
  .ss-auth-v2-copy p{font-size:16px}
  .ss-auth-v2-mini{margin-top:10px}
  .ss-auth-v2-card{padding:18px 24px}
  .ss-auth-v2-form{margin-top:14px;gap:9px}
  .ss-auth-v2-divider{margin:11px 0 8px}
}

/* =========================================================
   v0.15.5 — Thumbnail cover 1:1 seperti Bola Kira
   Semua thumbnail cover dipaparkan dalam nisbah 1:1
   tanpa crop. Imej dikecilkan supaya keseluruhan cover
   kekal kelihatan dalam kotak segi empat sama.
   ========================================================= */
.tile-art.has-cover,
.ca-game-art.has-cover{
  aspect-ratio:1/1 !important;
  height:auto !important;
  min-height:0 !important;
  background:#f6f7fb !important;
}

.tile-art.has-cover img,
.ca-game-art.has-cover img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#f6f7fb !important;
}

.tile-art.has-cover i,
.ca-game-art.has-cover i{
  display:none !important;
}

.admin-cover-preview{
  aspect-ratio:1/1 !important;
  border-radius:12px;
}

.admin-cover-preview img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  background:#f6f7fb;
}

.ss-public-game-grid .play-game-tile.has-game-cover{
  min-height:0 !important;
  background:#fff !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-art{
  width:100%;
  aspect-ratio:1/1 !important;
  min-height:0 !important;
  border-radius:20px;
  margin:0;
  background:#f6f7fb !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-art img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#f6f7fb !important;
}

@media (max-width: 699px){
  .ss-public-game-grid .play-game-tile.has-game-cover .tile-art{
    aspect-ratio:1/1 !important;
    border-radius:17px;
  }
}


/* =========================================================
   v0.15.6 — Thumbnail 1:1 penuh dalam kad
   Gaya katalog seperti Bola Kira:
   - keseluruhan kad = thumbnail square
   - gambar cover memenuhi square
   - tiada ruang teks di bawah untuk game yang ada cover
   - butang Play terapung di tengah bawah
   ========================================================= */

.ss-public-game-grid .play-game-tile.has-game-cover{
  position:relative !important;
  aspect-ratio:1/1 !important;
  min-height:0 !important;
  height:auto !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#fff !important;
  border-radius:22px !important;
  border:1px solid rgba(16,43,96,.10) !important;
  box-shadow:0 12px 28px rgba(26,47,87,.10) !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover:before{
  display:none !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-art{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  margin:0 !important;
  aspect-ratio:1/1 !important;
  border-radius:inherit !important;
  background:#f6f7fb !important;
  overflow:hidden !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-art img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:#f6f7fb !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-copy,
.ss-public-game-grid .play-game-tile.has-game-cover .tile-lock-note{
  display:none !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-access{
  position:absolute !important;
  top:10px !important;
  right:10px !important;
  z-index:8 !important;
  background:rgba(255,255,255,.95) !important;
  color:#10295f !important;
  border:1px solid rgba(16,43,96,.10) !important;
  box-shadow:0 5px 14px rgba(25,49,92,.14) !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-play{
  position:absolute !important;
  left:50% !important;
  right:auto !important;
  bottom:-1px !important;
  transform:translate(-50%,38%) !important;
  z-index:9 !important;
  width:48px !important;
  height:48px !important;
  border-radius:50% !important;
  border:4px solid rgba(255,255,255,.96) !important;
  background:#fff !important;
  color:#6049d8 !important;
  box-shadow:0 6px 0 rgba(45,35,114,.14),0 12px 22px rgba(36,30,91,.18) !important;
}

/* Homepage game thumbnails: square juga, visual penuh */
.ca-game-card .ca-game-art.has-cover{
  aspect-ratio:1/1 !important;
  height:auto !important;
  overflow:hidden !important;
  background:#f6f7fb !important;
}

.ca-game-card .ca-game-art.has-cover img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
}

/* Panel admin: preview square supaya sama seperti katalog */
.admin-cover-preview{
  aspect-ratio:1/1 !important;
}

.admin-cover-preview img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
}

@media(max-width:619px){
  .ss-public-game-grid .play-game-tile.has-game-cover{
    border-radius:18px !important;
  }

  .ss-public-game-grid .play-game-tile.has-game-cover .tile-art{
    aspect-ratio:1/1 !important;
    border-radius:inherit !important;
  }

  .ss-public-game-grid .play-game-tile.has-game-cover .tile-play{
    width:40px !important;
    height:40px !important;
    bottom:-1px !important;
    border-width:3px !important;
  }

  .ss-public-game-grid .play-game-tile.has-game-cover .tile-access{
    top:7px !important;
    right:7px !important;
    font-size:12px !important;
    padding:5px 7px !important;
  }
}


/* =========================================================
   v0.15.7 — Thumbnail full bleed 1:1
   Tujuan:
   - Kad katalog kekal 1:1
   - Cover memenuhi seluruh kad
   - Guna mod fill untuk paparan awam
   - Tiada ruang putih/top-bottom pada thumbnail awam
   ========================================================= */

/* Paparan awam: seluruh kad ialah thumbnail square */
.ss-public-game-grid .play-game-tile.has-game-cover{
  position:relative !important;
  aspect-ratio:1 / 1 !important;
  min-height:0 !important;
  height:auto !important;
  padding:0 !important;
  overflow:hidden !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-art,
.ss-public-game-grid .play-game-tile.has-game-cover .tile-art.has-cover{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border-radius:inherit !important;
  overflow:hidden !important;
  background:transparent !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-art img,
.ss-public-game-grid .play-game-tile.has-game-cover .tile-art.has-cover img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  min-width:100% !important;
  min-height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  transform:translateZ(0) scale(1.001) !important;
}

/* Jika ada lapisan copy lama, sembunyikan untuk cover penuh */
.ss-public-game-grid .play-game-tile.has-game-cover .tile-copy,
.ss-public-game-grid .play-game-tile.has-game-cover .tile-lock-note{
  display:none !important;
}

/* Butang play kekal di tengah bawah */
.ss-public-game-grid .play-game-tile.has-game-cover .tile-play{
  left:50% !important;
  right:auto !important;
  bottom:-1px !important;
  transform:translate(-50%,38%) !important;
}

/* Badge LIVE / DRAFT kemas di kanan atas */
.ss-public-game-grid .play-game-tile.has-game-cover .tile-access{
  top:10px !important;
  right:10px !important;
}

/* Kad lain yang guna art cover — square preview penuh */
.ca-game-card .ca-game-art.has-cover,
.tile-art.has-cover,
.detail-game-art.has-cover{
  overflow:hidden !important;
}

.ca-game-card .ca-game-art.has-cover img,
.tile-art.has-cover img,
.detail-game-art.has-cover img{
  object-fit:cover !important;
  object-position:center center !important;
  width:100% !important;
  height:100% !important;
}


/* =========================================================
   v0.15.8 — Hotfix badge LIVE atas cover penuh
   Tujuan:
   - Buang ruang kosong atas thumbnail awam
   - Pastikan badge LIVE duduk terus atas cover
   - Paksa imej memenuhi square card sepenuhnya
   ========================================================= */

.ss-public-game-grid .play-game-tile.has-game-cover{
  display:block !important;
  position:relative !important;
  aspect-ratio:1 / 1 !important;
  padding:0 !important;
  margin:0 !important;
  background:#ffffff !important;
  overflow:hidden !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(16,43,96,.08);
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-art,
.ss-public-game-grid .play-game-tile.has-game-cover .tile-art.has-cover{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:100% !important;
  max-height:none !important;
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  border-radius:inherit !important;
  background:#ffffff !important;
  overflow:hidden !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-art img,
.ss-public-game-grid .play-game-tile.has-game-cover .tile-art.has-cover img{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:#ffffff !important;
}

/* kedudukan badge dan butang sentiasa atas imej */
.ss-public-game-grid .play-game-tile.has-game-cover .tile-access{
  position:absolute !important;
  z-index:9 !important;
  top:14px !important;
  right:14px !important;
}

.ss-public-game-grid .play-game-tile.has-game-cover .tile-play{
  position:absolute !important;
  z-index:9 !important;
  left:50% !important;
  right:auto !important;
  bottom:10px !important;
  transform:translateX(-50%) !important;
}

/* hilang apa-apa jarak/isi tambahan yang menolak imej */
.ss-public-game-grid .play-game-tile.has-game-cover > .tile-copy,
.ss-public-game-grid .play-game-tile.has-game-cover > .tile-lock-note{
  display:none !important;
}


/* =========================================================
   v0.15.9 — Logo app lebih kecil & seimbang dengan sidebar
   ========================================================= */
.layout-app .app-brand--logo{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  min-width:0 !important;
  flex:0 0 auto !important;
}

.layout-app .ss-brand-image--app{
  width:118px !important;
  min-width:0 !important;
  max-width:118px !important;
  max-height:60px !important;
  height:auto !important;
  object-fit:contain !important;
  flex:0 0 auto !important;
}

.layout-app .app-brand--logo .plan-pill{
  margin:0 !important;
  padding:7px 11px !important;
  min-height:38px !important;
  white-space:nowrap !important;
  font-size:16px !important;
}

/* Sidebar desktop penuh = 238px.
   Logo + pill kini hampir seimbang dengan lebar blok sidebar. */
@media (min-width:1180px){
  .layout-app .app-topbar{
    padding-left:20px !important;
  }

  .layout-app .app-brand--logo{
    width:218px !important;
    max-width:218px !important;
    justify-content:flex-start !important;
  }

  .layout-app .ss-brand-image--app{
    width:108px !important;
    max-width:108px !important;
    max-height:58px !important;
  }

  .layout-app .app-brand--logo .plan-pill{
    padding:6px 10px !important;
  }
}

/* Sidebar ikon 90px: logo dipadatkan supaya topbar tidak terasa berat */
@media (min-width:860px) and (max-width:1179px){
  .layout-app .ss-brand-image--app{
    width:104px !important;
    max-width:104px !important;
    max-height:56px !important;
  }

  .layout-app .app-brand--logo .plan-pill{
    padding:6px 9px !important;
  }
}

@media (max-width:619px){
  .layout-app .ss-brand-image--app{
    width:94px !important;
    max-width:94px !important;
    max-height:52px !important;
  }
}

/* =========================================================
   v0.16.1 — FIX KAD THUMBNAIL 1:1
   Cover tidak diubah. Yang dibetulkan ialah kad thumbnail.
   Terpakai pada katalog awam dan katalog selepas login.
   ========================================================= */
.play-tile-grid.library-grid .play-game-tile.has-game-cover{
  position:relative !important;
  display:block !important;
  width:100% !important;
  aspect-ratio:1/1 !important;
  min-height:0 !important;
  height:auto !important;
  padding:0 !important;
  margin:0 !important;
  overflow:hidden !important;
  background:#fff !important;
  border:1px solid rgba(16,43,96,.10) !important;
  border-radius:22px !important;
  box-shadow:0 12px 28px rgba(26,47,87,.10) !important;
  isolation:isolate !important;
}
.play-tile-grid.library-grid .play-game-tile.has-game-cover::before{display:none !important;}
.play-tile-grid.library-grid .play-game-tile.has-game-cover .tile-art,
.play-tile-grid.library-grid .play-game-tile.has-game-cover .tile-art.has-cover{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  max-height:none !important;
  aspect-ratio:auto !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  border-radius:inherit !important;
  background:#fff !important;
}
.play-tile-grid.library-grid .play-game-tile.has-game-cover .tile-art img,
.play-tile-grid.library-grid .play-game-tile.has-game-cover .tile-art.has-cover img{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:#fff !important;
}
.play-tile-grid.library-grid .play-game-tile.has-game-cover .tile-art i{display:none !important;}
.play-tile-grid.library-grid .play-game-tile.has-game-cover .tile-copy,
.play-tile-grid.library-grid .play-game-tile.has-game-cover .tile-lock-note{display:none !important;}
.play-tile-grid.library-grid .play-game-tile.has-game-cover .tile-access{
  position:absolute !important;
  z-index:20 !important;
  top:10px !important;
  right:10px !important;
  left:auto !important;
  bottom:auto !important;
  margin:0 !important;
  padding:6px 9px !important;
  min-height:0 !important;
  border:1px solid rgba(16,43,96,.10) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.94) !important;
  color:#10295f !important;
  box-shadow:0 5px 14px rgba(25,49,92,.14) !important;
  backdrop-filter:blur(8px);
}
.play-tile-grid.library-grid .play-game-tile.has-game-cover .tile-play{
  position:absolute !important;
  z-index:20 !important;
  left:50% !important;
  right:auto !important;
  top:auto !important;
  bottom:8px !important;
  width:44px !important;
  height:44px !important;
  margin:0 !important;
  transform:translateX(-50%) !important;
  display:grid !important;
  place-items:center !important;
  border:3px solid rgba(255,255,255,.96) !important;
  border-radius:50% !important;
  background:#fff !important;
  color:#6049d8 !important;
  box-shadow:0 8px 18px rgba(25,49,92,.18) !important;
}
.play-tile-grid.library-grid .play-game-tile.has-game-cover:hover{transform:translateY(-4px) !important;}
@media(max-width:619px){
  .play-tile-grid.library-grid .play-game-tile.has-game-cover{border-radius:18px !important;}
  .play-tile-grid.library-grid .play-game-tile.has-game-cover .tile-access{top:7px !important;right:7px !important;padding:5px 7px !important;font-size:12px !important;}
  .play-tile-grid.library-grid .play-game-tile.has-game-cover .tile-play{width:38px !important;height:38px !important;bottom:6px !important;font-size:14px !important;}
}