:root{font-family:Arial,sans-serif;color:#e8e8d9;background:#142520;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;border:1px solid #526258;background:#22362d;color:inherit;padding:12px 14px;text-align:left;border-radius:3px}button:hover{background:#344a3d}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #f2cc72;outline-offset:3px}header{height:94px;padding:24px 34px;border-bottom:1px solid #435347;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:20px;font-size:12px;letter-spacing:2px}.brand>b{font:31px Georgia,serif;letter-spacing:-3px;border:1px solid #b9c2aa;padding:7px 9px}.brand>b span{color:#d9ae61}.brand small{display:block;margin-top:6px;font-size:10px;letter-spacing:1px;color:#9ba995}.badge{font-size:10px;letter-spacing:1.5px;color:#b7c0ac}.badge i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#ddba6d;margin:0 10px}.workspace{display:grid;grid-template-columns:250px minmax(300px,1fr) 275px;min-height:calc(100vh - 155px)}aside{padding:26px 23px}.left{border-right:1px solid #435347}.right{border-left:1px solid #435347}.eyebrow,.court-head{font:10px Arial;letter-spacing:1.6px;color:#a9b49f}.eyebrow{margin:0 0 20px}h1{font:29px/1.1 Georgia,serif;margin:0 0 15px;letter-spacing:-.7px}h1 em{color:#d8b36b;font-weight:400}.intro{font:12px/1.7 Arial;color:#b2bba8}.source{width:140px;position:relative;margin:22px auto}.source canvas{width:100%;display:block}.source span{display:block;text-align:center;font-size:10px;margin-top:8px;color:#b4bdaa}.field{display:block;font-size:11px;color:#b7c1ac;margin:16px 0}.field input,.field select{display:block;background:#1b3027;border:1px solid #536451;color:#eee9d4;padding:10px;width:100%;margin-top:7px;border-radius:2px}.examples{margin:25px 0 18px}.examples>span{font-size:9px;letter-spacing:1.5px;color:#a6b29d}.examples button{width:100%;border:0;border-bottom:1px solid #435347;background:none;padding:13px 0;font-size:12px}.upload{position:relative;display:block;padding:12px;border:1px dashed #809078;text-align:center;font-size:12px;cursor:pointer;margin:10px 0}.upload input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.upload:focus-within{outline:3px solid #f2cc72}.muted{font-size:11px;color:#aab6a0;line-height:1.6}small.muted{display:block;font-size:10px}.court{padding:27px 34px;background:radial-gradient(ellipse at center,#293d31,#192b23);display:flex;flex-direction:column;align-items:center}.court-head{display:flex;width:100%;justify-content:space-between;margin-bottom:24px;gap:15px}.court-head label{letter-spacing:0;font-size:11px}.art{width:100%;max-width:min(64vh,700px);position:relative;background:repeating-conic-gradient(#a7aa96 0% 25%,#c4c5b0 0% 50%) 0/12px 12px;box-shadow:0 18px 50px #06130e66;border:8px solid #d9d5b7}canvas{image-rendering:pixelated}.art canvas{width:100%;height:100%;display:block}.tiles{position:absolute;inset:0;display:grid}.tiles button{padding:6px;position:relative;border:1px solid #f6f0ce45;background:transparent;border-radius:0;touch-action:manipulation;min-width:0;overflow:hidden}.tiles button:hover{background:#fff3}.tiles button.selected{box-shadow:inset 0 0 0 4px #ffe4a2;background:#ffec9e22}.tiles span{position:absolute;top:5px;left:5px;font:9px monospace;color:#fff9dd;background:#172920aa;padding:3px;white-space:nowrap}.tiles i{position:absolute;bottom:5px;right:5px;font:11px monospace;color:#fff5d7;background:#172920aa;padding:3px}.hide-labels span,.hide-labels i{visibility:hidden}.hide-labels button{border-color:transparent}.court-foot{display:flex;width:100%;max-width:700px;justify-content:space-between;font-size:10px;color:#b4c0a9;gap:12px;margin:20px 0}.court-foot b{color:#f1e3bc;font-weight:400}.status{color:#dfbc77}.notice{width:100%;border-top:1px solid #52604c;padding:17px 0 8px;font-size:12px;line-height:1.5;color:#e4d4a8}.hint{font-size:10px;color:#9daa94;line-height:1.6;margin:4px 0 0;width:100%}h2{font:24px Georgia,serif;margin:0 0 8px}h3{font-size:11px;font-weight:400;letter-spacing:.5px;margin:22px 0 12px}h3 span{float:right;color:#99a88f}.right>button{width:100%;margin:4px 0;font-size:12px}.right button small{float:right;font-size:9px;color:#b8c4ab;margin-top:2px}.primary{background:#dfba70;color:#1b2c21;border-color:#dfba70!important}.primary:hover{background:#ebcb8c}.primary span{float:right}.pair{display:flex;gap:7px;margin-top:7px}.pair button{flex:1;text-align:center;font-size:11px}.quiet{border:0;background:none;color:#a9b79f!important;text-align:center}.verify{background:none;border-color:#a7ab77!important;color:#d8c891}.trace{padding-bottom:17px;border-bottom:1px solid #465640}.trace ol{padding-left:18px;font-size:10px;color:#c1c9b2;line-height:1.8}.trace small,.trace p{font-size:10px;color:#91a087}.compact{font-size:10px;padding:9px}details{font-size:11px;line-height:1.6;color:#a7b69b}summary{cursor:pointer;padding:8px 0}footer{display:flex;gap:30px;justify-content:space-between;padding:16px 30px;border-top:1px solid #435347;color:#97a78e;font-size:10px}footer details{max-width:450px}footer button{font-size:10px;margin-right:6px}input[type=checkbox]{accent-color:#d8b36b}@media(min-width:1550px){.workspace{grid-template-columns:300px 1fr 310px}aside{padding:35px}.art{max-width:min(72vh,800px)}}@media(max-width:1050px){.workspace{grid-template-columns:200px 1fr}.right{grid-column:1/-1;border-top:1px solid #435347;display:grid;grid-template-columns:1fr 1fr;gap:8px 25px}.right>p,.right>h2,.right>.trace,.right>details{grid-column:1/-1}.court{padding:25px 20px}.badge{display:none}.art{max-width:600px}}@media(max-width:650px){header{padding:20px;height:85px}.brand{font-size:10px;gap:15px}.workspace{display:flex;flex-direction:column}.left{border-right:0;display:grid;grid-template-columns:1fr 110px;gap:12px;padding:22px}.left .eyebrow,.left h1,.left .intro{grid-column:1}.left .source{grid-column:2;grid-row:1/4;width:110px;margin:0}.left .examples,.left .muted{grid-column:1/-1}.examples,.left .field{margin:0}.court{order:0}.court-head{font-size:9px}.right{padding:22px}.court-foot{flex-wrap:wrap}.tiles span{font-size:8px;padding:1px}footer{flex-direction:column;padding:20px}.art{border-width:5px}h1{font-size:25px}.intro{margin:0}.notice{font-size:11px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.header-actions{display:flex;align-items:center;gap:18px}.header-actions button{font-size:10px;padding:9px}@media(max-width:650px){.header-actions{gap:4px}.brand small{font-size:8px}.brand{letter-spacing:1px}}
