:root{--bg:#0d0f14;--card:#1a1e2e;--line:#252a3a;--gold:#f0c040;--text:#e8eaf0;--mute:#8a8fa8;--bad:#ef5350;--ok:#81c784}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 'DM Sans',system-ui,sans-serif;min-height:100vh}
h1{font:400 32px 'DM Serif Display',Georgia,serif;margin:0 0 6px}
.wrap{max-width:720px;margin:0 auto;padding:48px 20px}
.mute{color:var(--mute)}
input,select,button{font:inherit}
input,select{width:100%;padding:12px 14px;background:var(--bg);border:1px solid var(--line);color:var(--text);border-radius:8px}
input:focus,select:focus,button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.btn{display:inline-block;padding:12px 20px;margin-top:20px;background:var(--gold);color:#000;border:0;border-radius:8px;font-weight:700;cursor:pointer;text-decoration:none}
label{display:block;margin:16px 0 6px;color:var(--mute);font-size:14px}
.msg{min-height:22px;margin-top:14px;font-size:14px}.err{color:var(--bad)}.ok{color:var(--ok)}
.panel{max-width:400px;margin:12vh auto;padding:32px;background:var(--card);border:1px solid var(--line);border-radius:14px}
a.tool{display:block;padding:22px;margin-bottom:12px;background:var(--card);border:1px solid var(--line);border-radius:12px;color:var(--text);text-decoration:none}
a.tool:hover{border-color:var(--gold)}a.tool b{font-size:18px}a.tool span{display:block;color:var(--mute);font-size:14px}
.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.top a{color:var(--mute)}