:root{--bg:#f5f3eb;--paper:#fffdfa;--ink:#304844;--muted:#546d66;--line:#b9cbc6;--green:#366c61;--soft:#edf5f1;--orange:#9a502d;--focus:#155f9a}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:1rem}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Yu Gothic","Hiragino Kaku Gothic ProN","Noto Sans JP",system-ui,sans-serif;font-size:1rem;line-height:1.85}
a{color:var(--green);text-underline-offset:.2em}
button,input,select,textarea{font:inherit}
button,select,summary{cursor:pointer}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
[hidden]{display:none!important}
.skip-link{position:absolute;top:-10rem;left:1rem;padding:1rem;background:white;z-index:10001}.skip-link:focus{top:1rem}
.practice-shell{max-width:960px;margin:auto;padding:16px 16px 48px}
.practice-nav{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:18px}
.practice-nav a,.button{display:inline-flex;justify-content:center;align-items:center;min-height:44px;padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--green);font-size:1rem;font-weight:600;text-decoration:none;line-height:1.6;text-align:center}
.button:hover,.practice-nav a:hover{background:var(--soft);border-color:var(--green)}
.button.primary{background:var(--green);border-color:var(--green);color:#fff}.button.primary:hover{background:#28554b}
.practice-header{padding:20px 24px;border:1px solid var(--line);border-radius:20px;background:var(--paper)}
.eyebrow{margin:0;color:var(--muted);font-size:.875rem;letter-spacing:.08em}
h1{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(1.75rem,4vw,2.35rem);line-height:1.4;font-weight:600;margin:5px 0}
h2{font-size:1.5rem;line-height:1.5;margin:0 0 16px}h3{font-size:1.2rem;line-height:1.5;margin:0}h4{font-size:1rem;margin:20px 0 8px}
p{margin:8px 0 12px}.intro{margin-bottom:0}.small-note{font-size:.875rem;color:var(--muted)}
.download-bar{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0 8px}
.start-guide{background:var(--soft);border:1px solid var(--line);border-radius:16px;padding:18px 22px;margin:22px 0}
.start-guide h2{font-size:1.2rem;margin-bottom:8px}.guide-grid{display:grid;grid-template-columns:200px minmax(0,1fr);gap:20px;align-items:center}
.cube{display:block;width:200px;max-width:100%;height:auto;margin:0 auto;color:var(--ink)}
.guide-list{padding-left:1.2em;margin:0}.guide-list li+li{margin-top:5px}.direction-key{padding-top:10px;margin-top:10px;border-top:1px solid var(--line)}
.jump-links{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.jump-links a{padding:8px 12px;background:var(--paper);border:1px solid var(--line);border-radius:9px;text-decoration:none;font-size:.9375rem}
.progress-line{font-size:.9375rem;color:var(--muted);margin:10px 0 22px}
.level-section{margin-top:32px}.section-heading{display:flex;align-items:center;gap:10px}.section-heading .range{font-size:1rem;color:var(--muted);font-weight:400}
.question{border:1px solid var(--line);border-radius:18px;background:var(--paper);padding:24px;margin:18px 0;scroll-margin-top:16px}
.question-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px}.question-number{flex:none;display:grid;place-items:center;min-width:42px;min-height:42px;border-radius:12px;background:var(--soft);font-weight:750;color:var(--green);font-size:1.2rem}.question-level{font-size:.875rem;color:var(--muted)}
.prompt p{margin:8px 0}.exception{border-left:4px solid var(--orange);padding:10px 14px;background:#fff2e8;border-radius:0 8px 8px 0}
.question-directions{font-size:.875rem;color:var(--muted);margin:12px 0}
.route-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px;margin:18px 0}
.route-figure{margin:0;border:1px solid #d9e3df;border-radius:12px;background:#fff;padding:12px;min-width:0}
figcaption{font-size:.9375rem;font-weight:600;line-height:1.7;margin-bottom:6px}
.diagram-scroll{overflow-x:auto;max-width:100%;padding-bottom:3px;overscroll-behavior-x:contain}
.route-svg{display:block;width:100%;min-width:var(--diagram-min,240px);max-width:var(--diagram-width,600px);height:auto;margin:auto}
.diagram-help{font-size:.875rem;color:var(--muted);margin:4px 0 0}.goal-guide{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:16px 0}.goal-guide .cube{margin:0;width:180px}
.answer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,155px),1fr));gap:12px;margin-top:18px}
.answer-field{padding:10px 12px 8px;background:#f7f9f7;border:1px solid #d8e1db;border-radius:10px;min-width:0}
.answer-field label{display:block;font-weight:600;font-size:.9375rem;margin-bottom:6px;overflow-wrap:anywhere}
.answer-field input,.answer-field select{width:100%;min-height:46px;border:1px solid #8fa79e;background:white;border-radius:7px;padding:6px 10px;color:var(--ink)}
.field-hint{display:block;min-height:1.5em;font-size:.875rem;line-height:1.5;margin-top:6px}
.answer-field[data-state=right]{border-color:#487c59;background:#eff8f0}.answer-field[data-state=retry]{border-color:#a55530;background:#fff6ee}.answer-field[data-state=retry] .field-hint{color:#924020}
.reason-field{display:block;margin:18px 0 6px}.reason-field label{display:block;font-weight:600;margin-bottom:6px}.reason-field textarea{display:block;width:100%;min-height:105px;resize:vertical;border:1px solid #8fa79e;border-radius:9px;background:white;padding:12px;color:var(--ink)}
.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:18px}
.check-feedback{margin:12px 0 0;line-height:1.7;min-height:1.7em}.check-feedback[data-state=retry]{color:#924020}.check-feedback[data-state=right]{color:#28613d}
.earned-medal{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(173,123,34,.5);background:rgba(239,205,112,.2);color:#71501a;border-radius:999px;padding:4px 12px;font-size:.9375rem}
.solution{border-top:1px dashed var(--line);margin-top:18px;padding-top:12px}.solution summary{font-weight:600;color:var(--green);min-height:44px;padding:6px 0}.solution-body{padding-top:4px}.answer-summary{background:var(--soft);border-radius:10px;padding:12px 16px}.answer-summary ul{margin:5px 0;padding-left:1.3em}
.table-scroll{overflow-x:auto;margin:12px 0;max-width:100%}table{border-collapse:collapse;width:100%;font-size:.9375rem}th,td{border:1px solid var(--line);padding:7px 10px;text-align:center}th{background:var(--soft);font-weight:600}th:first-child,td:first-child{text-align:left}td{background:white}.check-table{min-width:285px}
.bottom-summary{margin-top:30px;padding:18px 22px;border:1px solid var(--line);border-radius:16px;background:var(--paper)}.bottom-summary h2{font-size:1.2rem}.page-footer{font-size:.875rem;color:var(--muted);text-align:center;margin-top:30px}
@media(max-width:560px){.practice-shell{padding:10px 12px 36px}.practice-header,.question,.start-guide{padding:16px}.guide-grid{grid-template-columns:1fr;gap:6px}.guide-grid .cube{width:170px}.download-bar{flex-direction:column}.download-bar a{width:100%;border-radius:10px}.question-head{gap:9px}.answer-grid{gap:8px}.route-grid{grid-template-columns:1fr}.route-figure{padding:8px}.actions .button{flex:1 1 125px}.practice-nav a{padding:8px 12px}.section-heading{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{body{background:#fff;color:#000;font-size:11pt}.practice-shell{max-width:none;padding:0}.practice-nav,.download-bar,.jump-links,.actions,.check-feedback,.earned-medal,.page-footer,.skip-link,.progress-line,.bottom-summary{display:none!important}.practice-header,.start-guide,.question{background:white;box-shadow:none;border-color:#888}.question{break-inside:avoid;padding:12pt}.solution{display:none}.answer-field{background:white;border-color:#aaa}.answer-field input{border-color:#aaa}.field-hint{display:none}.diagram-scroll{overflow:visible}.route-svg{min-width:0}.level-section{break-before:page}.level-section:first-of-type{break-before:auto}a{color:inherit;text-decoration:none}}