/* Sign builder: the sign on a dark stage, the choices beside it. */
.bl{display:grid;grid-template-columns:minmax(0,7fr) minmax(360px,5fr);max-width:1700px;margin:auto;gap:clamp(20px,3vw,48px);padding:0 var(--gut) clamp(50px,7vw,90px) 0}
.bl__stage{position:sticky;top:var(--hh);height:calc(100svh - var(--hh));background:radial-gradient(70% 60% at 50% 40%,#2b2622 0,var(--night) 75%);overflow:hidden;color:var(--on)}
.bl__c{position:absolute;inset:0;width:100%;height:100%}
.bl__svg{position:absolute;inset:0;width:100%;height:100%;background:var(--paper2)}
.bl__view{position:absolute;top:14px;left:14px;display:inline-flex;gap:2px;padding:3px;background:rgba(12,11,10,.72);border:1px solid var(--online);border-radius:99px;backdrop-filter:blur(8px);z-index:2}
.bl__view button{min-height:38px;padding:6px 14px;border-radius:99px;border:0;background:none;color:var(--on);font-weight:600;font-size:14px;cursor:pointer}
.bl__view button[aria-pressed=true]{background:var(--on);color:var(--ink)}
.bl__cap{position:absolute;left:18px;right:18px;bottom:14px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font:600 13.5px/1.3 var(--mono);z-index:2}
.bl__cap small{font-weight:400;font-size:12px;opacity:.72}
.bl__svg:not([hidden])~.bl__cap{color:var(--ink)}
.bl__side{padding-top:clamp(20px,3vw,44px);display:grid;gap:0;min-width:0}
.bl__h{display:grid;gap:10px;padding-bottom:18px}.bl__h p:last-child{color:var(--ink2)}
.bl-s{padding-block:20px;border-top:1px solid var(--line);display:grid;gap:12px}
.bl-s h2{font:700 22px/1.15 var(--disp);letter-spacing:-.015em;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.bl-s h2 span{font:600 12.5px/1 var(--mono);color:var(--sigd)}
.bl-s h2 output{margin-left:auto;font:400 13px/1 var(--mono);color:var(--mut)}
.bl-places,.bl-two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bl-sizes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.bl-o{cursor:pointer;display:block}.bl-o input{position:absolute;opacity:0}
.bl-o span{display:grid;gap:2px;height:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:10px;transition:background .15s,border-color .15s,color .15s}
.bl-o:hover span{border-color:var(--ink)}
.bl-o b{font-weight:650;font-size:15.5px;line-height:1.2}.bl-o small{font-size:13px;color:var(--mut);line-height:1.25}
.bl-o input:checked+span{background:var(--ink);color:var(--on);border-color:var(--ink)}.bl-o input:checked+span small{color:var(--onm)}
.bl-o input:focus-visible+span{outline:2.5px solid var(--sig);outline-offset:2px}
.bl-sizes b{text-align:center;font:700 19px/1 var(--disp)}
.bl-f{border:0;margin:0;padding:0;display:grid;gap:6px}.bl-f legend{font-weight:600;font-size:14.5px;padding:0;margin-bottom:6px}
.bl-sum{background:var(--paper2);padding:20px;border-radius:var(--r);border:0;margin-top:6px}.bl-sum__t{font-size:15.5px;color:var(--ink2)}
.bl-sum .btn{padding-inline:12px;font-size:15px}
.bl .note{margin-top:0;font-size:14px}
@media (max-width:980px){.bl{grid-template-columns:1fr;padding:0}.bl__stage{position:sticky;top:var(--hh);height:44svh;z-index:5}.bl__side{padding:18px var(--gut) 40px}.bl__cap small{display:none}}
