/* BOARD EASY — shared design tokens + base components. Reused by every desk.
   Identity carried over from the current app: paper #fafbfa, ink #0c1210, teal #4FC0A4, dark-teal ink #1a5c50, orange #F8901F, 8px radius, quiet cards. */
:root{
/* brand (from logo + current app) */
--teal:#4fc0a4;--teal-ink:#1a5c50;--teal-ink-hover:#144840;--sky:#5bc6d2;--orange:#f8901f;--orange-ink:#a85a00;
/* surfaces & text (light) */
--paper:#fafbfa;--panel:#fff;--panel-2:#f4f7f6;--line:#e3e9e7;--line-2:#d3dcd9;
--ink:#0c1210;--mute:#4d5a56;--dim:#6b7773;
--on-primary:#fff;--primary:var(--teal-ink);--primary-hover:var(--teal-ink-hover);--accent-ink:var(--orange-ink);
/* status */
--ok:#146c54;--ok-bg:#dcf3ec;--warn:#8a5300;--warn-bg:#fdecd2;--danger:#b42318;--danger-bg:#fde4e1;--info:#0b6a76;--info-bg:#dff3f6;--soon:#3b4a46;--soon-bg:#e8eeec;
/* shape */
--radius-sm:6px;--radius:8px;--radius-lg:14px;--radius-xl:20px;--radius-pill:999px;
--shadow-1:0 1px 2px rgba(12,18,16,.05);--shadow-2:0 1px 2px rgba(12,18,16,.05),0 8px 24px rgba(26,92,80,.09);--shadow-pop:0 12px 40px rgba(12,18,16,.18);
/* spacing scale */
--s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;--s-6:32px;--s-7:48px;
/* type — no CDN: Instrument Sans if installed, else system UI; Devanagari falls back to Noto/Nirmala/Mangal */
--font:"Instrument Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","Noto Sans Devanagari","Nirmala UI","Mangal",Arial,sans-serif;
--font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
--fs-xs:.75rem;--fs-sm:.875rem;--fs-md:1rem;--fs-lg:1.2rem;--fs-xl:1.6rem;--fs-2xl:2.2rem;
/* layout */
--tap:48px;--content-max:1120px;--ease:cubic-bezier(.22,1,.36,1);
--safe-t:env(safe-area-inset-top,0px);--safe-r:env(safe-area-inset-right,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);
--hero-bg:#fff;--stripe:linear-gradient(90deg,var(--teal),var(--sky) 55%,var(--orange));
color-scheme:light dark}
@media (prefers-color-scheme:dark){:root{
--paper:#0c1517;--panel:#142226;--panel-2:#1a2b30;--line:#23383d;--line-2:#2e474d;
--ink:#eef6f5;--mute:#aec1c3;--dim:#8ea3a6;
--primary:#6fd3bb;--primary-hover:#8fe0cc;--on-primary:#0c1517;--accent-ink:#fbb04d;
--ok:#8ee6cf;--ok-bg:#0f4a42;--warn:#fbc977;--warn-bg:#4a3510;--danger:#ff9d92;--danger-bg:#4d1d19;--info:#8fdde8;--info-bg:#10414a;--soon:#c4d3d5;--soon-bg:#22373c;
--shadow-2:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);--hero-bg:#10191c}}
/* base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:var(--fs-md);line-height:1.5;background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden;padding:var(--safe-t) var(--safe-r) var(--safe-b) var(--safe-l)}
h1,h2,h3,p,ul{margin:0}
ul{padding:0;list-style:none}
a{color:var(--primary)}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.wrap{width:100%;max-width:var(--content-max);margin:0 auto;padding:0 var(--s-4)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* components */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-2);padding:var(--s-4)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);min-height:var(--tap);padding:0 var(--s-5);border:0;border-radius:var(--radius);background:var(--primary);color:var(--on-primary);font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--primary-hover)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-ghost{background:transparent;color:var(--primary);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.btn-ghost:hover{background:var(--panel-2)}
.btn-accent{background:var(--orange);color:#1a1000}
.badge{display:inline-block;font-size:var(--fs-xs);font-weight:700;padding:4px 10px;border-radius:var(--radius-pill);white-space:nowrap;background:var(--soon-bg);color:var(--soon)}
.badge.ok{background:var(--ok-bg);color:var(--ok)}.badge.warn{background:var(--warn-bg);color:var(--warn)}.badge.danger{background:var(--danger-bg);color:var(--danger)}.badge.info{background:var(--info-bg);color:var(--info)}
.field{display:flex;flex-direction:column;gap:var(--s-1)}
.field label{font-size:var(--fs-sm);font-weight:600;color:var(--mute)}
input,select,textarea{font:inherit;color:var(--ink);background:var(--panel);min-height:var(--tap);padding:0 var(--s-3);border:1.5px solid var(--line-2);border-radius:var(--radius)}
textarea{padding:var(--s-3);min-height:96px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 30%,transparent)}
.tbl{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}
.tbl th{position:sticky;top:0;background:var(--panel-2);color:var(--mute);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.05em;text-align:left;padding:10px 12px;border-bottom:2px solid var(--line-2)}
.tbl td{padding:10px 12px;border-bottom:1px solid var(--line)}
.tbl tr:hover td{background:var(--panel-2)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}