.ph-head[data-astro-cid-ouarzhr5]{max-width:660px;margin-inline:auto}.pip-hero,.pip-hero *,.pip-hero :before,.pip-hero :after{box-sizing:border-box;-webkit-tap-highlight-color:transparent}.pip-hero{background:linear-gradient(180deg, var(--ga-face-2), var(--ga-well)) padding-box, linear-gradient(150deg, color-mix(in srgb, var(--brand) 40%, transparent), var(--ga-line) 38%, var(--ga-line)) border-box;border-radius:var(--candy-radius);max-width:660px;color:var(--ink);border:1px solid #0000;margin:0 auto 18px;padding:0 0 14px;line-height:1.5;position:relative;overflow:hidden}.pip-hero:before{content:"";pointer-events:none;background:radial-gradient(72% 44% at 50% 0%, color-mix(in srgb, var(--brand) 12%, transparent), transparent 70%), radial-gradient(60% 40% at 100% 100%, color-mix(in srgb, var(--gold) 7%, transparent), transparent 70%);position:absolute;inset:0}.pip-hero .ph-toolbar{z-index:2;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px 0;display:flex;position:relative}.pip-hero .sound-btn{border:1px solid var(--ga-line-2);background:var(--ga-well);width:38px;height:38px;color:var(--muted);cursor:pointer;border-radius:8px;place-items:center;transition:color .16s,border-color .16s,background .16s;display:grid}.pip-hero .sound-btn svg{width:19px;height:19px;display:block}.pip-hero .sound-btn .spk-off{display:none}.pip-hero .sound-btn:hover{color:var(--ink);border-color:var(--border-brand)}.pip-hero .sound-btn[aria-pressed=true]{color:var(--down);border-color:color-mix(in srgb, var(--down) 45%, transparent);background:var(--rw-bg)}.pip-hero .sound-btn[aria-pressed=true] .spk-wave{display:none}.pip-hero .sound-btn[aria-pressed=true] .spk-off{display:block}.pip-hero .pip-hero-main{z-index:2;flex-direction:column;padding:14px 18px 22px;display:flex;position:relative}.pip-hero .screen{display:none}.pip-hero .screen.active{display:block}.pip-hero .fade-in{animation:ga-rise .34s var(--candy-pop) both}.pip-hero .fade-out{opacity:0;transform:translateY(-6px)}.pip-hero .game-card{background:linear-gradient(180deg, color-mix(in srgb, var(--ga-face) 92%, transparent), color-mix(in srgb, var(--ga-well) 88%, transparent)) padding-box, linear-gradient(165deg, var(--ga-line-2), var(--ga-line)) border-box;border-radius:var(--candy-radius);border:1px solid #0000;padding:24px 22px;position:relative}.pip-hero .ph-intro{text-align:center}.pip-hero .hero-badge{border:1px solid color-mix(in srgb, var(--gold) 34%, transparent);background:var(--gold-soft);color:var(--gold);font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;border-radius:999px;align-items:center;gap:8px;margin-bottom:20px;padding:7px 14px;font-size:.62rem;font-weight:600;display:inline-flex}.pip-hero .game-title{font-family:var(--font-display);letter-spacing:-.045em;color:var(--ink);text-shadow:0 0 44px var(--brand-glow);margin:0 0 12px;font-size:clamp(2.5rem,9vw,3.6rem);font-weight:800;line-height:.98}.pip-hero .game-title:after{content:"";background:repeating-linear-gradient(90deg, var(--brand) 0 9px, transparent 9px 15px);width:74px;height:4px;margin:16px auto 0;display:block}.pip-hero .game-subtitle{color:var(--muted);margin:0 0 24px;font-size:1.02rem}.pip-hero .game-subtitle strong{color:var(--brand);font-weight:600}.pip-hero .mode-row{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px;display:grid}.pip-hero .mode-btn{background:linear-gradient(var(--ga-well), var(--ga-well)) padding-box, linear-gradient(var(--ga-line), var(--ga-line)) border-box;color:var(--ink);font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;border-radius:var(--candy-radius-sm);touch-action:manipulation;border:1px solid #0000;flex-direction:column;align-items:flex-start;gap:2px;padding:13px 16px;font-size:.74rem;font-weight:600;transition:color .16s,background .16s;display:flex}.pip-hero .mode-btn span{letter-spacing:.1em;color:var(--muted-2);font-size:.62rem;font-weight:500}.pip-hero .mode-btn:hover{color:var(--brand)}.pip-hero .mode-btn.active{color:var(--brand);background:linear-gradient(color-mix(in srgb, var(--brand) 12%, var(--ga-well)), color-mix(in srgb, var(--brand) 6%, var(--ga-well))) padding-box, linear-gradient(color-mix(in srgb, var(--brand) 62%, transparent), color-mix(in srgb, var(--brand) 26%, transparent)) border-box}.pip-hero .mode-btn.active span{color:var(--brand-dim)}.pip-hero .mode-desc{font-family:var(--font-mono);text-align:center;color:var(--muted);margin-bottom:8px;font-size:.72rem}.pip-hero .best-line{text-align:center;min-height:1.2em;font-family:var(--font-mono);letter-spacing:.04em;color:var(--gold);margin-bottom:22px;font-size:.74rem}.pip-hero .feature-list{gap:9px;margin-bottom:24px;display:grid}.pip-hero .feature-item{border:1px solid var(--ga-line);background:color-mix(in srgb, var(--ga-well) 70%, transparent);text-align:left;align-items:flex-start;gap:14px;padding:13px 15px;display:flex}.pip-hero .feature-icon{border:1px solid var(--border-brand);background:var(--brand-soft);width:34px;height:34px;color:var(--brand);border-radius:8px;flex:none;place-items:center;display:grid}.pip-hero .feature-icon svg{width:18px;height:18px}.pip-hero .feature-text h3{font-family:var(--font-sans);color:var(--ink);letter-spacing:0;margin:0 0 2px;font-size:.92rem;font-weight:600}.pip-hero .feature-text p{color:var(--muted);margin:0;font-size:.83rem;line-height:1.45}.pip-hero .btn{width:100%;min-height:52px;font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;user-select:none;border:0;border-radius:8px;justify-content:center;align-items:center;gap:9px;padding:14px 20px;font-size:.8rem;font-weight:600;text-decoration:none;transition:transform .12s,box-shadow .12s,background .16s,color .16s,border-color .16s;display:inline-flex}.pip-hero .btn b{font-size:1rem}.pip-hero .btn-primary{background:var(--brand);color:var(--on-brand);box-shadow:0 4px 0 0 color-mix(in srgb, var(--brand) 44%, #000)}.pip-hero .btn-primary:hover{transform:translateY(-1px)}.pip-hero .btn-primary:active{box-shadow:0 0 0 0 color-mix(in srgb, var(--brand) 44%, #000);transform:translateY(4px)}.pip-hero .btn-secondary{background:var(--ga-well);color:var(--ink);border:1px solid var(--ga-line-2);box-shadow:0 4px 0 0 var(--ga-line)}.pip-hero .btn-secondary:hover{border-color:var(--brand);color:var(--brand)}.pip-hero .btn-outline{color:var(--brand);border:1px solid var(--border-brand);box-shadow:none;background:0 0}.pip-hero .btn-outline:hover{background:var(--brand-soft)}.pip-hero .btn-ghost{color:var(--muted);border:1px dashed var(--ga-line-2);box-shadow:none;background:0 0}.pip-hero .btn-ghost:hover{color:var(--ink);border-color:var(--ga-line-2)}.pip-hero .hud-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;display:flex}.pip-hero .hud-stat{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-size:.68rem}.pip-hero .hud-stat strong{color:var(--ink);font-size:.9rem}.pip-hero .hud-timer{border:1px solid var(--ga-line-2);background:var(--ga-well);font-family:var(--font-mono);letter-spacing:.04em;color:var(--ink);border-radius:999px;align-items:center;gap:7px;padding:6px 13px;font-size:.86rem;font-weight:600;transition:color .2s,border-color .2s,background .2s;display:inline-flex}.pip-hero .hud-timer svg{width:15px;height:15px}.pip-hero .hud-timer.timer-warning{color:var(--gold);border-color:color-mix(in srgb, var(--gold) 55%, transparent);background:var(--gold-soft)}.pip-hero .hud-timer.timer-danger{color:var(--down);border-color:var(--rw-border);background:var(--rw-bg);animation:.9s ease-in-out infinite ph-tick}@keyframes ph-tick{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.pip-hero .hud-score-pill{border:1px solid var(--border-brand);background:var(--brand-soft);font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--brand);border-radius:999px;align-items:center;gap:7px;padding:6px 13px;font-size:.68rem;display:inline-flex}.pip-hero .hud-score-pill span:last-child{font-size:.9rem;font-weight:600}.pip-hero .hud-streak{border:1px solid color-mix(in srgb, var(--gold) 50%, transparent);background:var(--gold-soft);font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--gold);border-radius:999px;align-items:center;padding:6px 13px;font-size:.68rem;font-weight:600;display:inline-flex}.pip-hero .hud-streak.pop{animation:.32s cubic-bezier(.34,1.56,.64,1) ga-pop}.pip-hero .progress-track{border:1px solid var(--ga-line);background:var(--ga-well);height:6px;margin-bottom:16px;overflow:hidden}.pip-hero .progress-fill{background:linear-gradient(90deg, var(--brand-deep), var(--brand));width:10%;height:100%;box-shadow:0 0 14px var(--brand-glow);transition:width .3s cubic-bezier(.22,1,.36,1)}.pip-hero .q-meta{justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px;display:flex}.pip-hero .q-category{font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--brand);background:var(--brand-soft);border:1px solid var(--border-brand);border-radius:999px;padding:4px 10px;font-size:.62rem;font-weight:600}.pip-hero .q-speed-hint{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--gold);font-size:.64rem}.pip-hero .q-text{font-family:var(--font-display);letter-spacing:-.01em;color:var(--ink);margin:0 0 14px;font-size:1.2rem;font-weight:700;line-height:1.4}.pip-hero .q-context-box{border:1px dashed var(--ga-line-2);border-left:3px solid var(--gold);background:var(--ga-well);font-family:var(--font-mono);color:var(--ink-soft);align-items:center;gap:10px;margin-bottom:18px;padding:10px 14px;font-size:.78rem;display:flex}.pip-hero .q-context-box .badge{letter-spacing:.14em;text-transform:uppercase;color:var(--gold);background:var(--gold-soft);border:1px solid color-mix(in srgb, var(--gold) 34%, transparent);border-radius:999px;flex:none;padding:3px 8px;font-size:.58rem;font-weight:600}.pip-hero .quiz-tools{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px;display:flex}.pip-hero .lifeline-btn{border:1px solid color-mix(in srgb, var(--gold) 40%, transparent);background:var(--gold-soft);color:var(--gold);font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;border-radius:999px;align-items:center;gap:8px;padding:8px 15px;font-size:.68rem;font-weight:600;transition:filter .16s,opacity .16s;display:inline-flex}.pip-hero .lifeline-btn span{font-family:var(--font-sans);letter-spacing:0;text-transform:none;color:var(--muted);font-weight:400}.pip-hero .lifeline-btn:hover:not(:disabled){filter:brightness(1.14)}.pip-hero .lifeline-btn:disabled{opacity:.4;cursor:default}.pip-hero .kbd-hint{font-family:var(--font-mono);letter-spacing:.04em;color:var(--muted-2);font-size:.64rem}.pip-hero .kbd-hint kbd{font-family:var(--font-mono);border:1px solid var(--ga-line-2);background:var(--ga-well);color:var(--ink);border-bottom-width:2px;border-radius:5px;padding:1px 6px;font-size:.66rem}.pip-hero .options-grid{gap:10px;margin-bottom:16px;display:grid}.pip-hero .option-btn{text-align:left;background:linear-gradient(var(--ga-well), var(--ga-well)) padding-box, linear-gradient(var(--ga-line-2), var(--ga-line)) border-box;width:100%;min-height:54px;color:var(--ink);line-height:1.35;font-family:var(--font-sans);cursor:pointer;border-radius:var(--candy-radius-sm);touch-action:manipulation;transition:transform .2s var(--candy-spring), background .16s ease;border:2px solid #0000;align-items:center;gap:13px;padding:13px 16px;font-size:.95rem;display:flex;position:relative;overflow:hidden}.pip-hero .option-btn:before{content:"";background:var(--ga-line-2);width:3px;transition:background .16s;position:absolute;top:0;bottom:0;left:0}.pip-hero .option-btn:hover:not(:disabled){background:linear-gradient(color-mix(in srgb, var(--brand) 8%, var(--ga-well)), color-mix(in srgb, var(--brand) 4%, var(--ga-well))) padding-box, linear-gradient(var(--border-brand), var(--ga-line)) border-box;transform:translate(4px)scale(1.01)}.pip-hero .option-btn:hover:not(:disabled):before{background:var(--brand)}.pip-hero .option-btn:active:not(:disabled){transform:scale(.97)}.pip-hero .option-btn:disabled{cursor:default}.pip-hero .option-key{border:1px solid var(--ga-line-2);background:var(--ga-face);width:30px;height:30px;font-family:var(--font-mono);color:var(--muted);border-radius:6px;flex:none;place-items:center;font-size:.78rem;font-weight:600;display:grid}.pip-hero .option-label{flex:1;font-weight:500}.pip-hero .option-btn.selected-correct{background:linear-gradient(color-mix(in srgb, var(--up) 16%, var(--ga-well)), color-mix(in srgb, var(--up) 9%, var(--ga-well))) padding-box, linear-gradient(var(--up), color-mix(in srgb, var(--up) 45%, transparent)) border-box;color:var(--ink);box-shadow:0 0 22px -6px color-mix(in srgb, var(--up) 55%, transparent)}.pip-hero .option-btn.selected-correct:before{background:var(--up)}.pip-hero .option-btn.selected-correct .option-key{background:var(--up);color:var(--on-brand);border-color:var(--up)}.pip-hero .option-btn.selected-wrong{background:linear-gradient(color-mix(in srgb, var(--down) 16%, var(--ga-well)), color-mix(in srgb, var(--down) 9%, var(--ga-well))) padding-box, linear-gradient(var(--down), color-mix(in srgb, var(--down) 45%, transparent)) border-box;color:var(--ink)}.pip-hero .option-btn.selected-wrong:before{background:var(--down)}.pip-hero .option-btn.selected-wrong .option-key{background:var(--down);color:#fff;border-color:var(--down)}.pip-hero .option-btn.reveal-correct{background:linear-gradient(color-mix(in srgb, var(--up) 10%, var(--ga-well)), transparent) padding-box, linear-gradient(color-mix(in srgb, var(--up) 65%, transparent), color-mix(in srgb, var(--up) 25%, transparent)) border-box}.pip-hero .option-btn.reveal-correct:before{background:var(--up)}.pip-hero .option-btn.reveal-correct .option-key{color:var(--up);border-color:color-mix(in srgb, var(--up) 45%, transparent)}.pip-hero .feedback-box{border:1px solid var(--ga-line);border-left:3px solid var(--brand);border-radius:var(--candy-radius-sm);background:var(--ga-well);animation:ga-rise .24s var(--candy-spring);margin-top:4px;padding:16px}.pip-hero .feedback-box.correct{border-left-color:var(--up);background:color-mix(in srgb, var(--up) 7%, var(--ga-well))}.pip-hero .feedback-box.wrong{border-left-color:var(--down);background:color-mix(in srgb, var(--down) 7%, var(--ga-well))}.pip-hero .feedback-header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 10px;margin-bottom:8px;display:flex}.pip-hero .feedback-tag{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--brand);font-size:.72rem}.pip-hero .feedback-tag.correct{color:var(--up)}.pip-hero .feedback-tag.wrong{color:var(--down)}.pip-hero .feedback-tag strong{font-weight:600}.pip-hero .feedback-pts{font-family:var(--font-mono);white-space:nowrap;color:var(--ink);font-size:.8rem;font-weight:600}.pip-hero .feedback-pts.bonus{color:var(--gold)}.pip-hero .feedback-text{color:var(--ink-soft);margin-bottom:14px;font-size:.88rem;line-height:1.55}.pip-hero .result-container{text-align:center}.pip-hero .result-shield-badge{background:linear-gradient(var(--ga-well), var(--ga-well)) padding-box, linear-gradient(160deg, var(--brand), color-mix(in srgb, var(--brand) 22%, transparent)) border-box;border-radius:var(--candy-radius-sm);width:74px;height:74px;font-family:var(--font-mono);letter-spacing:-.03em;color:var(--brand);box-shadow:0 0 34px -10px var(--brand-glow);border:1px solid #0000;place-items:center;margin:0 auto 16px;font-size:1.7rem;font-weight:600;display:grid}.pip-hero .result-rank{font-family:var(--font-display);letter-spacing:-.03em;color:var(--ink);margin:0 0 6px;font-size:1.85rem;font-weight:800}.pip-hero .result-kicker{font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:6px;font-size:.64rem;font-weight:600}.pip-hero .result-score-hero{justify-content:center;align-items:baseline;gap:4px;margin:14px 0;display:flex}.pip-hero .result-score-num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.04em;color:var(--brand);text-shadow:0 0 40px var(--brand-glow);font-size:3.6rem;font-weight:600;line-height:1}.pip-hero .result-score-denom{font-family:var(--font-mono);color:var(--muted-2);font-size:1.3rem;font-weight:600}.pip-hero .result-feedback-line{color:var(--ink-soft);max-width:46ch;margin:0 auto 18px;font-size:1rem;line-height:1.55}.pip-hero .best-line-results{font-family:var(--font-mono);letter-spacing:.06em;color:var(--gold);margin-bottom:20px;font-size:.74rem}.pip-hero .result-stats-grid{grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:22px;display:grid}.pip-hero .result-stat-box{border:1px solid var(--ga-line);background:var(--ga-well);padding:12px 8px}.pip-hero .result-stat-box .stat-label{font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:5px;font-size:.58rem;display:block}.pip-hero .result-stat-box .stat-val{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink);font-size:1.1rem;font-weight:600}.pip-hero .result-actions{gap:9px;margin-bottom:20px;display:grid}.pip-hero .newbest-badge{background:linear-gradient(90deg, var(--gold), color-mix(in srgb, var(--gold) 60%, #fff));color:var(--on-gold);font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;border-radius:999px;margin-bottom:12px;padding:6px 16px;font-size:.64rem;font-weight:600;animation:.4s cubic-bezier(.34,1.56,.64,1) ga-pop;display:inline-block}.pip-hero .review-toggle-btn{border:1px dashed var(--ga-line-2);width:100%;color:var(--muted);font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;background:0 0;justify-content:space-between;align-items:center;gap:10px;padding:13px 16px;font-size:.7rem;transition:color .16s,border-color .16s;display:flex}.pip-hero .review-toggle-btn:hover{color:var(--ink);border-color:var(--brand)}.pip-hero .review-panel{text-align:left;gap:9px;margin-top:12px;display:none}.pip-hero .review-panel.open{display:grid}.pip-hero .review-card{border:1px solid var(--ga-line);border-left:3px solid var(--ga-line-2);background:var(--ga-well);padding:12px 14px;font-size:.83rem}.pip-hero .review-card.correct-card{border-left-color:var(--up)}.pip-hero .review-card.wrong-card{border-left-color:var(--down)}.pip-hero .review-card-title{color:var(--ink);margin-bottom:5px;font-weight:600;line-height:1.4}.pip-hero .review-card-ans{font-family:var(--font-mono);color:var(--muted);margin-bottom:5px;font-size:.74rem}.pip-hero .review-card-ans strong{color:var(--up);font-weight:600}.pip-hero .review-card-why{color:var(--muted);font-size:.78rem;line-height:1.55}.pip-hero .toast{z-index:1000;opacity:0;background:var(--brand);color:var(--on-brand);font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;box-shadow:0 10px 30px -8px var(--brand-glow);pointer-events:none;transition:transform .34s var(--candy-spring), opacity .3s ease;border-radius:12px;align-items:center;gap:9px;padding:12px 20px;font-size:.72rem;font-weight:600;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%)translateY(120px)}.pip-hero .toast svg{width:15px;height:15px}.pip-hero .toast.show{opacity:1;transform:translate(-50%)translateY(0)}.pip-hero .confetti{z-index:2000;pointer-events:none;position:fixed;inset:0;overflow:hidden}.pip-hero .confetti-piece{border-radius:1px;animation-name:ph-confetti;animation-timing-function:linear;animation-fill-mode:forwards;position:absolute;top:-16px}@keyframes ph-confetti{to{transform:translateY(108vh)rotate(720deg)}}@media (width<=520px){.pip-hero .pip-hero-main{padding:12px 12px 18px}.pip-hero .game-card{padding:20px 15px}.pip-hero .q-text{font-size:1.08rem}.pip-hero .q-context-box{flex-direction:column;align-items:flex-start;gap:7px}.pip-hero .feedback-tag{font-size:.66rem}.pip-hero .option-btn{gap:11px;padding:12px 13px;font-size:.9rem}.pip-hero .option-key{width:27px;height:27px;font-size:.72rem}.pip-hero .result-score-num{font-size:3rem}.pip-hero .result-stats-grid{gap:6px}.pip-hero .result-stat-box{padding:10px 5px}.pip-hero .result-stat-box .stat-val{font-size:.98rem}.pip-hero .kbd-hint{display:none}}@media (prefers-reduced-motion:reduce){.pip-hero .hud-timer.timer-danger,.pip-hero .hud-streak.pop,.pip-hero .newbest-badge,.pip-hero .feedback-box,.pip-hero .fade-in{animation:none}.pip-hero .confetti{display:none}.pip-hero .option-btn:hover:not(:disabled){transform:none}}
