@charset "UTF-8";
:root{color-scheme:light;--ink:#244c44;--green:#257a61;--mint:#d9eedc;--cream:#f7f5e9;--orange:#ed7655;--yellow:#ffcf66;--line:#d6ddcf;--muted:#697c70;--shadow:0 7px 0 #205c49}
*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.6;-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer;border:0;color:inherit;touch-action:manipulation}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #dd6345;outline-offset:4px}button:active:not(:disabled){transform:translateY(2px)}[hidden]{display:none!important}.app{max-width:1200px;padding:0 40px;margin:auto}.topbar{height:100px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:14px}.brand{display:flex;align-items:center;gap:12px;background:none;text-align:left;letter-spacing:2px;font-size:16px;font-weight:900;padding:0}.brand-mark{display:grid;place-items:center;background:var(--yellow);border:2px solid var(--ink);border-radius:50%;width:54px;height:54px;font-size:13px;letter-spacing:-1px;transform:rotate(-9deg)}.brand small{display:block;font-size:9px;letter-spacing:1px;font-weight:500;margin-top:2px}.top-actions{display:flex;gap:10px}.quiet{font-size:12px;background:transparent;border:1px solid var(--line);border-radius:24px;padding:10px 15px;min-height:42px;font-weight:bold}.quiet:hover{background:white}.landing{display:grid;grid-template-columns:1fr 1.14fr;align-items:center;min-height:560px;gap:20px;padding:20px 0}.hero-copy{padding:12px 0}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:800;display:flex;align-items:center;gap:8px}.eyebrow>span{width:7px;height:7px;background:var(--orange);border-radius:50%}h1{font-size:clamp(36px,4.8vw,64px);line-height:1.17;letter-spacing:-3px;margin:23px 0;color:var(--green);font-weight:1000}h1>span{display:block;font-size:.67em;margin-top:10px;letter-spacing:1px;color:var(--ink)}.lead{font-size:16px;line-height:1.9;letter-spacing:1px;margin:0 0 24px}.lead strong{color:var(--orange)}.mode-picker{display:flex;gap:8px;margin:0 0 13px;max-width:425px}.mode{padding:9px 11px;background:#edede1;border:1px solid transparent;border-radius:12px;text-align:left;flex:1}.mode.active{background:var(--mint);border-color:var(--green)}.mode b{font-size:12px;display:block}.mode b:before{content:'○ ';color:var(--green)}.mode.active b:before{content:'● '}.mode small{font-size:9px;display:block;color:var(--muted);margin-top:2px}.primary{background:var(--green);color:white;min-height:54px;font-weight:900;border-radius:14px;padding:13px 22px;box-shadow:var(--shadow);width:100%;transition:background .15s}.primary:hover:not(:disabled){background:#1d6d54}.start{max-width:425px;font-size:18px;text-align:left;display:flex;justify-content:space-between;align-items:center}.start span{font-size:26px;line-height:1}.home-links{display:flex;gap:10px;margin-top:20px;max-width:425px}.outline{border:1px solid var(--line);border-radius:12px;background:transparent;padding:10px 12px;min-height:42px;font-size:12px;font-weight:bold}.outline:hover:not(:disabled){background:#e9ecdc}.home-links .outline{flex:1}.home-links span{font-size:10px;color:var(--muted);padding-left:8px}.text-button{background:transparent;padding:12px 4px;text-decoration:underline;text-underline-offset:5px;font-size:11px;font-weight:bold}.save-note{color:var(--muted);font-size:10px;margin:3px 0 0}.hero-art{position:relative;align-self:center;min-width:0}.hero-art canvas{width:100%;height:auto;display:block}.postmark{position:absolute;right:6%;top:5%;font-size:9px;line-height:1.8;letter-spacing:2px;text-align:center;transform:rotate(10deg);border:1px solid #7e9d80;border-radius:50%;width:99px;height:99px;display:flex;flex-direction:column;justify-content:center;color:#598165}.postmark b{font-size:10px;letter-spacing:1px}.postmark span{color:var(--orange)}.art-caption{position:absolute;bottom:0;left:10%;font-size:10px;letter-spacing:1px}.art-caption span{color:var(--orange);padding-right:16px;font-weight:bold}footer{text-align:center;font-size:10px;color:var(--muted);padding:22px 0;letter-spacing:1px}.play-heading{display:flex;justify-content:space-between;align-items:center;margin:20px 0 16px}.play-heading>div{text-align:center}.play-heading p{font-size:10px;letter-spacing:2px;margin:0;color:var(--green)}.play-heading h2{font-size:20px;margin:1px 0}.play-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.8fr);gap:45px;align-items:center;max-width:1010px;margin:auto}.scene-card{border:1px solid #bed7ce;border-radius:24px;overflow:hidden;background:#e0f0e4;box-shadow:0 8px 0 #dce3d5;min-width:0}.scene-hud{display:flex;align-items:center;justify-content:space-between;padding:16px 24px 4px;font-size:13px;font-weight:bold}.scene-hud #hearts{color:#d7644b;letter-spacing:2px}.scene-hud #score{color:#705023}#scene{display:block;width:100%;height:auto;touch-action:none}.scene-caption{background:#fff9e9;border-top:1px solid #d5e3ce;text-align:center;min-height:39px;padding:9px;font-size:11px;font-weight:bold}.control-panel{padding:6px 0}.mission-label{font-size:9px;letter-spacing:1.8px;color:var(--muted)}h3{font-size:29px;line-height:1.5;margin:12px 0 17px;letter-spacing:1px}h3 span{color:var(--green)}.instruction{font-size:12px;min-height:44px}.bridge-meter{display:flex;align-items:baseline;gap:6px;border-bottom:1px solid var(--line);padding-bottom:8px;margin-bottom:18px}.bridge-meter>span{font-size:12px;margin-right:auto}.bridge-meter output{font-size:28px;font-weight:900;font-variant-numeric:tabular-nums}.bridge-meter small{font-size:10px;color:var(--muted)}.grow{font-size:19px;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;min-height:79px}.grow span{display:block;font-size:10px;font-weight:500;margin-top:4px;letter-spacing:1px}.grow.growing{background:var(--orange);box-shadow:0 7px 0 #b3543a}.key-hint{font-size:9px;text-align:center;margin:15px 0 7px;color:var(--muted)}.feedback{background:#eeead8;border-radius:10px;padding:12px;min-height:58px;font-size:12px;line-height:1.8;margin:14px 0 0}.control-panel>.text-button{display:block;margin:auto}.trip-note{display:flex;gap:12px;align-items:center;border-top:1px solid var(--line);padding-top:14px;margin-top:5px;color:var(--muted)}.trip-note span{font-size:28px;color:#ae9e65}.trip-note p{font-size:10px;margin:0}.range-note{font-size:12px;color:var(--green);font-weight:bold;margin:0 0 9px}input[type=range]{accent-color:var(--green);width:100%;height:34px;touch-action:pan-y}.adjust-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:5px}.adjust-row span{font-size:9px;color:var(--muted)}.adjust-row button{min-width:54px}dialog{border:1px solid #cad6c4;border-radius:25px;background:var(--cream);color:var(--ink);width:min(92vw,680px);max-height:88dvh;padding:0;box-shadow:0 24px 80px #173f4140}dialog::backdrop{background:#163f3bcc;backdrop-filter:blur(5px)}.modal-inner{padding:32px}.close{position:absolute;right:14px;top:12px;background:#e6e8d9;border-radius:50%;width:38px;height:38px;font-size:23px}.modal-inner h2{font-size:28px;margin:8px 0 18px;line-height:1.4}.modal-inner .eyebrow{font-size:10px;color:var(--green)}.modal-actions{display:flex;gap:12px;margin-top:23px}.modal-actions>*{flex:1}.modal-body p,#modal-body>p{font-size:13px}#modal-body ul{padding-left:20px;line-height:2;font-size:13px}.result-stars{text-align:center;color:#dc9a36;font-size:48px;letter-spacing:10px;margin:10px 0}.result-note{text-align:center;font-size:15px;font-weight:bold}.result-stats{display:flex;justify-content:center;gap:40px;text-align:center;margin:18px 0}.result-stats b{display:block;font-size:24px;color:var(--green)}.result-stats span{font-size:11px}.unlock-note{background:#ffe7b4;text-align:center;border-radius:12px;padding:12px;font-size:12px}.world-block h3{font-size:14px;margin:22px 0 10px}.course-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.course-button{background:#e0ecd9;border:1px solid #b8ceb7;border-radius:12px;min-height:67px;font-size:18px;font-weight:bold}.course-button small{display:block;font-size:10px;color:#8f671a;letter-spacing:2px}.course-button:disabled{background:#eae9df}.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.cat-card{border:1px solid var(--line);border-radius:16px;background:#eeedde;padding:10px 6px;display:flex;flex-direction:column;align-items:center;min-height:142px}.cat-card.selected{border:2px solid var(--green);background:#dcecd8}.cat-card svg{height:72px;width:82px}.cat-card b{font-size:12px}.cat-card small{font-size:9px;margin-top:5px}.save-warning{background:#ffe6b2;padding:10px;border-radius:12px;font-size:11px;text-align:center}.sr-only{position:absolute;width:1px;height:1px;clip:rect(0,0,0,0);overflow:hidden;white-space:nowrap}.help-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;text-align:center}.help-steps>div{padding:15px 5px;border-radius:12px;background:#e6ecd9;font-size:12px}.help-steps b{display:block;font-size:25px;color:var(--orange)}
.adjust-row label{display:flex;align-items:center;gap:8px;font-size:10px}.adjust-row input{border:1px solid var(--line);border-radius:8px;background:#fffdf2;color:var(--ink);width:70px;min-height:42px;text-align:center;font-weight:bold}
.cover{overflow:hidden}.cover .app{max-width:none;width:1200px;padding:0 48px}.cover .topbar,.cover footer,.cover .mode-picker,.cover .start,.cover .home-links,.cover .text-button,.cover .save-note,.cover .lead,.cover .save-warning,.cover .art-caption,.cover .postmark{display:none}.cover .landing{height:675px;min-height:0;display:grid;grid-template-columns:470px 660px;gap:0;padding:0}.cover .hero-copy{position:relative;z-index:1}.cover h1{font-size:80px;letter-spacing:-5px;margin:26px 0}.cover h1 span{font-size:46px;letter-spacing:0;white-space:nowrap}.cover .hero-copy>.eyebrow{font-size:14px;letter-spacing:2px}.cover .hero-art{margin:0 0 0 -25px;width:660px}.cover .hero-art canvas{max-height:none}.cover h1:after{content:'✦  ✦  ✦';display:block;margin-top:35px;font-size:32px;letter-spacing:10px;color:#e4ac4d}
@media(min-width:1400px){.landing{min-height:650px}}
@media(max-width:900px){.app{padding:0 24px}.topbar{height:80px}.landing{gap:0;min-height:550px}.play-layout{gap:24px;grid-template-columns:minmax(0,1.2fr) minmax(250px,.85fr)}h1{font-size:45px}.hero-art{margin-right:-16px}.postmark{width:80px;height:80px}.postmark b{font-size:9px}h3{font-size:25px}.mode small{font-size:8px}.scene-hud{padding:12px 18px 2px}.art-caption{font-size:8px;left:7%}}
@media(max-width:650px){.app{padding:0 17px}.topbar{height:72px}.brand-mark{width:42px;height:42px;font-size:10px}.brand{font-size:12px;gap:8px;letter-spacing:1.5px}.brand small{font-size:7px;letter-spacing:0}.top-actions{gap:5px}.quiet{font-size:10px;padding:8px 10px;min-height:40px}.landing{display:flex;flex-direction:column;padding:18px 0 0;gap:0}.hero-copy{width:100%;padding:0}.hero-copy>.eyebrow{font-size:9px;margin:4px 0 15px}h1{font-size:46px;letter-spacing:-2px;margin:0 0 18px}h1>span{font-size:29px;margin-top:7px}.lead{font-size:13px;margin-bottom:18px;line-height:1.8}.mode-picker{max-width:none}.mode{padding:9px}.mode small{font-size:8px}.mode b{font-size:11px}.start,.home-links{max-width:none}.start{font-size:16px;min-height:52px}.home-links{margin-top:18px;gap:8px}.home-links .outline{font-size:11px}.save-note{font-size:9px}.hero-art{width:100%;max-width:460px;margin:-5px 0 0}.hero-art canvas{max-height:390px}.postmark{right:8%;top:7%}.art-caption{left:9%;font-size:9px;bottom:3%}footer{font-size:8px;padding:15px 0}.play-heading{margin:14px 0 12px;gap:6px}.play-heading h2{font-size:17px}.play-heading p{font-size:8px;letter-spacing:1px}.play-layout{display:block;max-width:450px}.scene-card{border-radius:18px}.scene-hud{padding:10px 16px 0;font-size:11px}.scene-caption{font-size:10px;min-height:32px;padding:7px}.control-panel{padding:13px 0 0}.control-panel h3,.mission-label,.trip-note{display:none}.instruction{font-size:11px;margin:0 0 8px;min-height:0}.instruction br{display:none}.bridge-meter{position:relative;padding-bottom:4px;margin-bottom:10px}.bridge-meter output{font-size:23px}.grow{min-height:61px;font-size:17px;padding:10px}.grow span{font-size:9px;margin-top:2px}.key-hint{display:none}.feedback{font-size:11px;padding:9px;min-height:37px;margin-top:16px}.control-panel>.text-button{padding:10px}.range-note{font-size:11px}.adjust-row{margin-bottom:11px}.adjust-row span{font-size:10px}.modal-inner{padding:26px 20px}.modal-inner h2{font-size:24px}.modal-actions{flex-wrap:wrap}.modal-actions .primary{min-width:180px}.cat-grid{gap:8px}.cat-card{min-height:126px}.cat-card b{font-size:10px}.cat-card small{font-size:8px}.cat-card svg{width:70px;height:62px}.course-button{min-height:57px}.result-stars{font-size:39px}#play #scene{max-height:40dvh;object-fit:contain}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}