:root{color-scheme:light;--paper:#f4f3ee;--ink:#20211f;--muted:#777871}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",sans-serif;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' opacity='.025' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}button,input,a{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;background:none;border:1px solid var(--ink)}button:disabled{opacity:.4;cursor:wait}button:hover:not(:disabled),a.primary:hover{filter:brightness(.82)}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #777;outline-offset:4px}header{height:92px;margin:0 5%;display:flex;align-items:center;border-bottom:1px solid #cccac1;gap:25px}.brand{font-size:25px;font-weight:900;letter-spacing:-1px;text-decoration:none;color:inherit}.brand span{font-size:10px;letter-spacing:2px;margin-left:12px;vertical-align:middle}.edition{font-size:11px;color:var(--muted);letter-spacing:2px;margin:auto}.small{padding:10px 14px;border-radius:4px;font-size:12px;background:var(--paper)}main{max-width:1350px;padding:42px 35px 35px;margin:auto;display:grid;grid-template-columns:1fr 420px .72fr;gap:55px;align-items:center}.eyebrow{font:10px monospace;letter-spacing:2px}.intro{position:relative}h1{font-size:clamp(32px,3.4vw,51px);line-height:1.24;letter-spacing:-2px;margin:22px 0}.asterisk{display:inline-block;font-size:47px;margin-left:10px}p{font-size:13px;line-height:1.9}.subtitle{color:#62635d;margin-bottom:35px}.rule{display:flex;align-items:center;gap:15px;margin:15px 0}.rule>span{font:11px monospace;border:1px solid #a09f96;border-radius:50%;padding:7px}.rule p{font-size:13px;margin:0}.rule small{display:block;font-size:10px;color:var(--muted)}.stamp{border:2px solid;border-radius:50%;width:91px;height:91px;display:grid;place-content:center;font:900 17px/1.1 monospace;transform:rotate(-14deg);margin:35px 0 20px}.note{font-size:10px;color:var(--muted)}.game-shell{border:2px solid #30312d;border-radius:15px;overflow:hidden;box-shadow:7px 8px 0 #d7d6ce;background:#faf9f5}.topbar{display:flex;height:74px;padding:12px 20px;gap:22px;border-bottom:1px solid #30312d;align-items:center;background:#faf9f5}.topbar small{display:block;font:8px monospace;letter-spacing:1px}.topbar strong{font:700 29px monospace;display:block;margin-top:3px}.topbar em{font:12px monospace}.scorebox{margin-left:auto;text-align:right}.topbar button{width:31px;height:31px;border-radius:50%;font-size:12px}.viewport{position:relative;aspect-ratio:440/640;overflow:hidden;touch-action:none}canvas#game{width:100%;height:100%;display:block}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;background:#f4f3eedf;padding:24px 28px 64px}.home{background:linear-gradient(#f4f3ee00,#f4f3eecc 28%,#f4f3eea8 80%,#f4f3ee00)}.overlay h2{font-size:43px;line-height:1.25;letter-spacing:-2px;margin:21px 0 6px}.overlay p{color:#64655e;font-size:12px}.pill{border:1px solid;border-radius:30px;padding:7px 13px;font-size:10px;background:var(--paper)}.primary{display:block;background:var(--ink);color:#fff;border:1px solid var(--ink);padding:15px 20px;border-radius:4px;font-size:14px;letter-spacing:1px;text-align:center;text-decoration:none}.home .primary{width:85%;margin-top:23px;display:flex;justify-content:space-between}.overlay>small{margin-top:15px;color:var(--muted);font-size:10px}.controls{position:absolute;bottom:18px;left:18px;right:18px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.controls button{width:43px;height:37px;border:1px solid #8f9087;border-radius:5px;background:#f4f3eecc;pointer-events:auto;font:20px monospace}.controls span{font-size:9px;color:var(--muted);letter-spacing:2px}.game-bottom{font:8px monospace;padding:13px 12px;display:flex;gap:6px;border-top:1px solid #aaa99f;align-items:center}.game-bottom>span:last-child{margin-left:auto;font-size:7px}.live-dot{width:5px;height:5px;background:#222;border-radius:100%}.field-guide h3{font-size:21px;margin:12px 0 0}.field-guide>p{font-size:11px;color:var(--muted);margin-bottom:25px}.guide-row{display:flex;gap:13px;align-items:center;border-top:1px solid #d4d3ca;padding:9px 0}.guide-row canvas{width:55px;height:48px}.guide-row b{display:block;font-size:12px;font-weight:500}.guide-row small{font-size:9px;color:var(--muted)}.tip{border:1px dashed #96978d;transform:rotate(2deg);padding:15px;margin-top:23px}.tip span{font-size:11px;font-weight:700}.tip p{font-size:10px;margin:8px 0 0}footer{border-top:1px solid #cccac1;margin:0 5%;padding:22px 0;display:flex;justify-content:space-between;color:var(--muted);font-size:9px}.hidden{display:none!important}#toast{position:absolute;top:30%;left:0;right:0;text-align:center;font-weight:bold;pointer-events:none}.result-distance{margin-top:10px;font-size:14px}.result-distance b{font:700 55px monospace}.overlay#result{padding-top:12px}.overlay#result h2{font-size:32px;margin-top:10px}#result-caption{margin:0}#result-score{font:12px monospace;margin:8px}#rank-status{font-size:11px;min-height:20px;margin:5px}#result .primary,#result .secondary{width:100%;margin-top:10px}.secondary{padding:12px 18px;border:1px solid #898a82;border-radius:4px;font-size:12px;background:#f7f6f1}#name-form{width:100%;font-size:10px;margin-bottom:3px}.name-row{display:flex;gap:6px;margin-top:6px}input{width:0;flex:1;border:1px solid #aaa;background:#fff;padding:9px;font-size:12px}dialog{border:1px solid #222;background:var(--paper);color:var(--ink);border-radius:10px;padding:25px;width:min(460px,92vw);max-height:90dvh;box-shadow:8px 8px 0 #2224}dialog::backdrop{background:#20211f88;backdrop-filter:blur(4px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center}.dialog-heading h2{font-size:23px}.close{border:0;font-size:28px}.dialog-heading+p{font-size:11px;color:var(--muted)}#ranking{padding:0;list-style:none;max-height:52vh;overflow:auto}#ranking li{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid #ccc;font-size:12px}#ranking li b{font:18px monospace;width:26px}#ranking li span:last-child{margin-left:auto;font:14px monospace}#poster-image{width:100%;max-height:56vh;object-fit:contain}#poster-dialog .secondary{width:100%;margin-top:10px}
@media(min-width:1450px){main{padding-top:55px;grid-template-columns:1fr 440px .72fr;gap:65px}}@media(max-width:1120px){main{grid-template-columns:1fr 390px;max-width:940px;gap:35px}.field-guide{display:none}}@media(max-width:720px){header{height:61px;margin:0 18px}.brand{font-size:20px}.brand span{font-size:8px;margin-left:7px}.edition{display:none}header .small{margin-left:auto;font-size:10px;padding:8px}main{display:block;padding:17px 12px;max-width:445px}.intro{display:none}.game-shell{box-shadow:4px 5px 0 #d7d6ce}.topbar{height:65px}.viewport{max-height:calc(100dvh - 175px);min-height:420px;aspect-ratio:440/640}footer{justify-content:center;padding:12px}footer span:last-child{display:none}.overlay h2{font-size:38px}.overlay{padding-bottom:55px}#result .primary,#result .secondary{padding:10px}#result .result-distance b{font-size:43px}#result p{margin:5px}#result h2{font-size:28px}.game-bottom{padding:10px}}

/* Make saving a qualifying score the clear primary action. */
#name-form{background:#fff7de;border:2px solid #aa7400;border-radius:8px;padding:10px;margin:4px 0 8px;font-size:12px}#name-form label{font-weight:700;color:#785000}.name-row{display:flex;flex-direction:column;gap:8px}.name-row input{width:100%;flex:auto;min-height:40px;border-radius:4px}#result .submit-score{margin:0;min-height:48px;background:#ffd45c;color:#342300;border:2px solid #aa7400;font-size:15px;font-weight:800;box-shadow:0 3px 0 #aa7400}#result #again{background:transparent;color:#62635d;border-color:#b5b4ac;font-size:12px;padding:9px;margin-top:5px}#result:has(#name-form:not(.hidden)) #poster{padding:8px;margin-top:7px}#result:has(#name-form:not(.hidden)){padding-bottom:48px}#result:has(#name-form:not(.hidden)) .result-distance b{font-size:40px}#result:has(#name-form:not(.hidden)) h2{margin:5px 0;font-size:27px}

#toast{color:#21834b;font-size:16px;text-shadow:0 2px 0 #effff3;padding:10px;z-index:2}#score{transform-origin:center}