*{box-sizing:border-box}
:root{
  --primary:#000000;
  --accent:#000000;
  --background:#f5f5f7;
  --surface:rgba(255,255,255,.78);
  --surface-solid:#ffffff;
  --text:#111111;
  --muted:#6e6e73;
  --line:rgba(0,0,0,.12);
  --line-strong:rgba(0,0,0,.28);
  --shadow:0 18px 50px rgba(0,0,0,.09);
  --shadow-soft:0 8px 24px rgba(0,0,0,.06);
  --radius-xl:32px;
  --radius-lg:24px;
  --radius-md:18px;
  --radius-sm:13px;
  --safe-bottom:env(safe-area-inset-bottom,0px);
}
html{background:var(--background);scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue",Arial,sans-serif;
  background:
    radial-gradient(circle at 10% 0%,rgba(255,255,255,.98),transparent 30%),
    linear-gradient(180deg,#fbfbfd 0%,var(--background) 36%,#eeeeef 100%);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
}
button,input,select,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{color:inherit}
a{color:inherit}
.shell{min-height:100vh;padding-bottom:calc(104px + var(--safe-bottom))}
.topbar{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  min-height:72px;padding:12px 18px;
  border-bottom:1px solid rgba(0,0,0,.08);
  background:rgba(250,250,252,.78);
  backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:15px;font-weight:750;letter-spacing:-.2px}
.brand-logo{
  display:grid;place-items:center;width:40px;height:40px;
  border:1px solid rgba(0,0,0,.16);border-radius:12px;
  background:#fff;box-shadow:0 3px 12px rgba(0,0,0,.06);
  overflow:hidden;font-size:12px;font-weight:850;
}
.brand-logo img{width:100%;height:100%;object-fit:contain}
.top-actions{display:flex;align-items:center;gap:8px}
.glass-button,.round-button,.profile-button{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  min-height:42px;border:1px solid rgba(0,0,0,.11);
  background:rgba(255,255,255,.76);box-shadow:0 4px 14px rgba(0,0,0,.05);
  backdrop-filter:blur(14px);text-decoration:none;font-size:13px;font-weight:750;cursor:pointer;
}
.glass-button{padding:0 14px;border-radius:999px}
.glass-button.compact{min-width:66px}
.round-button,.profile-button{width:42px;border-radius:50%}
.profile-button{background:#000;color:#fff;border-color:#000;font-weight:850}
.button-symbol{font-size:16px}
.main{width:min(100%,1220px);margin:0 auto;padding:24px 15px 54px}
.hero-card{
  position:relative;display:grid;gap:28px;overflow:hidden;
  padding:30px 24px;border:1px solid rgba(0,0,0,.08);border-radius:var(--radius-xl);
  background:rgba(255,255,255,.82);box-shadow:var(--shadow);
  backdrop-filter:blur(18px);
}
.hero-copy{position:relative;z-index:2}
.overline{display:block;margin:0 0 8px;font-size:11px;font-weight:850;letter-spacing:1.55px;color:#555}
.hero-card h1{margin:0;font-size:clamp(42px,11vw,76px);line-height:.96;letter-spacing:-2.8px}
.hero-card p{max-width:650px;margin:18px 0 0;color:var(--muted);font-size:17px;line-height:1.52;letter-spacing:-.2px}
.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.primary-button,.secondary-button,.ai-action,.play-link,.load-more{
  display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 20px;
  border:1px solid #000;border-radius:999px;text-decoration:none;font-weight:800;cursor:pointer;
}
.primary-button,.ai-action{background:#000;color:#fff}
.secondary-button,.load-more{background:#fff;color:#000}
.hero-orbit{position:relative;min-height:230px}
.orbit-card,.orbit-center{
  position:absolute;display:grid;place-items:center;border:1px solid rgba(0,0,0,.12);
  background:rgba(255,255,255,.9);box-shadow:0 16px 36px rgba(0,0,0,.09);
  font-weight:850;
}
.orbit-center{left:50%;top:50%;width:112px;height:112px;transform:translate(-50%,-50%);border-radius:32px;background:#000;color:#fff;font-size:28px}
.orbit-card{width:74px;height:74px;border-radius:23px;font-size:18px}
.orbit-one{left:4%;top:7%;transform:rotate(-8deg)}
.orbit-two{right:5%;top:4%;transform:rotate(9deg)}
.orbit-three{right:16%;bottom:0;transform:rotate(-5deg)}
.ai-card{
  display:grid;grid-template-columns:auto 1fr;gap:15px;align-items:center;
  margin-top:18px;padding:20px;border:1px solid rgba(0,0,0,.08);border-radius:var(--radius-lg);
  background:rgba(255,255,255,.7);box-shadow:var(--shadow-soft);backdrop-filter:blur(18px)
}
.ai-badge{display:grid;place-items:center;width:54px;height:54px;border-radius:18px;background:#000;color:#fff;font-size:22px}
.ai-copy h2{margin:0;font-size:23px;letter-spacing:-.6px}
.ai-copy p{margin:7px 0 0;color:var(--muted);font-size:14px;line-height:1.45}
.ai-action{grid-column:1/-1;width:100%;justify-content:space-between;border-radius:16px}
.daily-card{
  margin-top:18px;min-height:190px;padding:24px;border-radius:var(--radius-lg);
  background:#000;color:#fff;box-shadow:var(--shadow);overflow:hidden
}
.daily-inner{display:grid;gap:16px}
.daily-card h2{margin:0;font-size:31px;line-height:1.05;letter-spacing:-1px}
.daily-card p{margin:8px 0 0;color:#d5d5d7;line-height:1.45}
.daily-meta,.card-meta{display:flex;flex-wrap:wrap;gap:7px}
.pill{display:inline-flex;align-items:center;min-height:29px;padding:5px 10px;border:1px solid rgba(255,255,255,.34);border-radius:999px;font-size:11px;font-weight:800}
.daily-card .play-link{background:#fff;color:#000;border-color:#fff;border-radius:15px}
.content-section{margin-top:42px}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:17px}
.section-heading h2{margin:0;font-size:31px;line-height:1;letter-spacing:-1px}
.section-note{font-size:12px;color:var(--muted);font-weight:700}
.game-type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.game-type-card{
  display:flex;align-items:center;gap:13px;min-height:94px;padding:14px;
  border:1px solid rgba(0,0,0,.1);border-radius:22px;background:rgba(255,255,255,.74);
  box-shadow:0 7px 24px rgba(0,0,0,.045);text-align:left;cursor:pointer
}
.game-type-card.active,.game-type-card:hover{background:#000;color:#fff;transform:translateY(-1px)}
.game-type-symbol{
  display:grid;place-items:center;width:48px;height:48px;flex:0 0 48px;border-radius:16px;
  background:rgba(0,0,0,.055);font-size:16px;font-weight:850
}
.game-type-card.active .game-type-symbol,.game-type-card:hover .game-type-symbol{background:rgba(255,255,255,.15)}
.game-type-copy{display:grid;gap:4px;min-width:0}
.game-type-copy strong{font-size:14px;line-height:1.15}
.game-type-copy small{font-size:11px;color:inherit;opacity:.58;line-height:1.25}
.search-panel{
  display:grid;gap:10px;margin-bottom:18px;padding:13px;border:1px solid rgba(0,0,0,.08);
  border-radius:22px;background:rgba(255,255,255,.72);box-shadow:var(--shadow-soft)
}
.search-field{display:flex;align-items:center;gap:9px;min-height:50px;padding:0 14px;border-radius:15px;background:#f0f0f2}
.search-field input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:15px}
.filter-row{display:grid;grid-template-columns:1fr;gap:8px}
.filter-row select{
  width:100%;height:45px;padding:0 12px;border:0;border-radius:14px;background:#f0f0f2;color:#111;outline:0
}
.exercise-grid{display:grid;gap:12px}
.exercise-card{
  display:grid;grid-template-columns:58px 1fr auto;gap:13px;align-items:center;
  min-height:116px;padding:16px;border:1px solid rgba(0,0,0,.08);border-radius:22px;
  background:rgba(255,255,255,.78);box-shadow:var(--shadow-soft);text-decoration:none
}
.exercise-card:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(0,0,0,.09)}
.exercise-icon{
  display:grid;place-items:center;width:58px;height:58px;border-radius:18px;
  background:#f0f0f2;font-size:16px;font-weight:850
}
.exercise-card h3{margin:0;font-size:17px;line-height:1.2;letter-spacing:-.35px}
.exercise-card p{
  display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  margin:7px 0;color:var(--muted);font-size:13px;line-height:1.38
}
.card-meta{font-size:10.5px;font-weight:750;color:#4d4d52}
.exercise-status{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#f0f0f2;font-weight:850}
.exercise-status.done{background:#000;color:#fff}
.load-more{width:100%;margin-top:14px;border-radius:16px}
.empty{padding:40px 20px;border:1px dashed rgba(0,0,0,.22);border-radius:22px;text-align:center;background:rgba(255,255,255,.5)}
.dock{
  position:fixed;left:50%;bottom:calc(12px + var(--safe-bottom));z-index:60;
  display:grid;grid-template-columns:repeat(4,1fr);width:min(calc(100% - 24px),470px);
  transform:translateX(-50%);padding:8px;border:1px solid rgba(0,0,0,.11);
  border-radius:24px;background:rgba(248,248,250,.82);box-shadow:0 18px 48px rgba(0,0,0,.16);
  backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%)
}
.dock a,.dock button{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  min-height:52px;border:0;border-radius:17px;background:transparent;text-decoration:none;cursor:pointer
}
.dock .active{background:#000;color:#fff}
.dock span{font-size:17px;font-weight:800}.dock small{font-size:9px;font-weight:750}
.profile-menu{
  position:fixed;right:16px;top:66px;z-index:80;display:grid;width:240px;padding:8px;
  border:1px solid rgba(0,0,0,.12);border-radius:20px;background:rgba(255,255,255,.9);
  box-shadow:0 20px 45px rgba(0,0,0,.16);backdrop-filter:blur(24px)
}
.profile-menu[hidden]{display:none}
.profile-head{display:grid;gap:3px;padding:12px}
.profile-head span{font-size:11px;color:var(--muted)}
.profile-menu a,.profile-menu button{padding:12px;border:0;border-radius:13px;background:transparent;text-decoration:none;text-align:left;cursor:pointer}
.profile-menu a:hover,.profile-menu button:hover{background:#f0f0f2}
.toast{
  position:fixed;left:50%;bottom:105px;z-index:100;transform:translateX(-50%);
  max-width:calc(100% - 30px);padding:12px 17px;border-radius:999px;background:#000;color:#fff;
  box-shadow:0 14px 35px rgba(0,0,0,.2);font-size:13px;font-weight:750;text-align:center
}
.skeleton{animation:pulse 1.2s infinite;background:#e4e4e7!important;color:transparent!important}
@keyframes pulse{50%{opacity:.58}}

/* Login and AI page helpers */
.ai-page{min-height:100vh;padding-bottom:40px}
.ai-main{width:min(100%,900px);margin:0 auto;padding:28px 15px 50px}
.ai-hero,.ai-form{padding:24px;border:1px solid rgba(0,0,0,.08);border-radius:28px;background:rgba(255,255,255,.78);box-shadow:var(--shadow-soft)}
.ai-hero h1{margin:0;font-size:42px;letter-spacing:-1.7px}.ai-hero p{color:var(--muted);line-height:1.5}
.ai-form{margin-top:16px}
.ai-form fieldset{margin:0 0 22px;padding:0;border:0}
.ai-form legend,.ai-field>span{display:block;margin-bottom:9px;font-size:12px;font-weight:800}
.ai-type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;max-height:420px;overflow:auto;padding:2px}
.ai-type-grid label{position:relative}
.ai-type-grid input{position:absolute;opacity:0;pointer-events:none}
.ai-type-grid label>span{
  display:flex;align-items:center;gap:10px;min-height:70px;padding:13px;border:1px solid rgba(0,0,0,.1);
  border-radius:18px;background:#f4f4f6;cursor:pointer
}
.ai-type-grid input:checked+span{background:#000;color:#fff}
.ai-type-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.7);color:#000;font-weight:850}
.ai-type-copy{display:grid;gap:2px}.ai-type-copy strong{font-size:13px}.ai-type-copy small{font-size:10px;opacity:.62}
.ai-field{display:block;margin-top:16px}
.ai-field input,.ai-field select,.ai-field textarea{
  width:100%;border:1px solid rgba(0,0,0,.12);border-radius:16px;background:#f4f4f6;outline:0;padding:13px
}
.ai-field input,.ai-field select{height:50px}.ai-field textarea{min-height:110px;resize:vertical}
.ai-two-columns{display:grid;grid-template-columns:1fr;gap:12px}
.ai-generate-button{width:100%;min-height:54px;margin-top:20px;border:0;border-radius:17px;background:#000;color:#fff;font-weight:850}
.ai-message,.ai-limit-note{font-size:12px;color:var(--muted);line-height:1.45}
.player-head{
  position:sticky;top:0;z-index:50;display:grid;grid-template-columns:48px 1fr 48px;align-items:center;
  gap:10px;min-height:70px;padding:9px 12px;border-bottom:1px solid rgba(0,0,0,.08);
  background:rgba(250,250,252,.8);backdrop-filter:blur(24px)
}
.back-btn,.icon-btn{
  display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(0,0,0,.1);
  border-radius:50%;background:rgba(255,255,255,.8);text-decoration:none;font-weight:800
}
.player-title{min-width:0;text-align:center}.player-title span{display:block;font-size:9px;font-weight:850;letter-spacing:1.4px}
.player-title strong{display:block;overflow:hidden;margin-top:3px;text-overflow:ellipsis;white-space:nowrap;font-size:15px}

/* Player */
.player{min-height:100vh;padding-bottom:calc(118px + var(--safe-bottom))}
.progress-track{position:sticky;top:70px;z-index:45;height:4px;background:rgba(0,0,0,.08)}
.progress-bar{height:100%;width:0;background:var(--primary);transition:width .25s}
.player-main{width:min(100%,920px);margin:0 auto;padding:20px 14px 120px}
.guest-progress-note{
  margin-bottom:14px;padding:13px 15px;border:1px solid rgba(0,0,0,.09);border-radius:16px;
  background:rgba(255,255,255,.74);color:var(--muted);font-size:12px;line-height:1.4
}
.guest-progress-note a{font-weight:800}
.intro{
  min-height:108px;padding:22px;border:1px solid rgba(0,0,0,.08);border-radius:24px;
  background:rgba(255,255,255,.78);box-shadow:var(--shadow-soft)
}
.intro h1{margin:0;font-size:28px;letter-spacing:-.9px}.intro p{margin:9px 0 0;color:var(--muted);line-height:1.48}
.game{margin-top:15px}
.player-foot{
  position:fixed;left:0;right:0;bottom:0;z-index:55;display:grid;gap:8px;padding:10px 14px calc(10px + var(--safe-bottom));
  border-top:1px solid rgba(0,0,0,.08);background:rgba(250,250,252,.84);backdrop-filter:blur(24px)
}
.feedback{min-height:18px;text-align:center;font-size:12px;font-weight:750}
.primary{
  width:100%;min-height:54px;border:0;border-radius:17px;background:var(--primary);color:#fff;font-size:15px;font-weight:850
}
.primary:disabled{background:#d2d2d7;color:#777}
.game-card{
  padding:20px;border:1px solid rgba(0,0,0,.09);border-radius:24px;background:rgba(255,255,255,.8);box-shadow:var(--shadow-soft)
}
.game-stack{display:grid;gap:13px}
.game-kicker{font-size:10px;font-weight:850;letter-spacing:1.3px;color:var(--muted)}
.game-question{margin:8px 0 0;font-size:21px;line-height:1.35;font-weight:750;letter-spacing:-.35px}
.game-subtext{margin:8px 0 0;color:var(--muted);font-size:13px;line-height:1.45}
.game-input,.game-textarea{
  width:100%;margin-top:14px;border:1px solid rgba(0,0,0,.15);border-radius:16px;background:#f4f4f6;outline:0;padding:13px;color:#111
}
.game-input{height:50px}.game-textarea{min-height:105px;resize:vertical}
.game-input:focus,.game-textarea:focus{box-shadow:0 0 0 4px rgba(0,0,0,.08)}
.game-input.wrong,.game-textarea.wrong{box-shadow:0 0 0 2px #000;background:#e4e4e7}
.answer-panel{
  margin-top:14px;padding:14px;border-radius:16px;background:#f0f0f2;color:#111;font-size:13px;line-height:1.45
}
.answer-panel[hidden]{display:none}
.choice-grid{display:grid;grid-template-columns:1fr;gap:9px;margin-top:15px}
.choice-button{
  width:100%;min-height:58px;padding:12px 14px;border:1px solid rgba(0,0,0,.13);border-radius:17px;
  background:#f4f4f6;text-align:left;font-weight:720;cursor:pointer
}
.choice-button.selected{background:#000;color:#fff}.choice-button.correct{box-shadow:inset 0 0 0 2px #000}.choice-button.wrong{opacity:.48}
.reason-input{margin-top:10px}
.muted-label{display:block;margin-top:12px;color:var(--muted);font-size:11px;font-weight:750}
.term-mask{margin-top:12px;font-size:clamp(25px,8vw,42px);font-weight:850;letter-spacing:5px;text-align:center}
.chip-zone{display:flex;flex-wrap:wrap;gap:8px;min-height:58px;margin-top:12px;padding:10px;border:1px dashed rgba(0,0,0,.24);border-radius:17px;background:#f8f8f9}
.word-chip{padding:9px 12px;border:1px solid rgba(0,0,0,.13);border-radius:999px;background:#fff;font-weight:750;cursor:pointer}
.answer-zone{border-style:solid;background:#efeff1}
.self-review{display:flex;gap:8px;margin-top:12px}.self-review button{flex:1;min-height:44px;border:1px solid #000;border-radius:14px;background:#fff;font-weight:800}.self-review .confirm{background:#000;color:#fff}
.match-layout{display:grid;grid-template-columns:1fr;gap:12px}
.match-column{display:grid;gap:8px}
.match-item{
  width:100%;min-height:55px;padding:11px;border:1px solid rgba(0,0,0,.13);border-radius:16px;background:#f4f4f6;text-align:left;cursor:pointer
}
.match-item.selected{background:#000;color:#fff}.match-item.matched{opacity:.38;pointer-events:none}
.escape-stage{padding:22px;border-radius:24px;background:#000;color:#fff;box-shadow:var(--shadow)}
.escape-stage h2{margin:6px 0 0;font-size:27px}.escape-stage p{line-height:1.5}
.escape-stage .game-input{background:#fff}.hint{margin-top:12px;color:#d1d1d6;font-size:13px}
.escape-code{margin-top:14px;padding:17px;border:1px solid rgba(0,0,0,.09);border-radius:20px;background:#fff}
.inline-score{margin-top:9px;color:var(--muted);font-size:12px}

/* Word search */
.word-search-wrap{display:grid;gap:16px}
.word-search-grid{
  display:grid;gap:1px;width:min(100%,640px);margin:0 auto;touch-action:none;user-select:none;
  background:#000;border:1px solid #000;border-radius:16px;overflow:hidden
}
.ws-cell{display:grid;place-items:center;aspect-ratio:1;background:#fff;font-size:clamp(11px,4vw,23px);font-weight:850}
.ws-cell.preview{background:#d1d1d6}.ws-cell.found{background:#000;color:#fff}
.word-bank{display:flex;flex-wrap:wrap;gap:7px;justify-content:center}
.word-token{padding:7px 10px;border-radius:999px;background:#fff;border:1px solid rgba(0,0,0,.13);font-size:11px;font-weight:800}
.word-token.found{text-decoration:line-through;background:#000;color:#fff}

/* Crossword */
.cw-wrap{display:grid;gap:18px}
.cw-scroll{overflow:auto;padding:5px}
.cw-grid{position:relative;margin:0 auto;background:#000;border-radius:12px;overflow:hidden}
.cw-cell{position:absolute;display:grid;place-items:center;background:#fff;border:1px solid #000}
.cw-cell input{width:100%;height:100%;border:0;background:transparent;text-align:center;text-transform:uppercase;font-size:clamp(16px,5vw,24px);font-weight:850;outline:0}
.cw-cell input:focus{box-shadow:inset 0 0 0 3px #000}
.cw-cell input.wrong{background:#d1d1d6}.cw-num{position:absolute;left:2px;top:2px;font-size:8px;font-weight:850;pointer-events:none}
.clue-cols{display:grid;gap:14px}.clue-group{padding:16px;border-radius:20px;background:rgba(255,255,255,.8);border:1px solid rgba(0,0,0,.08)}
.clue-group h3{margin:0 0 9px;font-size:12px;letter-spacing:1px}.clue-list{display:grid;gap:7px}
.clue{display:grid;grid-template-columns:24px 1fr;gap:5px;width:100%;padding:9px;border:0;border-radius:12px;background:#f0f0f2;text-align:left}
.clue.active{background:#000;color:#fff}

/* Error and translation cards */
.error-list{display:grid;gap:13px}
.error-card{padding:20px;border:1px solid rgba(0,0,0,.09);border-radius:24px;background:rgba(255,255,255,.8);box-shadow:var(--shadow-soft)}
.error-card.correct{background:#000;color:#fff}
.error-index{font-size:10px;font-weight:850;letter-spacing:1.2px;color:inherit;opacity:.62}
.error-sentence{margin:10px 0 14px;font-size:20px;line-height:1.38;font-weight:750}
.error-card textarea{width:100%;min-height:95px;border:1px solid rgba(0,0,0,.15);border-radius:16px;padding:13px;resize:vertical}
.error-card button{width:100%;min-height:45px;margin-top:9px;border:1px solid currentColor;border-radius:14px;background:transparent;color:inherit;font-weight:800}
.explanation{margin-top:12px;padding-top:12px;border-top:1px solid currentColor;line-height:1.45;font-size:13px}
.shake{animation:shake .28s}@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}

/* Dialog */
dialog{width:min(calc(100% - 28px),500px);border:0;border-radius:28px;padding:26px;background:rgba(255,255,255,.96);box-shadow:0 30px 80px rgba(0,0,0,.3)}
dialog::backdrop{background:rgba(0,0,0,.55);backdrop-filter:blur(5px)}
.result{text-align:center}.result-mark{display:grid;place-items:center;width:72px;height:72px;margin:0 auto 17px;border-radius:24px;background:#000;color:#fff;font-size:34px;font-weight:850}
.result h2{margin:0;font-size:31px}.result p{color:var(--muted);line-height:1.5}
.result-stats{display:grid;grid-template-columns:1fr 1fr;margin:20px 0;border-radius:18px;background:#f0f0f2;overflow:hidden}
.result-stats div{padding:16px}.result-stats div+div{border-left:1px solid rgba(0,0,0,.1)}
.result-stats strong{display:block;font-size:23px}.result-stats span{font-size:10px;color:var(--muted)}
.dialog-btn,.result button{display:flex;align-items:center;justify-content:center;width:100%;min-height:50px;margin-top:8px;border:0;border-radius:16px;background:#000;color:#fff;text-decoration:none;font-weight:850}
.result button{background:#f0f0f2;color:#000}.help{position:relative}.close-dialog{position:absolute;right:10px;top:8px;border:0;background:transparent;font-size:28px}
.help h2{margin-top:0}.help p{line-height:1.55;color:var(--muted)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media(min-width:700px){
  .main{padding:36px 26px 70px}
  .hero-card{grid-template-columns:1.35fr .65fr;align-items:center;padding:46px}
  .ai-card{grid-template-columns:auto 1fr auto;padding:22px 25px}
  .ai-action{grid-column:auto;width:auto;min-width:160px}
  .daily-card{padding:30px}.daily-inner{grid-template-columns:1fr auto;align-items:end}
  .game-type-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .filter-row{grid-template-columns:repeat(3,1fr)}
  .exercise-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .player-main{padding:28px 24px 130px}
  .player-foot{left:50%;right:auto;width:min(100%,920px);transform:translateX(-50%);grid-template-columns:1fr 290px;align-items:center;border-radius:22px 22px 0 0}
  .clue-cols{grid-template-columns:1fr 1fr}
  .choice-grid{grid-template-columns:1fr 1fr}
  .match-layout{grid-template-columns:1fr 1fr}
  .ai-type-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ai-two-columns{grid-template-columns:1fr 1fr}
}
@media(min-width:1050px){
  .game-type-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .exercise-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
