@font-face{font-family:PostDisplay;src:url('/vendor/display.ttf') format('truetype');font-display:swap;font-weight:200 700}
:root{--bg:#f4f1e8;--fg:#1d1c18;--accent:#bc3025;--soft:#5e5a50;--rule:#b4ae9f;--plate:#eae6da;--panel:#faf8f0;--art:url('/art/poster.svg');font:16px/1.45 Arial,Helvetica,sans-serif;color-scheme:light}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg)}button,input{font:inherit}button,.pick{cursor:pointer}button{color:inherit}button:disabled{opacity:.55;cursor:wait}button:focus-visible,.pick:focus-within{outline:3px solid var(--accent);outline-offset:3px}button:hover,.pick:hover{filter:brightness(.91)}[hidden],.defs{display:none!important}svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}::selection{background:var(--accent);color:var(--bg)}
.shell{max-width:1510px;margin:auto;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto auto;padding:0 clamp(22px,5.3vw,84px)}
header,.utility,footer,.brand,.route,.themes,.privacy,button,.station-head,.station-foot{display:flex;align-items:center}
header{height:clamp(66px,10vh,92px);justify-content:space-between;border-bottom:2px solid var(--fg)}.brand{font-weight:800;font-size:25px;letter-spacing:-1.1px;gap:11px}.brand svg{color:var(--accent);width:34px;height:34px;stroke:none}
.route{gap:8px;font-size:13px;color:var(--soft)}.route svg{width:16px;height:16px}.route svg:nth-of-type(2){margin:0 6px}
main{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(300px,.82fr);gap:clamp(25px,5vw,84px);align-items:center;padding:clamp(24px,5vh,60px) 0}
.intro{min-width:0}.intro h1{font-family:PostDisplay,'Arial Narrow',sans-serif;font-weight:650;font-size:clamp(50px,min(7.4vw,12vh),114px);text-transform:uppercase;letter-spacing:-.045em;line-height:1.04;margin:0}.intro h1 em{font-style:normal;color:var(--accent)}.intro p{font-size:clamp(16px,1.38vw,21px);line-height:1.45;max-width:38ch;margin:24px 0 0}.art{width:clamp(190px,24vw,370px);height:clamp(78px,16vh,160px);margin-top:clamp(18px,4vh,44px);background:var(--art) left center/contain no-repeat}
.station{width:min(100%,478px);justify-self:end;background:var(--panel);border:1.5px solid var(--fg);align-self:center}.station-head,.station-foot{justify-content:space-between;padding:0 clamp(13px,1.8vw,26px);gap:12px}.station-head{height:51px;border-bottom:1px solid var(--fg);font-weight:700;font-size:14px}.station-head span{display:flex;align-items:center;gap:9px}.station-head span:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);flex:none}#timer{font-family:ui-monospace,Consolas,monospace;font-size:14px;color:var(--soft);font-variant-numeric:tabular-nums}.station-foot{border-top:1px solid var(--rule);height:48px;color:var(--soft);font-size:14px}.station-foot strong{color:var(--fg);font-size:15px}
.field{display:grid;place-items:center;padding:18px;min-height:clamp(224px,42vh,395px);background-color:var(--plate);background-image:radial-gradient(var(--rule) .7px,transparent .8px);background-size:8px 8px}
#qr{width:clamp(186px,min(24vw,34vh),320px);aspect-ratio:1;background:white;position:relative;outline:1px solid var(--fg);outline-offset:6px}#qr canvas{display:block;width:100%;height:100%;image-rendering:pixelated}
#message{text-align:center;width:min(100%,340px);padding:12px;background:var(--plate)}.large-icon{margin:0 auto 9px;width:32px;height:32px;color:var(--accent)}h2{font-size:21px;margin:0;text-wrap:balance}#detail{font-size:14px;overflow-wrap:anywhere;margin:8px auto;color:var(--soft);max-width:34ch;white-space:pre-line}#detail:empty{display:none}
.utility{justify-content:space-between;min-height:55px;border-top:1px solid var(--fg);gap:12px}.privacy,#renew{gap:8px;font-size:14px}.privacy{color:var(--soft)}.privacy svg,#renew svg{width:16px;height:16px}button{border:0;background:transparent;justify-content:center;min-height:44px}#renew{padding:0 4px;font-weight:600}
footer{min-height:70px;border-top:1px solid var(--rule);justify-content:space-between}.theme-label{font-size:13px;color:var(--soft)}.themes{gap:4px}.themes button{gap:8px;padding:0 13px;font-size:13px;font-weight:600;border:1px solid transparent;min-height:44px}.themes [aria-pressed=true]{border-color:var(--fg);background:var(--panel)}.themes i{display:block;width:13px;height:13px;background:linear-gradient(135deg,#e8dec7 45%,#c1372a 46%)}[data-pick=signal] i{background:linear-gradient(90deg,#234139 50%,#bed99a 50%)}[data-pick=paper] i{background:linear-gradient(145deg,#dfcfad 50%,#774d3b 50%)}
.action,.secondary{display:flex;position:relative;align-items:center;justify-content:center;min-height:46px;font-weight:650;font-size:16px;padding:8px 16px}.action{margin:14px auto 0;background:var(--fg);color:var(--bg);min-width:160px}.secondary{margin-top:4px;text-decoration:underline;text-underline-offset:4px}.pick input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.pick input::file-selector-button{cursor:pointer}
html[data-theme=signal]{--bg:#10231f;--fg:#e5efdc;--accent:#c2f389;--soft:#afc4b7;--plate:#19332a;--panel:#132c24;--rule:#557163;--art:url('/art/signal.svg');color-scheme:dark}
[data-theme=signal] main{grid-template-columns:minmax(270px,.85fr) minmax(0,1.15fr)}[data-theme=signal] .intro{grid-column:2;grid-row:1}[data-theme=signal] .station{grid-row:1;grid-column:1;justify-self:start;border-radius:18px;overflow:hidden}[data-theme=signal] .field{background-image:linear-gradient(to right,#28473b 1px,transparent 1px),linear-gradient(#28473b 1px,transparent 1px);background-size:24px 24px}[data-theme=signal] h1{font-family:Arial,sans-serif;font-size:clamp(48px,5.2vw,86px);text-transform:none;line-height:1.05;font-weight:550}[data-theme=signal] .brand svg{color:#54825d}
html[data-theme=paper]{--bg:#f6eee1;--fg:#382f25;--accent:#8b4d36;--soft:#66594a;--rule:#c0ad93;--panel:#fff8ed;--plate:#eee3d1;--art:url('/art/paper.svg')}
[data-theme=paper] .intro h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(54px,6.4vw,102px);text-transform:none;font-weight:400;letter-spacing:-.055em}[data-theme=paper] .intro h1 em{font-style:italic}[data-theme=paper] header{border-bottom:3px double var(--fg)}[data-theme=paper] .station{outline:1px solid var(--rule);outline-offset:5px;border-color:var(--accent);transform:rotate(1deg)}[data-theme=paper] .field{background-image:none}[data-theme=paper] .station-head{border-bottom:1px dashed var(--rule)}[data-theme=paper] .brand{font-family:Georgia,serif}
@media(max-width:740px) and (min-height:520px){.shell{padding:0 18px}header{height:59px}.brand{font-size:21px}.brand svg{width:28px;height:28px}.route span,.route svg:nth-of-type(2){display:none}
main,[data-theme=signal] main{display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:16px;padding:16px 0}.intro h1,[data-theme=signal] .intro h1,[data-theme=paper] .intro h1{font-size:clamp(31px,min(8vw,5.8vh),48px);line-height:1.05}.intro h1 br{display:none}.intro h1 em:before{content:" "}.intro p{font-size:15px;margin-top:8px;max-width:47ch}.art{display:none}.station{width:100%;max-width:460px;align-self:center}.field{min-height:clamp(190px,33vh,330px);padding:12px}.station-head,.station-foot{height:38px}#qr{width:clamp(164px,26vh,250px)}.utility{min-height:44px}footer{min-height:54px}.themes button{padding:0 8px}.theme-label,.privacy,#renew{font-size:12px}[data-theme=paper] .station{transform:none;outline-offset:2px}}
@media(max-height:600px) and (min-width:550px){.shell{padding:0 24px}header{height:47px}main,[data-theme=signal] main{display:grid;grid-template-columns:minmax(0,1fr) minmax(235px,.85fr);gap:24px;padding:10px 0}.art{height:48px;margin-top:10px}.intro h1,[data-theme=signal] .intro h1,[data-theme=paper] .intro h1{font-size:clamp(35px,8vh,52px)}.intro p{font-size:14px;margin-top:12px}.field{min-height:130px;padding:8px}#qr{width:clamp(114px,29vh,165px)}.station-head,.station-foot{height:29px;font-size:12px}.large-icon{display:none}.utility,footer{min-height:42px}#message{padding:4px}.phone .art{display:none}.phone .action,.phone .secondary{margin:2px 0;min-height:40px}}
@media(max-width:365px){.theme-label{display:none}footer{justify-content:center}.privacy,#renew{font-size:11px}.intro p{font-size:14px}}
@media(max-width:740px) and (max-height:710px) and (min-height:520px){.phone .intro p{display:none}.phone .field{min-height:166px}.phone .station-head,.phone .station-foot{height:34px}.phone .large-icon{display:none}.phone main{gap:12px;padding:10px 0}.phone #message{padding:5px}}