:root{color-scheme:light dark;--soil: #f4f8f2;--field: #ffffff;--ridge: #d8e2d5;--ink: #1c231b;--ink-faint: #5c6b59;--marquee: #ffb224;--marquee-ink: #1a1206;--alert: #b3261e;--grass-strong: #216e39;--font-display: "DotGothic16", "IBM Plex Sans JP", sans-serif;--font-body: "IBM Plex Sans JP", system-ui, sans-serif}@media (prefers-color-scheme: dark){:root{--soil: #0c110d;--field: #151c16;--ridge: #28332a;--ink: #e4ede2;--ink-faint: #8da08c;--alert: #ff8f8f;--grass-strong: #39d353}}*{box-sizing:border-box}html,body{height:100%;margin:0}body{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px 16px;background:var(--soil);color:var(--ink);font-family:var(--font-body);font-size:.9375rem;line-height:1.7}#app{width:100%;max-width:1040px;display:flex;flex-direction:column;align-items:center;gap:20px}:focus-visible{outline:2px solid var(--marquee);outline-offset:2px}.site-header{text-align:center}.site-header h1{margin:0;font-family:var(--font-display);font-weight:400;font-size:clamp(2rem,6vw,3rem);letter-spacing:.08em;line-height:1.2}.subtitle{margin:4px 0 0;color:var(--ink-faint)}.stage{width:100%;display:flex;justify-content:center}.view{display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center;width:100%}.username-form{display:flex;gap:8px;width:100%;max-width:420px}.username-form input{flex:1;min-width:0;padding:10px 14px;font-family:var(--font-body);font-size:1rem;border:1px solid var(--ridge);border-radius:8px;background:var(--field);color:var(--ink)}.username-form input::placeholder{color:var(--ink-faint)}button,.share-button{padding:10px 18px;font-family:var(--font-body);font-weight:600;font-size:.9375rem;border:1px solid var(--ridge);border-radius:8px;background:var(--field);color:var(--ink);cursor:pointer;text-decoration:none;display:inline-block;transition:filter .12s ease}button:hover,.share-button:hover{filter:brightness(1.06)}.btn-primary{font-family:var(--font-display);font-weight:400;font-size:1rem;letter-spacing:.04em;border-color:var(--marquee);background:var(--marquee);color:var(--marquee-ink)}button:disabled{opacity:.6;cursor:default}.form-hint{margin:0;font-size:.8125rem;color:var(--ink-faint)}.error-message{color:var(--alert);margin:0}.view-empty p{font-size:1.25rem;margin:0}.session-status{margin:0;font-size:.8125rem;color:var(--ink-faint)}.play-area{position:relative;width:100%}.attract-host{width:100%}.demo-label{position:absolute;right:12px;bottom:8px;font-family:var(--font-display);font-size:.75rem;letter-spacing:.15em;color:var(--ink-faint);pointer-events:none}.game-canvas{display:block;width:100%;height:auto;max-width:100%;border:1px solid var(--ridge);border-radius:8px;touch-action:none;cursor:pointer}.demo-canvas{pointer-events:none;cursor:default}.board-placeholder{width:100%;aspect-ratio:8 / 3;display:flex;align-items:center;justify-content:center;border:1px solid var(--ridge);border-radius:8px;background:var(--field);color:var(--ink-faint)}.board-placeholder p{margin:0}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;pointer-events:none}.guide-overlay{top:37%;color:var(--ink);font-family:var(--font-display);font-size:1.1rem;letter-spacing:.06em;text-shadow:0 0 6px var(--soil),0 0 6px var(--soil)}.result-overlay{background:color-mix(in srgb,var(--field) 92%,transparent);pointer-events:auto;border:1px solid var(--ridge);border-radius:8px;padding:12px;overflow-y:auto}@media (prefers-reduced-motion: no-preference){.result-overlay:not([hidden]){animation:result-in .2s ease-out}}@keyframes result-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.overlay[hidden]{display:none}.result-overlay h2{margin:0;font-family:var(--font-display);font-weight:400;font-size:1.75rem;line-height:1.2;letter-spacing:.06em}.result-stat-grid{display:flex;gap:40px;justify-content:center}.result-stat{display:flex;flex-direction:column;gap:2px}.result-stat-label{font-size:.75rem;color:var(--ink-faint)}.result-stat-value{font-family:var(--font-display);font-size:1.5rem;line-height:1.2}.harvest-bar{display:flex;gap:3px}.harvest-cell{width:10px;height:10px;border-radius:2px;background:var(--ridge)}.harvest-cell-filled{background:var(--grass-strong)}.result-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.site-footer{font-size:.8125rem;color:var(--ink-faint)}.site-footer a{color:inherit;text-underline-offset:3px}.site-footer a:hover{color:var(--ink)}@media (max-width: 560px){.username-form{flex-direction:column}.username-form input,.username-form button{width:100%}.overlay{gap:4px}.result-overlay{padding:6px}.result-overlay h2{font-size:1rem}.result-stat-grid{gap:24px}.result-stat{gap:0}.result-stat-label{line-height:1.2}.result-stat-value{font-size:1.05rem}.harvest-bar{gap:2px}.harvest-cell{width:7px;height:7px}.result-actions button,.result-actions .share-button{padding:5px 10px;font-size:.8125rem}}