:root{font-family:Inter,Arial,sans-serif;color:#e9e8df;background:#151c1d;font-synthesis:none}*{box-sizing:border-box}body{margin:0}main{min-height:100vh;padding:28px 3vw}header{display:flex;justify-content:space-between;border-bottom:1px solid #45504e;padding-bottom:24px;font-size:12px;letter-spacing:2px}.brand{color:#c3f169;font-weight:700}.intro{display:flex;justify-content:space-between;align-items:center;padding:32px 0}.eyebrow{font-size:11px;letter-spacing:2px;color:#c3f169}h1{font-family:Georgia,serif;font-size:clamp(38px,5vw,70px);font-weight:400;line-height:1;margin:16px 0}p{color:#aeb8b2;font-size:13px;line-height:1.6}.meter{display:grid;padding:24px;background:#202a29;border:1px solid #4d5b51;border-radius:50% 50% 8px 8px;text-align:center;min-width:225px}.meter strong{color:#c3f169;font-size:26px;font-variant-numeric:tabular-nums}.meter span{font-size:11px;margin-bottom:12px}.workspace{display:grid;grid-template-columns:1fr 1fr .9fr;gap:18px}.workspace article,.workspace aside,.bottom>div,details{border:1px solid #43504c;background:#1d2726;border-radius:14px;padding:18px}.caption{display:flex;align-items:center;justify-content:space-between;gap:10px}h2{font-size:14px;font-weight:500}.caption span{font-size:10px;color:#aab7aa}svg{width:100%;aspect-ratio:4/3;background:#101615;display:block;touch-action:manipulation}.workspace article:first-child svg{cursor:crosshair}.paint{display:flex;gap:8px;align-items:end;margin-top:15px}.paint input{width:66px}label{display:block;font-size:11px;color:#b7c2bb}input,textarea{background:#121a19;border:1px solid #526357;color:#eef6e9;border-radius:5px;padding:7px;font:inherit}input{display:block;width:80px;margin-top:5px}input[type=checkbox]{display:inline;width:auto}input[type=range]{width:100%;accent-color:#c3f169}.target{padding-top:18px}.target>input[type=number]{width:100%}button{cursor:pointer;border:1px solid #536452;background:#2b382e;color:#e2edda;padding:10px 12px;border-radius:7px;font:inherit;font-size:12px}button:hover{background:#3b513a}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #c3f169;outline-offset:3px}.region{display:flex;align-items:center;gap:8px;margin:8px 0;border:1px solid transparent;border-radius:8px;padding:4px}.region.selected{border-color:#badc72}.region button{text-align:left;flex:1;min-width:0;overflow-wrap:anywhere}.region small{display:block;font-size:10px;color:#a7b8a0;margin-top:5px}.region input[type=number]{width:66px}.pin{min-width:38px}.bottom{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.buttons{display:flex;flex-wrap:wrap;gap:8px}.buttons button:first-child{background:#c3f169;color:#172015}.ok{color:#c3f169!important}.bad{color:#ffb5a1!important}textarea{display:block;min-height:210px;width:100%;margin:14px 0;resize:vertical}summary{cursor:pointer;color:#c3f169}footer{margin-top:25px;max-width:1000px}footer button{margin-right:8px}@media(max-width:1100px){.workspace{grid-template-columns:1fr 1fr}.workspace aside{grid-column:1/-1}.bottom{grid-template-columns:1fr}}@media(max-width:650px){.workspace{grid-template-columns:1fr}.intro{align-items:start;gap:15px}.meter{min-width:120px;padding:20px 8px}.meter strong{font-size:18px}.intro>div:first-child{max-width:65%}header{font-size:9px;gap:20px}}@media(prefers-reduced-motion:no-preference){button{transition:background .16s}}.focus{margin-bottom:15px}.focused>header,.focused>.intro,.focused>.bottom,.focused>footer{display:none}.focused .workspace{min-height:calc(100vh - 100px)}
