.hidden{display:none!important}
.panel{background:var(--panel);border:1px solid var(--line);border-bottom:3px solid var(--edge);border-radius:6px;padding:18px 20px;margin-bottom:16px;box-shadow:0 8px 16px -12px rgba(20,28,36,.45)}
.panel h2{font-size:1.02rem;margin:0 0 10px;font-weight:800}
label{display:block;font-weight:700;font-size:.8rem;margin-bottom:4px}
select{width:100%;font:inherit;padding:9px 11px;border:1px solid var(--edge);border-radius:4px;background:var(--field);color:var(--ink)}
textarea{max-height:none;resize:vertical;min-height:5.5em}
.row{display:flex;gap:8px}.row>input{flex:1;min-width:0;width:auto}
button.primary{}
button.quiet{background:var(--panel);color:var(--ink);border-color:var(--edge)}
.pair-grid{display:grid;gap:16px;margin-bottom:16px}
@media(min-width:560px){.pair-grid{grid-template-columns:1fr 1fr}}
.pair-grid .panel{margin:0}.pair-grid p{margin:0 0 14px;color:var(--mute);font-size:.9rem}
.code-card{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--readout);border:1px solid var(--ro-line);border-radius:6px;padding:14px 18px;margin-bottom:12px;color:var(--ro-sub)}
.code-card small{display:block;font-size:.8rem}
.code{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:clamp(1.7rem,8vw,2.4rem);font-weight:800;letter-spacing:.12em;line-height:1.3;color:var(--ro-ink)}
.status{font-size:.86rem;color:var(--mute);display:flex;align-items:center;gap:8px;margin:0 0 16px}
.dot{width:9px;height:9px;border-radius:50%;background:var(--ok);flex:none}.dot.off{background:var(--bad)}
.banner{border:2px solid var(--amber);background:var(--panel);border-radius:6px;padding:14px 16px;margin-bottom:16px}
.banner p{margin:0 0 10px;font-weight:700;overflow-wrap:anywhere}
.banner ul{list-style:none;margin:0 0 12px;padding:0}
.banner li{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:.9rem}
.banner li span{flex:1;min-width:0;overflow-wrap:anywhere}
.banner .row{flex-wrap:wrap}
.send-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px}
.hint{font-size:.8rem;color:var(--mute);margin:0}
ul.history{list-style:none;margin:0;padding:0}
ul.history li{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line)}
ul.history li:first-child{border-top:0}
.who{font-size:.75rem;color:var(--mute);flex:none;width:3.2em}.who.in{color:var(--blue);font-weight:700}
.link{flex:1;min-width:0;overflow-wrap:anywhere;font-size:.9rem}
.panel .empty{margin:0;text-align:left;font-size:.9rem}
.err{padding:0;margin:10px 0 0;min-height:0;font-size:.86rem}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--plate);color:#fff;border-bottom:3px solid var(--amber);padding:9px 16px;border-radius:5px;font-size:.88rem;font-weight:700;max-width:90vw;z-index:50}
.foot{text-align:center;margin-top:8px}
main{max-width:640px}