:root{--paper: #f6f4ef;--paper-deep: #ebe8df;--ink: #18221d;--ink-soft: #5d6860;--line: rgba(24, 34, 29, .13);--green: #1d6b4c;--green-dark: #124b36;--green-bright: #42c983;--orange: #ed8056;--yellow: #f2bd62;--red: #d95f58;--white: #fffefa;--shadow: 0 24px 65px rgba(29, 53, 40, .11);--rounded-xl: 8px;--rounded-lg: 8px;font-family:Manrope,Noto Sans SC,system-ui,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}html{min-width:320px;min-height:100%}body{min-width:320px;min-height:100vh;margin:0;overflow-x:hidden;background:var(--paper)}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid rgba(66,201,131,.7);outline-offset:4px}.app-shell{position:relative;z-index:1;min-height:100vh}.screen{width:min(1160px,calc(100% - 48px));min-height:100vh;margin:0 auto;padding:64px 0}.screen-centered{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;text-align:center}.screen-heading h1,.screen-centered h1,.result-main h1,.feedback-main h1{margin:0;font-size:4.6rem;font-weight:800;letter-spacing:-.075em;line-height:.96}.eyebrow{margin:0 0 22px;color:var(--green);font-family:DM Mono,monospace;font-size:.72rem;font-weight:500;letter-spacing:.14em}.screen-subtitle,.muted,.hero-description,.result-subtitle{color:var(--ink-soft)}.muted{margin:18px 0 0;font-size:.95rem}.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}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;border:0;border-radius:12px;padding:15px 18px 15px 22px;font-size:.9rem;font-weight:700;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.button:hover{transform:translateY(-3px)}.button-primary{color:var(--white);background:var(--green);box-shadow:0 12px 22px #1d6b4c30}.button-primary:hover{background:var(--green-dark);box-shadow:0 15px 26px #1d6b4c45}.button-large{min-width:190px;padding-top:17px;padding-bottom:17px}.button-large span:last-child{font-size:1.3rem;font-weight:400}.start-screen{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);align-items:center;gap:clamp(60px,10vw,150px)}.start-copy h1{max-width:620px;margin:0;font-size:clamp(4.4rem,11vw,7.4rem);font-weight:800;letter-spacing:.02em;line-height:1.05}.start-copy h1 em{color:var(--green);font-style:normal}.hero-description{max-width:390px;margin:34px 0 32px;font-size:1rem;line-height:1.85}.start-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px}.github-link{display:inline-flex;align-items:center;gap:8px;padding:15px 20px;border:1px solid var(--line);border-radius:12px;background:#fffefaa3;color:var(--ink);font-size:.9rem;font-weight:700;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,color .18s ease}.github-link:hover{transform:translateY(-3px);border-color:var(--ink-soft);color:var(--green);box-shadow:var(--shadow)}.github-icon{width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 .5C5.65.5.5 5.65.5 12c0 5.08 3.29 9.39 7.86 10.91.58.11.79-.25.79-.55 0-.27-.01-1.17-.02-2.12-3.2.7-3.88-1.36-3.88-1.36-.52-1.33-1.28-1.68-1.28-1.68-1.04-.71.08-.7.08-.7 1.15.08 1.76 1.19 1.76 1.19 1.03 1.76 2.7 1.25 3.35.96.1-.74.4-1.25.72-1.54-2.55-.29-5.23-1.28-5.23-5.68 0-1.25.45-2.28 1.19-3.08-.12-.29-.52-1.46.11-3.05 0 0 .97-.31 3.18 1.18a11.1 11.1 0 0 1 5.8 0c2.2-1.49 3.17-1.18 3.17-1.18.63 1.59.23 2.76.11 3.05.74.8 1.19 1.83 1.19 3.08 0 4.41-2.69 5.38-5.25 5.67.41.35.78 1.05.78 2.12 0 1.53-.01 2.76-.01 3.14 0 .3.2.66.8.55A11.5 11.5 0 0 0 23.5 12C23.5 5.65 18.35.5 12 .5z'/%3E%3C/svg%3E") no-repeat center / contain;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 .5C5.65.5.5 5.65.5 12c0 5.08 3.29 9.39 7.86 10.91.58.11.79-.25.79-.55 0-.27-.01-1.17-.02-2.12-3.2.7-3.88-1.36-3.88-1.36-.52-1.33-1.28-1.68-1.28-1.68-1.04-.71.08-.7.08-.7 1.15.08 1.76 1.19 1.76 1.19 1.03 1.76 2.7 1.25 3.35.96.1-.74.4-1.25.72-1.54-2.55-.29-5.23-1.28-5.23-5.68 0-1.25.45-2.28 1.19-3.08-.12-.29-.52-1.46.11-3.05 0 0 .97-.31 3.18 1.18a11.1 11.1 0 0 1 5.8 0c2.2-1.49 3.17-1.18 3.17-1.18.63 1.59.23 2.76.11 3.05.74.8 1.19 1.83 1.19 3.08 0 4.41-2.69 5.38-5.25 5.67.41.35.78 1.05.78 2.12 0 1.53-.01 2.76-.01 3.14 0 .3.2.66.8.55A11.5 11.5 0 0 0 23.5 12C23.5 5.65 18.35.5 12 .5z'/%3E%3C/svg%3E") no-repeat center / contain}.start-panel{position:relative;padding-top:20px}.score-card,.rules-card{position:relative;border:1px solid var(--line);background:#fffefaa3;box-shadow:var(--shadow)}.score-card{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;border-radius:var(--rounded-xl) var(--rounded-xl) 0 0;padding:30px 34px}.card-label,.score-max,.score-card strong,.final-score-card strong{font-family:DM Mono,monospace}.card-label{width:100%;color:var(--ink-soft);font-size:.74rem;letter-spacing:.06em}.score-card strong{color:var(--green);font-size:3.8rem;letter-spacing:-.09em;line-height:1}.score-max{color:var(--ink-soft);font-size:.8rem}.rules-card{margin-top:12px;border-radius:0 0 var(--rounded-xl) var(--rounded-xl);padding:28px 34px 30px}.rules-card-heading{display:flex;align-items:center;gap:9px;color:var(--green);font-family:DM Mono,monospace;font-size:.74rem;letter-spacing:.08em}.mini-dot,.footnote-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 5px #ed80561f}.rules-card ul{display:flex;gap:26px;margin:27px 0 22px;padding:0;list-style:none}.rules-card li{display:flex;flex-direction:column;gap:6px}.rules-card li strong{font-family:DM Mono,monospace;font-size:1.45rem;letter-spacing:-.08em}.rules-card li span{color:var(--ink-soft);font-size:.72rem}.rules-card p{margin:0;color:var(--ink-soft);font-size:.8rem;line-height:1.7}.keyboard-hint{margin:20px 0 0;color:var(--ink-soft);font-family:DM Mono,monospace;font-size:.65rem}kbd{display:inline-block;border:1px solid var(--line);border-bottom-width:2px;border-radius:4px;padding:2px 5px;color:var(--green);background:var(--white);font-family:inherit;font-size:.65rem}.loading-orbit{position:relative;width:80px;height:80px;margin-bottom:40px;animation:rotate 2.8s linear infinite}.loading-orbit span{position:absolute;width:14px;height:14px;border-radius:50%;background:var(--green-bright)}.loading-orbit span:nth-child(1){top:0;left:33px}.loading-orbit span:nth-child(2){right:0;bottom:10px;background:var(--orange)}.loading-orbit span:nth-child(3){bottom:0;left:7px;background:var(--yellow)}.status-icon{display:grid;place-items:center;width:58px;height:58px;margin-bottom:28px;border-radius:50%;color:var(--white);background:var(--red);font-size:1.6rem;font-weight:800}.error-message{max-width:520px;margin:24px 0 30px;color:var(--red);font-size:.92rem;line-height:1.7}.game-screen{min-height:100vh}.game-header{display:grid;grid-template-columns:1fr auto minmax(220px,.7fr);align-items:end;gap:36px;width:min(1080px,calc(100% - 48px));margin:0 auto;padding:30px 0 20px}.brand-mark,.header-score span,.header-progress,.stage-type,.timer-label,.prompt-label,.stage-footnote,.feedback-answer-label,.stat-item span{font-family:DM Mono,monospace;font-size:.7rem;letter-spacing:.06em}.brand-mark{display:flex;align-items:center;gap:11px;color:var(--green);font-weight:500}.header-score{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.header-score span,.header-progress{color:var(--ink-soft)}.header-score strong{color:var(--green);font-family:DM Mono,monospace;font-size:1.25rem;letter-spacing:-.08em}.progress-label{display:flex;justify-content:space-between;margin-bottom:9px}.progress-label strong{color:var(--ink);font-weight:500}.progress-track,.timer-track{overflow:hidden;border-radius:99px;background:var(--paper-deep)}.progress-track{height:5px}.progress-fill,.timer-fill{display:block;height:100%;border-radius:inherit;background:var(--green-bright);transition:width .4s ease}.stage-main{width:min(760px,calc(100% - 48px));margin:clamp(52px,9vh,100px) auto 0}.stage-meta{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.round-badge{border-radius:99px;padding:7px 12px;color:var(--green);background:#42c9831f;font-family:DM Mono,monospace;font-size:.69rem}.stage-count{color:var(--ink-soft);font-family:DM Mono,monospace;font-size:.72rem}.timer-row{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:12px;margin-bottom:13px}.timer-label{color:var(--ink-soft)}.timer-value{min-width:32px;color:var(--green);font-family:DM Mono,monospace;font-size:.85rem;font-weight:500;transition:color .18s ease}.timer-value.timer-warning{color:var(--orange)}.timer-track{height:4px}.timer-fill{width:100%;background:var(--green);transition:width .12s linear,background .18s ease}.timer-fill-warning{background:var(--orange)}.stage-card{position:relative;min-height:440px;border:1px solid var(--line);border-radius:var(--rounded-xl);padding:28px clamp(24px,6vw,66px) 42px;background:#fffefac9;box-shadow:var(--shadow);animation:rise-in .42s ease both}.stage-card-typing{border-top:4px solid var(--green)}.stage-card-choice{border-top:4px solid var(--orange)}.stage-card-top{display:flex;align-items:center;justify-content:space-between}.stage-type{color:var(--ink-soft)}.speak-button{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:8px;padding:6px 9px;color:var(--green);background:transparent;font-size:.85rem;transition:background .16s ease}.speak-button:hover{background:#42c9831f}.speak-button span{font-size:.72rem}.prompt-block{margin:64px 0 48px;text-align:center}.prompt-label{display:block;margin-bottom:22px;color:var(--ink-soft)}.word-reveal{min-height:68px;color:var(--green);font-size:4.8rem;font-weight:800;letter-spacing:-.09em;line-height:1;opacity:0;transform:translateY(8px)}.word-reveal.is-revealed,.word-reveal.word-visible{opacity:1;transform:translateY(0);transition:opacity .26s ease,transform .26s ease}.word-reveal.word-partial{font-family:DM Mono,monospace;font-size:clamp(2.8rem,8vw,4.8rem);letter-spacing:.08em;white-space:pre}.stage-card-typing .word-reveal{-webkit-user-select:none;user-select:none}.definition-text{min-height:58px;color:var(--ink);font-size:1.35rem;font-weight:600;line-height:1.65}.prompt-tip{min-height:20px;margin:20px 0 0;color:var(--ink-soft);font-size:.78rem}.phonetic{margin-top:13px;color:var(--ink-soft);font-family:DM Mono,monospace;font-size:.78rem}.input-wrap{display:flex;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--white);box-shadow:0 7px 18px #1d35280d}.answer-input{min-width:0;flex:1;border:0;padding:17px 18px;color:var(--ink);background:transparent;font-size:1rem}.answer-input::placeholder{color:#a5aea7}.answer-input:focus{outline:0}.fill-form .input-wrap{border:0;box-shadow:none}.fill-row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;padding:6px 0 2px}.fill-cell{width:clamp(46px,9vw,62px);height:62px;border:2px dashed var(--line);border-radius:12px;color:var(--ink);background:var(--white);text-align:center;font-size:1.7rem;font-weight:700;text-transform:lowercase;caret-color:var(--green);transition:border .16s ease,box-shadow .16s ease,transform .16s ease}.fill-cell:focus{border-color:var(--green);border-style:solid;outline:0;box-shadow:0 0 0 3px #42c9832e;transform:translateY(-2px)}.fill-cell::selection{background:transparent}.fill-fixed{display:grid;place-items:center;min-width:30px;height:62px;color:var(--green);font-family:DM Mono,monospace;font-size:1.7rem;font-weight:800;-webkit-user-select:none;user-select:none;pointer-events:none}.fill-submit{display:block;width:56px;height:48px;margin:18px auto 0;border:0;border-radius:12px;color:var(--white);background:var(--green);font-size:1.3rem;transition:background .16s ease}.fill-submit:hover{background:var(--green-dark)}.submit-arrow{width:56px;border:0;color:var(--white);background:var(--green);font-size:1.3rem;transition:background .16s ease}.submit-arrow:hover{background:var(--green-dark)}.answer-help{margin:13px 0 0;color:var(--ink-soft);text-align:center;font-size:.72rem}.choice-list{display:grid;gap:10px}.choice-button{display:flex;align-items:center;gap:15px;width:100%;border:1px solid var(--line);border-radius:11px;padding:13px 15px;color:var(--ink);background:#fffefabf;text-align:left;font-size:.85rem;line-height:1.5;transition:border .16s ease,background .16s ease,transform .16s ease}.choice-button:hover{border-color:var(--green-bright);background:#42c98314;transform:translate(4px)}.choice-key{display:grid;flex:0 0 29px;place-items:center;width:29px;height:29px;border-radius:7px;color:var(--green);background:#42c98324;font-family:DM Mono,monospace;font-size:.75rem}.stage-footnote{display:flex;align-items:center;justify-content:center;gap:11px;margin:23px 0 0;color:var(--ink-soft);font-size:.67rem}.footnote-dot{width:5px;height:5px;box-shadow:none}.feedback-main{display:flex;flex-direction:column;align-items:center;width:min(600px,calc(100% - 48px));margin:clamp(60px,11vh,120px) auto 0;text-align:center;animation:rise-in .42s ease both}.feedback-icon{display:grid;place-items:center;width:80px;height:80px;margin-bottom:28px;border-radius:50%;color:var(--white);font-size:2.5rem;font-weight:700}.feedback-correct{background:var(--green-bright);box-shadow:0 12px 30px #42c98340}.feedback-wrong{background:var(--orange);box-shadow:0 12px 30px #ed805638}.feedback-main h1{font-size:4rem}.feedback-answer-label{margin:48px 0 12px;color:var(--ink-soft)}.feedback-word{color:var(--green);font-size:2rem;font-weight:800;letter-spacing:-.06em}.feedback-definition{max-width:520px;margin:14px 0 0;color:var(--ink-soft);font-size:.86rem;line-height:1.7}.feedback-score{display:flex;flex-direction:column;gap:7px;margin-top:42px;padding:18px 28px;border-radius:15px;color:var(--ink-soft);background:var(--paper-deep);font-family:DM Mono,monospace;font-size:.75rem}.feedback-score strong{color:var(--ink);font-size:1.8rem;letter-spacing:-.08em}.feedback-score-positive strong{color:var(--green)}.feedback-score small{font-size:.64rem}.next-hint{margin:30px 0 0;color:var(--ink-soft);font-family:DM Mono,monospace;font-size:.68rem;animation:pulse 1.1s ease-in-out infinite alternate}.result-screen{display:flex;align-items:center;justify-content:center}.result-main{width:min(660px,100%);text-align:center;animation:rise-in .52s ease both}.result-main h1{font-size:5rem}.title-dot{color:var(--orange)}.result-subtitle{margin:20px 0 38px;font-size:.9rem}.final-score-card{display:flex;flex-direction:column;align-items:center;gap:6px;border-radius:var(--rounded-xl);padding:30px 24px;background:var(--green);box-shadow:0 25px 50px #1d6b4c38}.final-score-card>span:first-child{color:#fffefab8;font-size:.75rem}.final-score-card strong{color:var(--white);font-size:5rem;letter-spacing:-.1em;line-height:1}.final-score-card .score-max,.final-score-card small{color:#fffefaa6}.new-best{margin-top:14px;color:var(--yellow);font-size:.75rem;letter-spacing:.04em}.stats-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin:24px 0 30px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--line)}.stat-item{display:flex;flex-direction:column;gap:9px;min-width:0;padding:17px 5px;background:#fffefaa6}.stat-item strong{font-family:DM Mono,monospace;font-size:1.15rem;letter-spacing:-.08em;white-space:nowrap}.stat-item strong small{color:var(--ink-soft);font-size:.65em}.stat-item span{overflow:hidden;color:var(--ink-soft);font-size:.61rem;text-overflow:ellipsis;white-space:nowrap}.result-main .button{margin:0 auto}@keyframes rise-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes pulse{0%{opacity:.45}to{opacity:1}}@media(max-width:760px){.screen{width:min(100% - 32px,620px);padding:34px 0}.start-screen{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:64px}.start-copy h1{font-size:clamp(3.7rem,18vw,5.8rem);letter-spacing:.02em}.start-panel{padding-top:0}.game-header{grid-template-columns:1fr auto;gap:20px;width:min(100% - 32px,620px);padding-top:20px}.header-progress{grid-column:1 / -1;grid-row:2}.stage-main{width:min(100% - 32px,620px);margin-top:44px}.stage-card{min-height:420px;padding-right:20px;padding-left:20px}.prompt-block{margin-top:54px}.feedback-main{width:min(100% - 32px,620px);margin-top:65px}.stats-grid{grid-template-columns:repeat(3,1fr)}.stat-item:nth-child(4),.stat-item:nth-child(5){grid-column:span 1}}@media(max-width:450px){.hero-description{margin-top:25px}.rules-card,.score-card{padding-right:22px;padding-left:22px}.rules-card ul{justify-content:space-between;gap:12px}.keyboard-hint{text-align:center}.timer-row{grid-template-columns:auto auto}.timer-track{grid-column:1 / -1;grid-row:2}.stage-card{min-height:400px;padding-top:22px}.stage-card-top{align-items:flex-start}.speak-button span{display:none}.prompt-block{margin:48px 0 38px}.definition-text{font-size:1rem}.word-reveal{font-size:3.5rem}.fill-cell,.fill-fixed{width:40px;height:48px;font-size:1.3rem}.fill-row{gap:7px}.choice-button{padding:11px 10px;font-size:.78rem}.stats-grid{grid-template-columns:repeat(2,1fr)}.stat-item:last-child{grid-column:1 / -1}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
