:root{--bg:#f4f1ea;--surface:#fff;--text:#1f1a17;--muted:#6b625a;--border:#ddd4c8;--accent:#2f5d50;--danger:#a33b3b}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--text);margin:0;font-family:ui-sans-serif,system-ui,sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}.shell{flex-direction:column;min-height:100vh;display:flex}.topnav{border-bottom:1px solid var(--border);background:var(--surface);align-items:center;gap:1rem;padding:.9rem 1.25rem;display:flex}.topnav .brand,.topnav .piko-logo-link{align-items:center;margin-right:auto;line-height:0;display:inline-flex}.topnav a{color:var(--muted)}.topnav a.active,.topnav a:hover{color:var(--text)}.piko-logo-img{display:block}.page{width:min(1000px,100%);margin:0 auto;padding:1.5rem}.login-wrap{place-items:center;min-height:100vh;padding:1.5rem;display:grid}.login-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;width:min(400px,100%);padding:1.5rem}.field{flex-direction:column;gap:.35rem;margin-top:.85rem;display:flex}.field label{color:var(--muted);font-size:.8rem;font-weight:600}.field input,.field select{border:1px solid var(--border);background:#fff;border-radius:10px;padding:.7rem .85rem}.btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:10px;justify-content:center;align-items:center;padding:.7rem 1rem;display:inline-flex}.btn:disabled{opacity:.6}.btn.secondary{color:var(--text);border:1px solid var(--border);background:#fff}.btn.danger{background:var(--danger)}.muted{color:var(--muted);font-size:.85rem}.error{color:var(--danger);font-size:.85rem}.row{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.actions{flex-wrap:wrap;gap:.75rem;margin-top:1.25rem;display:flex}.table{border-collapse:collapse;background:var(--surface);border:1px solid var(--border);border-radius:12px;width:100%;overflow:hidden}.table th,.table td{text-align:left;border-bottom:1px solid var(--border);padding:.85rem 1rem;font-size:.92rem}.table th{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;background:#f8f5ef;font-size:.78rem}.badge{color:#24563f;background:#e8efe9;border-radius:999px;padding:.15rem .5rem;font-size:.75rem;font-weight:600;display:inline-block}.badge.warn{color:#8a2f2f;background:#f8e8e8}.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin-top:1rem;padding:1.25rem}.feature-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:.75rem 0;display:flex}.feature-row:last-child{border-bottom:none}.switch{align-items:center;gap:.5rem;display:flex}.chip{border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:999px;padding:.35rem .75rem}.chip.active{background:var(--text);color:#fff;border-color:var(--text)}
