:root{color-scheme:light dark}html,body{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:#0b0b0c;color:#f5f5f5}.app{min-height:100dvh;display:grid;grid-template-rows:auto 1fr auto}.header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;padding-top:max(12px,env(safe-area-inset-top));border-bottom:1px solid rgba(255,255,255,.08);background:#00000059;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.title{font-weight:700;letter-spacing:.2px}.actions{display:flex;gap:8px;align-items:center}.select{background:#ffffff14;border:1px solid rgba(255,255,255,.12);color:inherit;padding:8px 10px;border-radius:10px}.content{padding:14px}.card{border-radius:14px;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;padding:14px;display:grid;gap:12px}.card h2{margin:0 0 12px;font-size:18px}.hint{margin:10px 0 0;opacity:.8;font-size:14px}.hint.ok{opacity:1;color:#50fa7b}.hint.err{opacity:1;color:#ff6b6b}.list{display:grid;gap:8px}.list-item{text-align:left;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.08);background:#ffffff0d;color:inherit;font-size:14px}.list-item:hover{background:#ffffff1f}.form{display:grid;gap:12px;margin-top:12px}.form-row{display:grid;gap:6px}.label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;opacity:.7}.input{background:#ffffff14;border:1px solid rgba(255,255,255,.12);color:inherit;padding:10px 12px;border-radius:12px;font-size:14px}.button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,.12);background:#ffffff14;color:inherit;padding:10px 12px;border-radius:12px;font-weight:600}.tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:10px;padding-bottom:max(10px,env(safe-area-inset-bottom));border-top:1px solid rgba(255,255,255,.08);background:#00000059;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;color:inherit;padding:10px 8px;border-radius:12px;font-size:13px}.tab.active{background:#ffffff1f;border-color:#ffffff2e}
