:root{--bg: #f4f5f7;--panel: #ffffff;--ink: #1b1f24;--muted: #6b7280;--line: #aab1bb;--accent: #2f6f4f}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Segoe UI,system-ui,-apple-system,Arial,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}.page{height:100%;display:flex;flex-direction:column;gap:10px;padding:12px 16px 16px}header{display:flex;align-items:baseline;gap:14px}header h1{margin:0;font-size:22px;color:var(--accent)}.stats{color:var(--muted);font-size:14px}.tabs{display:flex;gap:4px}.tabs button{padding:6px 14px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--muted);font:inherit;font-size:14px;cursor:pointer}.tabs button:hover{color:var(--ink)}.tabs button.active{background:var(--accent);border-color:var(--accent);color:#fff}.viewbar{display:flex;align-items:baseline}.filters{display:flex;flex-wrap:wrap;gap:8px}.filters input,.filters select{padding:7px 10px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);font:inherit;font-size:14px}.filters input:first-child{flex:1;min-width:200px}.filters button{padding:7px 14px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--muted);font:inherit;font-size:14px;cursor:pointer}.filters button:hover{color:var(--ink)}.grid{flex:1;min-height:0}.user{margin-left:auto;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:14px}.user button{padding:4px 10px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--muted);font:inherit;font-size:13px;cursor:pointer}.user button:hover{color:var(--ink)}.gate{height:100%;display:grid;place-items:center}.gate-card{display:flex;flex-direction:column;gap:10px;width:min(340px,90vw);padding:28px;background:var(--panel);border:1px solid var(--line);border-radius:10px}.gate-card h1{margin:0;font-size:22px;color:var(--accent)}.gate-card p{margin:0;color:var(--muted);font-size:14px}.gate-card input{padding:8px 10px;border:1px solid var(--line);border-radius:6px;font:inherit}.gate-card button{padding:8px 12px;border:none;border-radius:6px;background:var(--accent);color:#fff;font:inherit;cursor:pointer}.gate-card button:disabled{opacity:.6;cursor:default}.gate-card p.gate-error{color:#b3261e}