:root{color-scheme:dark;--bg:#14251d;--panel:#233b2c;--ink:#f1ebd2;--muted:#adb498;--gold:#d4bc76;--line:#456044;--leaf:#b8d29a}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 0 0,#345039,transparent 65%),#14251d;color:var(--ink);font:14px/1.5 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}main{max-width:1280px;padding:0 35px;margin:auto}button,select,input{font:inherit}button,a,select,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer;background:#2b4431;color:var(--ink);border:1px solid #526b49;border-radius:7px;padding:9px 13px;transition:background .15s}button:hover:not(:disabled){background:#3d593c;border-color:#94a86d}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #e0c274;outline-offset:3px}a{color:#c5d5a5;text-underline-offset:3px}header{height:77px;border-bottom:1px solid #49603f;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:12px;color:#d7d6a9;font-size:32px;text-decoration:none}.brand span{font-size:13px;letter-spacing:2.7px;font-weight:600}header>div{display:flex;align-items:center;gap:7px}header button{background:none;border-color:transparent;font-size:12px}.header-note{font:italic 14px Georgia,serif;color:#bbc09c;margin-right:20px}.intro{padding:29px 0 26px;display:flex;justify-content:space-between;align-items:center;gap:20px}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:700;color:var(--gold);margin:0 0 10px}h1{font:400 clamp(31px,3.2vw,45px)/1.1 Georgia,serif;letter-spacing:-1.3px;margin:0 0 10px}h1 em{color:#c2d2a1}.intro p:not(.eyebrow){font-size:12px;color:#b5bd9d;margin:0}.choices{display:flex;flex-direction:column;gap:6px;min-width:235px}.choices label{font-size:8px;color:#c6caaa;letter-spacing:1.4px}.choices select{padding:8px 11px;background:#28432f;color:#edeacd;border:1px solid #59764d;border-radius:6px;font-size:11px}.choices select:last-child{background:#203927;color:#c4ceac;font-size:10px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:22px}.game{min-width:0;border:1px solid #647451;border-radius:12px;overflow:hidden;background:#203626;align-self:start;box-shadow:0 18px 60px #0003}.topline{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:13px 18px;background:#243e2a;border-bottom:1px solid #65834d6b}.topline>div{display:flex;align-items:center;gap:9px}.status-dot{width:6px;height:6px;border-radius:50%;background:#c5e99a;box-shadow:0 0 10px #c5e99a44}.topline strong{font-size:12px;font-weight:500}#timer{font-size:10px;color:#bfca9b;border-left:1px solid #637e4b;padding-left:10px}#possible{font-size:9px;color:#c1c59d}.fieldbook{width:100%;height:min(48vw,540px);min-height:400px;position:relative;background:linear-gradient(#293c2a0a,#293c2a0a),url('fieldbook.webp') center/cover;display:flex;align-items:center;justify-content:center}.grid-wrap{position:relative;width:min(62%,410px);aspect-ratio:1;touch-action:none;user-select:none}#grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);z-index:2}#trail{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible;pointer-events:none}#trail polyline{stroke:#66854b;stroke-width:15;fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:.75}.letter{width:86%;height:86%;margin:7%;padding:0;position:relative;background:linear-gradient(135deg,#fff8e3f5,#eee5c8f5);border:1px solid #aba27c;color:#3a5030;border-radius:13px;font:600 34px Georgia,serif;box-shadow:0 4px 0 #9e956f,0 6px 9px #655b3730;touch-action:none;user-select:none;text-shadow:0 1px 0 #fff8e7}.letter:hover:not(:disabled){background:#e0e9c4;color:#425d30;border-color:#839767}.letter.selected{background:linear-gradient(135deg,#d8e6b3,#b6cd93);border-color:#5c7c41;box-shadow:0 4px 0 #7c9860,0 5px 8px #435e3130;color:#284625}.letter.last{background:#648546;color:#fffbe1;text-shadow:none;border-color:#506d34;box-shadow:0 4px 0 #405f29,0 4px 12px #3f5a4440}.letter:disabled{opacity:.9}.letter small{position:absolute;right:7px;top:3px;font:600 9px system-ui;color:#58713b}.letter.last small{color:#dfebbd}.word-bar{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:13px 17px;border-top:1px solid #667b4c;background:#2a412b}.word-bar>div:last-child{display:flex;gap:6px}.word-bar button{font-size:11px;padding:8px 10px}#current{font:400 22px Georgia,serif;letter-spacing:1.4px;min-width:0;overflow-wrap:anywhere}.word-bar .primary{white-space:nowrap}#word-form{display:flex;align-items:center;gap:9px;padding:13px 17px 0}#word-form label{font-size:10px;color:#bac69e;white-space:nowrap}#word-input{width:100%;min-width:0;padding:8px 10px;border:1px solid #59704a;background:#1e3425;color:#e8ecd2;border-radius:6px;font-size:11px}#word-input::placeholder{color:#899c77}#typed-submit{font-size:10px;padding:8px 11px}#message{font-size:11px;line-height:1.6;color:#c2cfac;margin:12px 17px;min-height:35px}.toolbar{display:flex;justify-content:space-between;padding:0 17px 14px;gap:9px}.toolbar button{font-size:10px;padding:7px 11px}.primary{background:#c3d7a4;border-color:#d3dfb4;color:#284428;font-weight:600}.primary:hover:not(:disabled){background:#dce9be;color:#203c21;border-color:#dce9be}aside{display:flex;flex-direction:column;gap:15px}.card{padding:20px;border:1px solid #466442;border-radius:10px;background:linear-gradient(135deg,#2d4730,#1c3426)}h2{font:400 27px/1.18 Georgia,serif;margin:11px 0}.card p:not(.eyebrow){font-size:11px;color:#b4c09e;line-height:1.7}.stats{display:flex;justify-content:space-between;padding:13px 0;border-top:1px solid #506c43;border-bottom:1px solid #506c43;margin:18px 0 15px;gap:15px}.stats>div{display:flex;flex-direction:column}.stats strong{font:400 32px Georgia,serif;color:#edecc9}.stats strong span{font:12px system-ui;color:#95b17f}.stats small{font-size:7px;color:#a9bd94;letter-spacing:1px;margin-top:4px}.meter{height:5px;background:#435e38;border-radius:6px;overflow:hidden}.meter span{display:block;height:100%;background:#bfd399;border-radius:6px;transition:width .15s}.fine{font-size:9px!important;color:#97b082!important;margin:7px 0 0}.heading{display:flex;justify-content:space-between;align-items:baseline;gap:10px}.heading>span{font-size:9px;color:#96ad7f}.heading .eyebrow{font-size:8px;letter-spacing:1.5px}.collection{min-height:170px;max-height:410px;overflow:auto;flex:1}#words{list-style:none;display:grid;grid-template-columns:1fr 1fr;padding:0;gap:7px 16px;margin:8px 0 0}#words li{font-size:11px;display:flex;justify-content:space-between;color:#d9e2bf;gap:6px;border-bottom:1px solid #6884553d;padding:4px 0}#words small{font-size:9px;color:#95b37a}.empty{font:italic 18px/1.6 Georgia,serif!important;color:#859f73!important;max-width:170px;margin-top:20px}.tip{display:flex;gap:11px;padding:0 10px}.tip>span{font:36px Georgia,serif;color:#93ac73}.tip p{font-size:10px;line-height:1.8;color:#95ad83;margin:0}.tip strong{color:#b8ca9d;font-weight:600}.score-guide{display:flex;justify-content:space-between;gap:10px;font-size:8px;color:#91a77f;padding:0 10px}.score-guide b{color:#c4d4a7;margin-left:4px;font-weight:500}footer{display:flex;justify-content:space-between;gap:20px;color:#8fa27f;font-size:9px;padding:19px 0 28px}footer button{background:none;border:0;text-decoration:underline;padding:0;font-size:9px;color:#b9c69e}.hidden{display:none!important}.overlay{position:absolute;inset:15% 10%;z-index:5;border:1px solid #b6c58e;background:#fff8e7f5;box-shadow:0 10px 50px #263c303b;border-radius:13px;color:#3e5632;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:28px;text-align:center}.overlay .eyebrow{color:#9a8249}.overlay h2{font-size:35px;max-width:380px;color:#59763f}.overlay p:not(.eyebrow){font-size:12px;color:#81906d;max-width:340px;line-height:1.7}.overlay button{font-size:11px;margin:5px;background:#e5ecd4;color:#425c33;border-color:#a7bc8c}.overlay .primary{background:#68834d;color:#fffbe8}.overlay>div{margin-top:7px}dialog{width:calc(100% - 30px);max-width:610px;border:1px solid #9bae7a;border-radius:14px;padding:32px;background:#f5f0dc;color:#3d5434;box-shadow:0 20px 100px #0006;font-size:13px;line-height:1.8}dialog::backdrop{background:#102318d9;backdrop-filter:blur(5px)}dialog h2{font-size:33px;margin:12px 0 20px}dialog a{color:#59733b}dialog code{font-size:11px}.close{position:absolute;right:9px;top:7px;font-size:23px;padding:0 8px;border:0;background:none;color:#69814e}dialog .primary{background:#65834b;color:#fffbe7;border-color:#65834b}@media(max-width:1050px){main{padding:0 22px}.layout{grid-template-columns:minmax(0,1fr) 250px;gap:15px}.header-note{display:none}.fieldbook{height:500px;min-height:0}.grid-wrap{width:74%}.letter{font-size:31px;border-radius:10px}.card{padding:16px}.word-bar{padding:12px;gap:8px}#current{font-size:19px}.word-bar button{padding:8px;font-size:10px}.intro h1{font-size:37px}.choices{min-width:220px}}@media(max-width:760px){main{padding:0 14px}header{height:64px;gap:10px}.brand{font-size:25px;gap:7px}.brand span{font-size:11px;letter-spacing:2px}header button{font-size:10px;padding:6px}.intro{padding:24px 0 19px;align-items:start;gap:14px}.intro h1{font-size:32px;max-width:220px;letter-spacing:-.9px}.intro .eyebrow{font-size:7px;letter-spacing:1.3px}.intro p:not(.eyebrow){font-size:10px;line-height:1.6;max-width:210px}.choices{min-width:0;width:44%;max-width:190px;gap:5px;padding-top:3px}.choices label{font-size:7px;letter-spacing:1px}.choices select{font-size:9px;padding:8px 3px;width:100%}.choices select:last-child{font-size:8px}.layout{grid-template-columns:1fr;gap:13px}.topline{padding:11px 12px;gap:8px}.topline strong{font-size:11px}.topline>div{gap:7px}#timer{font-size:9px;padding-left:8px}#possible{font-size:8px}.fieldbook{height:auto;aspect-ratio:1;min-height:0;background-size:cover}.grid-wrap{width:75%}.letter{font-size:27px;border-radius:9px;box-shadow:0 3px 0 #9e956f,0 4px 6px #655b3730}.letter small{font-size:7px;right:5px;top:2px}.word-bar{flex-wrap:wrap;padding:11px 12px;gap:10px}#current{font-size:20px;min-height:28px;width:100%;text-align:center}.word-bar>div:last-child{width:100%;justify-content:space-between;gap:8px}.word-bar button{font-size:11px;padding:8px 11px}.word-bar .primary{flex:1}#word-form{padding:12px 12px 0;gap:7px}#word-form label{font-size:8px}#word-input{font-size:10px;padding:8px 6px}#typed-submit{font-size:9px;padding:8px}#message{font-size:10px;margin:10px 13px;min-height:32px}.toolbar{padding:0 12px 12px}.toolbar button{font-size:9px;padding:7px 9px}aside{display:grid;grid-template-columns:1fr 1fr;gap:10px}.card{padding:14px}h2{font-size:24px}.card .eyebrow{font-size:7px;letter-spacing:1.3px}.card p:not(.eyebrow){font-size:10px}.stats{margin:12px 0;padding:10px 0;gap:6px}.stats strong{font-size:27px}.stats small{font-size:6px;letter-spacing:.5px}.fine{font-size:8px!important}.collection{min-height:260px;max-height:370px}.heading{gap:3px}.heading .eyebrow{font-size:7px;letter-spacing:1px}.heading>span{font-size:7px;white-space:nowrap}#words{grid-template-columns:1fr;gap:3px;margin-top:3px}#words li{font-size:10px}.tip{grid-column:1/-1}.score-guide{grid-column:1/-1;max-width:330px;padding:0 8px}.overlay{inset:9% 6%;padding:20px}.overlay h2{font-size:29px}.overlay .eyebrow{font-size:8px;letter-spacing:1.3px}.overlay p:not(.eyebrow){font-size:10px}.overlay button{font-size:10px;padding:8px 9px}.overlay .primary{margin-bottom:4px}dialog{font-size:12px;padding:26px}dialog h2{font-size:28px}footer{font-size:8px;gap:15px}footer>span{max-width:245px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
