@font-face{font-family:Andika;src:url('/assets/fonts/Andika-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Andika;src:url('/assets/fonts/Andika-Bold.ttf') format('truetype');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:'Higure Gothic';src:local('Higure Gothic Bold'),local('HigureGothic-Bold');font-style:normal;font-weight:700;font-display:swap}
:root{--study-red:#d43b36;--study-ink:#1d1d1d;--study-muted:#666;--study-line:#e7e4e1}
body.study-page{margin:0;min-height:100vh;background:#faf9f7;color:var(--study-ink);font-family:Andika,system-ui,sans-serif}
.study-page *{box-sizing:border-box}
.study-page .skip{position:absolute;left:-9999px;top:10px;background:#fff;padding:12px;z-index:20}.study-page .skip:focus{left:10px}
.study-header{height:76px;background:#fff;border-bottom:1px solid var(--study-line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,4vw,52px);gap:20px}
.study-brand{color:#161616;text-decoration:none;font-size:26px;font-weight:700;letter-spacing:-1.5px;white-space:nowrap}.study-brand span,.card-brand span{color:var(--study-red)}
.study-return{color:#4f4f4f;text-decoration:none;font-size:14px;font-weight:700}.study-return:hover{text-decoration:underline}
.study-main{max-width:1150px;margin:0 auto;padding:24px 24px 72px}
.study-intro{max-width:650px;margin:0 auto 18px;text-align:center}.study-kicker{font-size:12px;font-weight:700;letter-spacing:.11em;color:#ad312d;text-transform:uppercase}.study-intro h1{font-size:clamp(30px,4vw,48px);line-height:1.15;letter-spacing:-.04em;margin:9px 0 8px}.study-intro p{color:var(--study-muted);margin:0;font-size:15px}
.study-toolbar{max-width:650px;margin:0 auto 14px;display:flex;justify-content:space-between;align-items:end;gap:20px}.study-toolbar fieldset{border:0;padding:0;margin:0;min-width:0}.study-toolbar legend{font-size:13px;font-weight:700;margin-bottom:9px}.language-options{display:flex;border:1px solid #d5d1ce;border-radius:12px;background:#fff;padding:4px;gap:3px}.language-options button{font:700 13px Andika,system-ui,sans-serif;background:transparent;color:#444;border:0;border-radius:8px;padding:9px 13px;cursor:pointer;white-space:nowrap}.language-options button[aria-pressed=true]{background:#202020;color:#fff}.language-options button:focus-visible,.study-page button:focus-visible,.study-page a:focus-visible{outline:3px solid #f3a9a5;outline-offset:3px}
.study-progress-copy{font-size:14px;font-weight:700;color:#555;white-space:nowrap;padding-bottom:10px}.study-progress{max-width:650px;height:6px;margin:0 auto 16px;background:#e9e6e2;border-radius:99px;overflow:hidden}.study-progress span{display:block;height:100%;width:0;background:var(--study-red);border-radius:inherit;transition:width .2s}
.study-card{display:block;position:relative;width:min(100%,650px);aspect-ratio:1.48;margin:0 auto;padding:0;border:0;background:transparent;cursor:pointer;text-align:center;perspective:1000px;touch-action:pan-y}.study-card-inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.2,.7,.2,1)}.study-card.is-revealed .study-card-inner{transform:rotateY(180deg)}.study-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#fff;border:4px solid #e41d2d;border-radius:clamp(22px,4vw,42px);box-shadow:0 12px 34px #24201c14;padding:22px 36px 58px}.study-face-back{transform:rotateY(180deg)}.study-art{display:block;max-width:72%;max-height:79%;width:auto;height:auto;object-fit:contain}.study-answer{display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;width:100%;overflow-wrap:anywhere}.study-answer-en{font:700 clamp(27px,5vw,58px)/1.17 Andika,system-ui,sans-serif}.study-answer-ja{font:700 clamp(25px,4.5vw,51px)/1.22 'Higure Gothic','Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif}.study-answer.is-both .study-answer-en{font-size:clamp(23px,4vw,47px)}.study-answer.is-both .study-answer-ja{font-size:clamp(22px,3.6vw,43px);color:#bd3530}.card-brand{position:absolute;bottom:15px;left:0;right:0;font:700 15px Andika,system-ui,sans-serif;letter-spacing:-.03em}.study-face-back .card-brand{transform:rotateY(0)}
.study-hint{text-align:center;font-size:13px;color:#777;margin:16px 0 20px}.study-actions{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}.study-actions button{font:700 15px Andika,system-ui,sans-serif;cursor:pointer;border-radius:12px;min-height:47px;padding:9px 22px}.study-secondary{background:#fff;border:1px solid #d8d4d0;color:#252525}.study-primary{background:var(--study-red);border:1px solid var(--study-red);border-bottom:4px solid #a92b27;color:white;min-width:126px}.study-actions button:disabled{opacity:.43;cursor:not-allowed}.study-utility{display:flex;justify-content:center;gap:16px;margin-top:17px}.study-utility button{font:700 13px Andika,system-ui,sans-serif;background:transparent;border:0;color:#595959;text-decoration:underline;cursor:pointer;padding:5px}.study-status{text-align:center;min-height:22px;color:#6b6967;font-size:13px;margin:10px 0 0}.study-error{max-width:600px;margin:50px auto;background:white;border:1px solid #e4dfdb;border-radius:18px;padding:24px;text-align:center}.study-error[hidden],.study-shell[hidden]{display:none}
.study-answer-ja ruby{ruby-align:center}.study-answer-ja rt{font-size:.31em;line-height:1.3;color:#555}
@media(max-width:650px){.study-header{height:64px}.study-brand{font-size:22px}.study-return{font-size:12px}.study-main{padding:25px 14px 64px}.study-toolbar{align-items:stretch;flex-direction:column;gap:9px}.study-progress-copy{padding:0;text-align:center}.language-options{width:100%}.language-options button{flex:1;padding:9px 5px;font-size:12px}.study-card{aspect-ratio:1.2}.study-face{border-width:3px;padding:12px 16px 40px}.study-art{max-width:83%;max-height:76%}.card-brand{bottom:10px;font-size:12px}.study-actions button{flex:1}.study-primary{min-width:0}}
@media(prefers-reduced-motion:reduce){.study-card-inner,.study-progress span{transition:none}}