:root{font-family:"BIZ UDPGothic","Yu Gothic",Meiryo,sans-serif;color:#203b46;background:#f6f8f7;font-size:18px;line-height:1.7;--green:#226b66;--blue:#286d97;--line:#dce6e3}*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer;border:1px solid #b8cdca;border-radius:12px;background:white;color:inherit;padding:12px 22px;min-height:50px;font-weight:700}button:hover{background:#edf5f2;border-color:var(--green)}button:focus-visible,[tabindex]:focus-visible{outline:4px solid #e7ae32;outline-offset:4px}button:disabled{cursor:default;opacity:.55}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(1.85rem,3.8vw,2.8rem);line-height:1.4;letter-spacing:.025em}h2{font-size:1.65rem;line-height:1.5}h3{font-size:1.15rem}small,.muted{color:#5c727a}small{font-size:.78rem}.header{max-width:1240px;margin:auto;padding:20px 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;border:0;background:none;padding:0;text-align:left;font-size:1.1rem}.brand small{display:block;font-weight:400}.brand-icon{display:grid;place-items:center;background:var(--green);color:white;width:44px;height:44px;border-radius:13px;font-size:30px}.privacy{font-size:.72rem;color:#5c727a}main{max-width:1160px;margin:0 auto;padding:40px 28px;min-height:75vh}main:focus{outline:none}.eyebrow{font-size:.78rem;letter-spacing:.1em;color:var(--green);font-weight:700;margin-bottom:16px}.hero{display:grid;grid-template-columns:1fr 1.12fr;gap:40px;align-items:center}.hero-copy{padding:10px 0 20px}.hero-copy p{max-width:430px}.lead{font-size:1.08rem}.primary{background:var(--green);color:white;border-color:var(--green)}.primary:hover{background:#18554f;color:white}.secondary{color:var(--green);background:#edf5f2}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}.hero .primary{width:100%;max-width:405px;padding:17px}.note{font-size:.8rem;color:#60727a}.map-panel{position:relative;background:#edf4f5;border:1px solid #dbe7e7;border-radius:24px;padding:15px;overflow:hidden}.map-panel .map{width:100%;max-height:560px;display:block}.map-tag{position:absolute;top:20px;left:22px;font-size:.73rem;color:#47717b;letter-spacing:.08em}.region{fill:#d9e8df;stroke:#fff;stroke-width:1.9;stroke-linejoin:round;fill-rule:evenodd;vector-effect:non-scaling-stroke}.region.color-0{fill:#b6d7cf}.region.color-1{fill:#d7e4b5}.region.color-2{fill:#c2dbe9}.region.color-3{fill:#b9d8c6}.region.color-4{fill:#dfd8b8}.region.color-5{fill:#c6ded1}.region.color-6{fill:#c9dce5}.interactive .region{cursor:pointer;stroke:#71978e;stroke-width:1.3}.interactive .region:hover{fill:#b8d8ec}.region.correct{fill:#76c7a3!important;stroke:#226b66;stroke-width:2.4}.region.chosen{fill:#e9cf95!important}.map text{font-weight:700;font-size:18px;fill:#304f53;pointer-events:none;paint-order:stroke;stroke:#fff;stroke-width:3px}.map .compass{font-size:17px;stroke:none;fill:#65818a}.map .water{font-size:17px;fill:#76969f;font-weight:400;stroke:none}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}.step,.card{background:white;border:1px solid var(--line);border-radius:16px;padding:22px}.step{display:flex;gap:14px;font-size:.84rem}.step b{display:block;font-size:.95rem}.step-number{border-radius:50%;background:#e7f1ed;color:var(--green);height:34px;min-width:34px;text-align:center;line-height:34px;font-weight:700}.topline{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:20px}.text-button{border:0;background:none;font-weight:400;padding:7px 8px;min-height:44px;color:#486771;font-size:.8rem;text-decoration:underline;text-underline-offset:4px}.progress{height:8px;border-radius:9px;background:#e0e9e6;overflow:hidden;margin:14px 0 28px}.progress-fill{height:100%;background:var(--green)}.question-layout{display:grid;grid-template-columns:minmax(270px,.85fr) minmax(300px,1.15fr);gap:28px;align-items:start}.question-info{padding:14px 0}.question-info h1{font-size:1.75rem}.choices{display:grid;gap:12px;margin-top:24px}.choices button{text-align:left}.feedback{background:#eef7f1;border:1px solid #b5d7c3;border-radius:14px;padding:18px;margin-top:18px}.feedback p:last-child{margin-bottom:0}.hint{border-left:4px solid #a9c4dd;background:#eff5fb;padding:14px 18px;margin-top:15px}.silhouette{width:100%;height:200px;background:#f5f8f6;border-radius:14px;padding:20px}.silhouette path{fill:#427c72;fill-rule:evenodd}.game-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}.game-card{display:flex;flex-direction:column;position:relative}.game-card p{font-size:.85rem;flex:1}.game-card button{width:100%}.game-icon{font-size:1.7rem;color:var(--green);margin-bottom:12px}.badge{display:inline-block;background:#e5f2e8;color:#296841;border-radius:6px;padding:2px 9px;font-size:.72rem;font-weight:700;margin-bottom:12px}.recommended{border:2px solid #4f9183}.score{font-size:3rem;font-weight:700;color:var(--green);line-height:1.3}.score small{font-size:1rem;font-weight:400}.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0}.field-row{display:grid;grid-template-columns:1fr auto;gap:16px;border-bottom:1px solid var(--line);padding:12px 0}.field-row:last-child{border:0}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:22px}.pieces{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:18px}.piece{padding:8px;touch-action:none;font-size:.8rem;min-width:0}.piece svg{width:100%;height:65px;display:block}.piece.selected{border:3px solid var(--green);background:#edf6f0}.piece.done{background:#e8f4ec;color:#38704e;opacity:.7;touch-action:auto}.drag-ghost{position:fixed;pointer-events:none;z-index:50;background:#f5fbf6e8;border:2px solid var(--green);border-radius:12px;width:110px;padding:8px;font-size:14px}.drag-ghost svg{width:90px;height:75px}.puzzle-layout{display:grid;grid-template-columns:1fr 1.25fr;gap:24px}.stars{color:#876519;letter-spacing:5px}.notice{border-radius:12px;background:#fff5dc;padding:12px 18px;font-size:.82rem}.level-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.level-grid button{text-align:left}.level-grid small{display:block}footer{max-width:1160px;margin:auto;border-top:1px solid var(--line);padding:20px 28px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;font-size:.7rem;color:#6b7d81}dialog{border:1px solid var(--line);border-radius:20px;max-width:650px;padding:28px;color:inherit;background:#fff}dialog::backdrop{background:#18383d66}dialog p{font-size:.9rem}dialog a{color:var(--blue)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(max-width:780px){.hero,.question-layout,.puzzle-layout{grid-template-columns:1fr;gap:22px}.hero-copy{padding:0}.hero .map-panel{order:2}.hero .map{max-height:390px}.game-grid{grid-template-columns:repeat(2,1fr)}.steps{gap:10px}.step{padding:14px;display:block}.step-number{display:inline-block;margin-bottom:10px}.header{padding:15px 20px}.privacy{display:none}main{padding:26px 20px}.question-layout .map{max-height:440px}.two-col{grid-template-columns:1fr}.level-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){:root{font-size:17px}.brand{font-size:1rem}.steps{grid-template-columns:1fr}.step{display:flex}.step-number{margin:0}.game-grid{grid-template-columns:1fr}.stats-row{gap:8px}.stats-row .card{padding:12px}.score{font-size:2.1rem}.pieces{grid-template-columns:repeat(4,1fr)}.piece{font-size:.7rem;padding:5px}.piece svg{height:52px}.actions button{flex:1}.topline{align-items:start;font-size:.85rem}footer{gap:8px}.map text{font-size:19px}}
