/* ── [ADMIN-LOOK-01] "Try the new look" — Chris's reference look (2026-09-26 / 2026-10-07 pictures): near-black
   background, rounded glowing cards, colored accent tiles with small capital labels and big numbers, pill chips.
   Everything is scoped under html.look-new, set per LOGIN by src/lib/newlook.js (profiles.prefs.newlook). Off =
   the tokens as they are. First surface: the office job sheet ([JOB-ONE-PLACE-01] v0.510.0); the frame comes later. */
html.look-new {
  --bg:        #0a0e16;
  --surface:   #111827;
  --surface2:  #0f1522;
  --surface0:  #0b1020;
  --hover:     #1a2234;
  --card-bg:   #111827;
  --text:      #eef2f7;
  --text2:     #c3cbd8;
  --ink:       #eef2f7;
  --muted:     #9aa5b8;
  --faint:     #8b95a8;
  --border:    rgba(255, 255, 255, 0.08);
  --skeleton-sheen: rgba(255, 255, 255, 0.07);
  --accent:       #f5b73a;
  --brand-blue:   #3b82f6;
  --brand-green:  #22c55e;
  --info:         #93c5fd;
  --pass-fill: rgba(34, 197, 94, 0.12);  --pass-edge: rgba(34, 197, 94, 0.5);  --pass-text: #86efac;
  --fail-fill: rgba(239, 68, 68, 0.12);  --fail-edge: rgba(239, 68, 68, 0.45); --fail-text: #fca5a5;
  --warn-fill: rgba(245, 183, 58, 0.10); --warn-edge: rgba(245, 183, 58, 0.55); --warn-text: #fcd77a;
  --shadow-card:    0 10px 30px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  --shadow-overlay: 0 8px 30px rgba(0, 0, 0, 0.6);
  color-scheme: dark;
}
html.look-new body { background: radial-gradient(1200px 600px at 20% -10%, #14213a 0%, var(--bg) 55%); }
html.look-new .card { background: linear-gradient(180deg, #131b2c, #0f1522); border: 1px solid var(--border); border-radius: 18px; }
html.look-new .jobone__tile {
  border-left: 0; border: 1px solid var(--border); border-radius: 16px; color: #fff;
  background: linear-gradient(160deg, var(--a1), var(--a2));
  box-shadow: 0 0 0 1px rgba(255,255,255,.02), 0 12px 26px rgba(0,0,0,.35), 0 0 40px -14px var(--glow);
}
html.look-new .jobone__tile-l, html.look-new .jobone__tile-s { color: rgba(255,255,255,.75); }
html.look-new .jobone__tile-v { color: #fff; }
html.look-new .jobone__tile--blue   { --a1: #1b3a7a; --a2: #0f1f45; --glow: #3b82f6; }
html.look-new .jobone__tile--gold   { --a1: #6b4a12; --a2: #2d2110; --glow: #f5b73a; }
html.look-new .jobone__tile--violet { --a1: #3f2a7a; --a2: #1b1440; --glow: #8b5cf6; }
html.look-new .jobone__tile--teal   { --a1: #0f4f4a; --a2: #0b2a2a; --glow: #14b8a6; }
html.look-new .jobone__tile--red    { --a1: #6b1f1f; --a2: #2b1111; --glow: #ef4444; }
html.look-new .jobone__tile--green  { --a1: #145a2d; --a2: #0c2b1a; --glow: #22c55e; }
html.look-new .jobone__tile--grey   { --a1: #2a3344; --a2: #151b27; --glow: #64748b; }
html.look-new .jobone__pill { background: rgba(255,255,255,.03); }
html.look-new .jobone__tab--on { background: var(--accent); color: #1a1200; }
html.look-new .jobone__later { background: rgba(139, 92, 246, .08); border-color: rgba(139, 92, 246, .3); color: #e9e2ff; }
html.look-new .jobone__later-go { color: #c4b5fd; }
html.look-new .btn--primary { background: linear-gradient(180deg, #f5c65a, #e0a526); color: #1a1200; border-color: transparent; box-shadow: 0 8px 20px -8px #f5b73a; }
html.look-new .input, html.look-new select.input { background: #0a1020; color: var(--text); border-color: var(--border); }
