:root{--c-primary: #143d55;--c-accent: #ffe246;--c-bg: #faf8ef;--c-surface: #ffffff;--c-text: #18343f;--c-muted: #526471;--c-border: #d6e1e5;--c-success: #146a60;--c-danger: #a13535;--c-accent-soft: #fff6c2;--c-primary-soft: #e7eff3;--font: system-ui, -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;--fs-body: 18px;--fs-caption: 14px;--fs-heading: 28px;--fs-fraction: 36px;--tap: 48px;--radius: 16px;--max: 1024px;--s1: 4px;--s2: 8px;--s3: 12px;--s4: 16px;--s5: 24px;--s6: 32px;--s7: 48px;--anim: .18s;color-scheme:light}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;background:var(--c-bg);color:var(--c-text);font-family:var(--font);font-size:var(--fs-body);line-height:1.7;overflow-wrap:anywhere}h1,h2,h3{line-height:1.35;margin:0 0 var(--s3);color:var(--c-primary)}h1{font-size:var(--fs-heading)}h2{font-size:22px}h3{font-size:19px}p{margin:0 0 var(--s3)}a{color:var(--c-primary)}small,.caption{font-size:var(--fs-caption);color:var(--c-muted)}ul{padding-left:1.2em;margin:0 0 var(--s3)}.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:focus-visible{outline:3px solid var(--c-primary);outline-offset:3px;box-shadow:0 0 0 6px var(--c-accent);border-radius:8px}.skip-link{position:absolute;left:var(--s2);top:-100px;background:var(--c-surface);padding:var(--s2) var(--s4);z-index:10}.skip-link:focus{top:var(--s2)}.app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.header{background:var(--c-primary);color:#fff;padding:calc(var(--s3) + env(safe-area-inset-top)) var(--s4) var(--s3)}.header-inner{max-width:var(--max);margin:0 auto;display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap}.brand{display:flex;flex-direction:column;color:#fff;text-decoration:none;line-height:1.3;margin-right:auto;min-height:var(--tap);justify-content:center}.brand-park{font-size:var(--fs-caption);color:var(--c-accent)}.brand-title{font-size:22px;font-weight:700}.learner-switch{display:flex;align-items:center;gap:var(--s2);font-size:var(--fs-caption)}.learner-switch select{min-height:var(--tap);font-size:16px;border-radius:12px;border:2px solid var(--c-accent);padding:0 var(--s3);background:var(--c-surface);color:var(--c-text)}.main{flex:1;width:100%;max-width:var(--max);margin:0 auto;padding:var(--s5) var(--s4) calc(var(--s7) + env(safe-area-inset-bottom))}.footer{border-top:1px solid var(--c-border);padding:var(--s4) var(--s4) calc(var(--s4) + env(safe-area-inset-bottom));font-size:var(--fs-caption)}.footer-inner{max-width:var(--max);margin:0 auto;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);align-items:center}.footer a{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 var(--s2)}.stack>*+*{margin-top:var(--s4)}.row{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center}.grid-2{display:grid;gap:var(--s4)}@media(min-width:768px){.grid-2{grid-template-columns:minmax(0,3fr) minmax(0,2fr);align-items:start}}.card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);padding:var(--s5) var(--s4)}.card-accent{border:2px solid var(--c-primary);box-shadow:6px 6px 0 var(--c-accent)}.card h2:first-child,.card h3:first-child{margin-top:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:var(--tap);min-width:var(--tap);padding:var(--s2) var(--s5);border-radius:999px;border:2px solid var(--c-primary);background:var(--c-surface);color:var(--c-primary);font:inherit;font-weight:700;text-decoration:none;cursor:pointer;transition:transform var(--anim),background-color var(--anim);text-align:center;line-height:1.35}.btn:hover{background:var(--c-primary-soft)}.btn:active{transform:translateY(1px)}.btn[disabled],.btn[aria-disabled=true]{opacity:.5;cursor:not-allowed;transform:none}.btn-primary{background:var(--c-accent);color:var(--c-primary);box-shadow:0 3px 0 var(--c-primary)}.btn-primary:hover{background:#ffeb7a}.btn-dark{background:var(--c-primary);color:#fff}.btn-dark:hover{background:#1d5373}.btn-danger{border-color:var(--c-danger);color:var(--c-danger)}.btn-quiet{border-color:transparent;background:transparent;text-decoration:underline;font-weight:600}.btn-block{width:100%}.btn-big{font-size:22px;min-height:64px}.btn-emph{outline:3px dashed var(--c-primary);outline-offset:2px}.btn-row{display:flex;flex-wrap:wrap;gap:var(--s3)}.banner{display:flex;gap:var(--s3);align-items:center;flex-wrap:wrap;border-radius:12px;padding:var(--s3) var(--s4);margin-bottom:var(--s4);border:2px solid var(--c-primary);background:var(--c-accent-soft)}.banner p{margin:0;flex:1 1 220px}.banner-warn{border-color:var(--c-danger);background:#fbeaea}.fraction{display:inline-flex;flex-direction:column;align-items:center;vertical-align:middle;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;color:var(--c-primary)}.fraction-num,.fraction-den{font-size:var(--fs-fraction);padding:0 .15em;min-width:1.2em;text-align:center}.fraction-bar{width:100%;min-width:1.4em;height:4px;background:currentColor;border-radius:2px;margin:4px 0}.fraction-sm .fraction-num,.fraction-sm .fraction-den{font-size:26px}.fraction-labeled{display:inline-grid;grid-template-columns:auto auto;align-items:center;column-gap:var(--s3)}.fraction-labels{display:flex;flex-direction:column;justify-content:space-between;height:100%;font-size:var(--fs-caption);color:var(--c-muted);gap:22px;text-align:right}.progress-line{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);flex-wrap:wrap;margin-bottom:var(--s3)}.progress-count{font-weight:700;font-size:20px;color:var(--c-primary)}.skill-tag{display:inline-block;font-size:var(--fs-caption);background:var(--c-primary-soft);color:var(--c-primary);border-radius:999px;padding:2px var(--s3);font-weight:700}.prompt-target{display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap;margin:var(--s3) 0}.target-box{display:inline-flex;align-items:center;gap:var(--s3);background:var(--c-accent-soft);border:2px solid var(--c-primary);border-radius:var(--radius);padding:var(--s3) var(--s4)}.target-label{font-weight:700;font-size:var(--fs-caption)}.choices{border:0;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}@media(min-width:560px){.choices{grid-template-columns:repeat(4,minmax(0,1fr))}}.choice{position:relative;display:flex;align-items:center;justify-content:center;min-height:120px;border:2px solid var(--c-border);border-radius:var(--radius);background:var(--c-surface);cursor:pointer}.choice input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}.choice:has(input:checked){border-color:var(--c-primary);background:var(--c-accent-soft);box-shadow:inset 0 0 0 2px var(--c-primary)}.choice:has(input:focus-visible){outline:3px solid var(--c-primary);outline-offset:3px}.choice-mark{position:absolute;top:6px;left:10px;font-size:var(--fs-caption);font-weight:700}.choice:has(input:disabled){cursor:default}.compose-area{display:grid;gap:var(--s3)}.slot-row{display:grid;grid-template-columns:6.5em minmax(0,1fr) auto;align-items:center;gap:var(--s3);padding:var(--s2) var(--s3);border-radius:12px;border:2px dashed var(--c-border);min-height:92px}.slot-row.is-target{border-color:var(--c-primary);border-style:solid;background:var(--c-accent-soft)}.slot-label{font-weight:700;font-size:16px;color:var(--c-primary)}.slot-cards{display:flex;flex-wrap:wrap;gap:var(--s2);min-height:72px;align-items:center}.slot-value{font-size:26px;font-weight:700;color:var(--c-primary);min-width:2.5em;text-align:right}.slot-divider{height:4px;background:var(--c-primary);border-radius:2px}.place-toggle{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}.place-toggle button[aria-checked=true]{background:var(--c-primary);color:#fff}.hand{display:flex;flex-wrap:wrap;gap:var(--s2)}.num-card{width:56px;height:76px;border-radius:10px;border:2px solid var(--c-primary);background:var(--c-surface);font-size:32px;font-weight:800;color:var(--c-primary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 3px 0 var(--c-primary);font-family:var(--font);transition:transform var(--anim);position:relative}.num-card:after{content:"";position:absolute;bottom:10px;width:22px;height:3px;background:var(--c-primary);border-radius:2px;opacity:.35}.num-card:hover{transform:translateY(-2px)}.num-card.is-placed{background:var(--c-accent)}.num-card[disabled]{opacity:.4;cursor:not-allowed;transform:none}.reduce-inputs{display:inline-grid;grid-template-columns:auto 7em;gap:var(--s2) var(--s3);align-items:center}.reduce-inputs label{font-weight:700;color:var(--c-primary);text-align:right}.reduce-inputs input,.text-input{font-size:30px;font-weight:700;text-align:center;min-height:56px;width:100%;border:2px solid var(--c-primary);border-radius:12px;background:var(--c-surface);color:var(--c-text);font-family:var(--font)}.reduce-bar{grid-column:2;height:4px;background:var(--c-primary);border-radius:2px}.feedback{border-radius:12px;padding:var(--s3) var(--s4);border:2px solid var(--c-border);background:var(--c-surface)}.feedback:empty{display:none}.feedback-correct{border-color:var(--c-success);color:var(--c-success);background:#e9f5f2}.feedback-wrong{border-color:var(--c-danger);color:var(--c-text);background:#fbeaea}.feedback-info{border-color:var(--c-primary);background:var(--c-primary-soft)}.feedback strong{display:block;font-size:20px}.hint-box{border-left:6px solid var(--c-accent);background:var(--c-surface);padding:var(--s3) var(--s4);border-radius:0 12px 12px 0}.answer-box{border:2px solid var(--c-success);border-radius:12px;padding:var(--s3) var(--s4);background:#e9f5f2}.sticky-actions{position:sticky;bottom:0;padding:var(--s3) 0 calc(var(--s3) + env(safe-area-inset-bottom));background:linear-gradient(to bottom,rgba(250,248,239,0),var(--c-bg) 30%);z-index:2}.result-list{list-style:none;padding:0;margin:0;display:grid;gap:var(--s2)}.result-item{display:flex;align-items:center;gap:var(--s3);padding:var(--s3) var(--s4);background:var(--c-surface);border:1px solid var(--c-border);border-radius:12px;flex-wrap:wrap}.outcome-badge{display:inline-flex;align-items:center;gap:6px;font-weight:700;border-radius:999px;padding:2px var(--s3);border:2px solid var(--c-primary);background:var(--c-surface);white-space:nowrap}.outcome-independent{background:var(--c-accent)}.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--s1);list-style:none;padding:0;margin:0;text-align:center}.week li{font-size:var(--fs-caption);display:flex;flex-direction:column;align-items:center}.day-mark{width:36px;height:36px;border-radius:50%;border:2px solid var(--c-border);display:inline-flex;align-items:center;justify-content:center;font-weight:700;background:var(--c-surface)}.day-mark.done{background:var(--c-accent);border-color:var(--c-primary);color:var(--c-primary)}.table{width:100%;border-collapse:collapse;font-size:16px}.table th,.table td{border-bottom:1px solid var(--c-border);padding:var(--s2);text-align:left;vertical-align:top}fieldset.group{border:1px solid var(--c-border);border-radius:12px;padding:var(--s3) var(--s4);margin:0 0 var(--s3)}fieldset.group legend{font-weight:700;padding:0 var(--s2);color:var(--c-primary)}.radio-row{display:flex;flex-wrap:wrap;gap:var(--s2)}.radio-pill{display:inline-flex;align-items:center;gap:var(--s2);min-height:var(--tap);padding:0 var(--s4);border:2px solid var(--c-border);border-radius:999px;cursor:pointer;background:var(--c-surface)}.radio-pill:has(input:checked){border-color:var(--c-primary);background:var(--c-accent-soft);font-weight:700}.radio-pill input,.check input{width:22px;height:22px;accent-color:var(--c-primary)}.check{display:inline-flex;align-items:center;gap:var(--s2);min-height:var(--tap);cursor:pointer}.digit-pad{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s2);max-width:360px}.digit-pad button{min-height:56px;font-size:24px}.num-input-pair{display:flex;gap:var(--s3);align-items:flex-end;flex-wrap:wrap}.num-input-pair label{display:flex;flex-direction:column;font-weight:700;color:var(--c-primary);width:7em}details.faq{background:var(--c-surface);border:1px solid var(--c-border);border-radius:12px;margin-bottom:var(--s2)}details.faq summary{cursor:pointer;padding:var(--s3) var(--s4);min-height:var(--tap);font-weight:700;color:var(--c-primary)}details.faq>div{padding:0 var(--s4) var(--s3)}.dialog-backdrop{position:fixed;inset:0;background:#143d558c;display:flex;align-items:center;justify-content:center;padding:var(--s4);z-index:50}.dialog{background:var(--c-surface);border-radius:var(--radius);padding:var(--s5) var(--s4);max-width:520px;width:100%;max-height:calc(100dvh - 32px);overflow:auto;border:2px solid var(--c-primary)}.longpress{position:relative;overflow:hidden}.longpress-fill{position:absolute;left:0;bottom:0;height:6px;background:var(--c-primary);width:0}.longpress.is-pressing .longpress-fill{width:100%;transition:width 2s linear}.photo{width:100%;height:auto;border-radius:12px;display:block;background:var(--c-primary-soft)}.photo-fallback{border-radius:12px;background:var(--c-primary-soft);padding:var(--s5);text-align:center;color:var(--c-muted)}.steps-dots{display:flex;gap:var(--s2);list-style:none;padding:0;margin:0 0 var(--s3)}.steps-dots li{width:12px;height:12px;border-radius:50%;border:2px solid var(--c-primary)}.steps-dots li.current{background:var(--c-primary)}.deck-illustration{display:flex;gap:var(--s4);align-items:flex-end;flex-wrap:wrap}.deck-stack{width:64px;height:86px;border-radius:10px;border:2px solid var(--c-primary);background:repeating-linear-gradient(45deg,var(--c-primary),var(--c-primary) 6px,#1d5373 6px,#1d5373 12px);box-shadow:4px 4px 0 var(--c-border),8px 8px 0 var(--c-border)}@media(max-width:380px){.slot-row{grid-template-columns:1fr auto}.slot-label{grid-column:1 / -1}.num-card{width:50px;height:68px;font-size:28px}.btn{padding:var(--s2) var(--s4)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}.longpress.is-pressing .longpress-fill{transition:none!important;width:100%}}h1[tabindex="-1"]:focus,main[tabindex="-1"]:focus{outline:none;box-shadow:none}
