.layout{display:grid;grid-template-columns:360px minmax(0,1fr);gap:22px;align-items:start}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:26px;min-width:0}
h2{font-size:19px;margin:0 0 22px}
h3{font-size:15px;margin:26px 0 12px;color:var(--muted)}
label,legend{font-size:14px;font-weight:600}
form>label{display:block;margin:18px 0 8px}
label span{color:var(--muted);font-size:12px}
input:not([type=radio]),select{width:100%;min-width:0;background:#0c1220;border:1px solid #34425a;color:var(--text);border-radius:10px;font:inherit;padding:12px;min-height:48px}
input:focus,select:focus,button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
button{width:100%;font:inherit;font-weight:700;border-radius:10px;min-height:48px;padding:12px;cursor:pointer}
.primary{margin-top:24px;background:var(--accent);color:#08201b;border:0}
.secondary{margin-top:10px;background:transparent;color:var(--accent);border:1px solid #46756d}
.secondary[aria-pressed=true]{background:#23483e;border-color:var(--accent)}
.hint{font-size:12px;color:var(--muted);overflow-wrap:anywhere}
.result-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}
.result-heading h2{margin-bottom:16px}
.tag{color:var(--accent);font-size:11px;border:1px solid #46756d;border-radius:6px;padding:3px 7px}
.empty{padding:100px 0;color:var(--muted);text-align:center}
.notice{background:#342d1c;border:1px solid #6d5b2d;color:var(--readable-emphasis, #a9d5ff);border-radius:10px;padding:12px;font-size:13px;overflow-wrap:anywhere}
.error{background:#351f25;border-color:#74424c;color:#ffbdc6}
footer{font-size:12px;color:var(--muted);margin-top:22px;line-height:1.9}
[hidden]{display:none!important}
@media(max-width:780px){.layout{grid-template-columns:1fr}.panel{padding:22px}.empty{padding:45px 0}}@media(max-width:380px){.panel{padding:18px}.tag{max-width:130px}}
