/* public/css/tokens.css — shared design system */
:root{
  color-scheme: dark; /* tells the browser to render native pickers (dropdowns, date/time inputs) in dark mode */
  --graphite-950:#14171A;
  --graphite-900:#191D21;
  --graphite-800:#1F2429;
  --graphite-700:#2A2F35;
  --graphite-600:#3A4048;
  --hivis:#FF6A1A;
  --hivis-dim:#B9500F;
  --safety-yellow:#FFC53D;
  --site-green:#3ED07D;
  --alert-red:#FF5A5A;
  --fog-100:#EEF0F2;
  --fog-300:#C3C9D0;
  --fog-500:#8A929B;
  --radius:14px;
  --display:'Archivo Black', sans-serif;
  --body:'Inter', sans-serif;
  --mono:'JetBrains Mono', monospace;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--graphite-950);
  color:var(--fog-100);
  font-family:var(--body);
  min-height:100vh;
}
::selection{background:var(--hivis);color:#14171A;}
:focus-visible{outline:2px solid var(--hivis);outline-offset:2px;}

.eyebrow{
  font-family:var(--mono);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--hivis);margin:0 0 6px;
}
h1.page-title{font-family:var(--display);font-size:22px;letter-spacing:.3px;margin:0 0 4px;}
.page-sub{color:var(--fog-500);font-size:13.5px;margin:0 0 20px;}

.btn{
  font-family:var(--body);font-weight:600;font-size:14px;border:none;border-radius:9px;
  padding:12px 18px;cursor:pointer;transition:transform .12s ease, background .15s ease;
}
.btn:active{transform:scale(.96);}
.btn:disabled{opacity:.5;cursor:default;}
.btn-primary{background:var(--hivis);color:#14171A;}
.btn-primary:hover:not(:disabled){background:#ff7a33;}
.btn-ghost{background:var(--graphite-800);color:var(--fog-100);border:1px solid var(--graphite-700);}
.btn-ghost:hover:not(:disabled){background:var(--graphite-700);}

.field{margin-bottom:14px;}
.field label{display:block;font-size:12.5px;color:var(--fog-500);margin-bottom:6px;font-weight:600;}
.field input, .field select{
  width:100%;background:var(--graphite-800);border:1px solid var(--graphite-700);border-radius:9px;
  padding:11px 14px;color:var(--fog-100);font-family:var(--body);font-size:14px;
}
.field input:focus, .field select:focus{outline:none;border-color:var(--hivis);}
select option{background:var(--graphite-800);color:var(--fog-100);}

.badge{font-family:var(--mono);font-size:11px;font-weight:600;padding:4px 9px;border-radius:6px;letter-spacing:.3px;}
.badge.valid{background:rgba(62,208,125,.15);color:var(--site-green);}
.badge.flag{background:rgba(255,90,90,.15);color:var(--alert-red);}
.badge.adhoc{background:rgba(255,197,61,.15);color:var(--safety-yellow);}

.feed-photo{
  width:40px;height:40px;border-radius:50%;background:var(--graphite-700);
  flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;
  border:2px solid var(--graphite-600);
}
.panel{background:var(--graphite-900);border:1px solid var(--graphite-700);border-radius:var(--radius);padding:6px;}
.feed-row{display:flex;align-items:center;gap:14px;padding:14px 16px;}
.feed-row + .feed-row{border-top:1px solid var(--graphite-800);}
.feed-main{flex:1;min-width:0;}
.feed-name{font-weight:600;font-size:14px;}
.feed-meta{font-size:12.5px;color:var(--fog-500);margin-top:2px;}
.feed-time{font-family:var(--mono);font-size:12px;color:var(--fog-500);}

.toast{
  position:fixed;bottom:20px;left:50%;transform:translateX(-50%) translateY(20px);
  background:var(--graphite-700);color:var(--fog-100);padding:12px 20px;border-radius:10px;
  font-size:13.5px;font-weight:600;opacity:0;transition:opacity .25s ease, transform .25s ease;
  pointer-events:none;z-index:999;border:1px solid var(--graphite-600);
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important;transition-duration:.001ms !important;}
}
