/**
 * @file        styles.css
 * @description SynthCalc styles: light/dark tokens, responsive shell, forms, calculator keypad, tables
 *
 * @author      Thomas Dobler - SYNTHETIXMIND LTD
 * @email       tom@synthetixmind.com
 * @company     SYNTHETIXMIND LTD, Paphos, Cyprus
 * @url         https://synthetixmind.com
 *
 * @uid         3feb9733-c95e-4fb9-8dfb-0cb21341f86b
 * @version     0.1.0.2
 * @created     2026-11-02
 * @updated     2026-11-02
 *
 * @copyright   (c) 2026 by SYNTHETIXMIND LTD
 * @license     Proprietary — All rights reserved
 */:root{color-scheme:light dark;--bg: #f3f5f8;--surface: #ffffff;--surface-2: #eef1f5;--border: #d5dbe3;--text: #121a24;--muted: #4f5d6e;--accent: #0f766e;--accent-text: #ffffff;--accent-soft: #d6f2ee;--danger: #b42318;--radius: 14px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}@media(prefers-color-scheme:dark){:root{--bg: #0f1720;--surface: #17212d;--surface-2: #1f2b39;--border: #2d3b4c;--text: #e8eef5;--muted: #a7b4c3;--accent: #2dd4bf;--accent-text: #062a26;--accent-soft: #123b39;--danger: #ff8a80}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}a{color:var(--accent)}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip{position:absolute;left:16px;top:-48px;padding:8px 12px;background:var(--accent);color:var(--accent-text);border-radius:8px;z-index:10}.skip:focus{top:12px}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.top,.layout,.foot{max-width:1180px;margin:0 auto;padding:0 16px}.top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:20px;padding-bottom:16px}.brand{display:flex;align-items:center;gap:12px}.logo{border-radius:10px}.name{margin:0;font-size:1.5rem;font-weight:700}.tagline{margin:0;color:var(--muted);font-size:.9rem}.layout{display:grid;grid-template-columns:220px 1fr;gap:16px;align-items:start}.panel,.sidebar{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.panel{padding:20px;min-width:0}.panel h1{margin:0 0 16px;font-size:1.4rem}.sidebar{padding:12px;position:sticky;top:12px}.picker{display:none}.nav-heading{margin:8px 8px 4px;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.nav-list ul{list-style:none;margin:0 0 8px;padding:0}.nav-link{display:block;padding:6px 10px;border-radius:8px;color:var(--text);text-decoration:none}.nav-link:hover{background:var(--surface-2)}.nav-link[aria-current=page]{background:var(--accent-soft);color:var(--text);font-weight:600;box-shadow:inset 3px 0 0 var(--accent)}.form{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px 16px;margin-bottom:16px}.form-heading{grid-column:1 / -1;margin:8px 0 0;font-size:1rem}.field{display:grid;gap:4px;min-width:0}.field label{font-size:.9rem;color:var(--muted)}.field.check{display:flex;align-items:center;gap:8px}.field.check label{color:var(--text)}input,select,.button{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:8px 10px;min-height:42px;width:100%}input[type=checkbox]{width:20px;min-height:20px;height:20px;accent-color:var(--accent)}input.num{font-variant-numeric:tabular-nums}.button{width:auto;cursor:pointer;background:var(--accent);color:var(--accent-text);border-color:transparent;font-weight:600}.button.ghost{background:transparent;color:var(--text);border-color:var(--border)}.button.small{min-height:34px;padding:4px 10px;font-size:.85rem}.lang select{width:auto}.results{display:grid;gap:8px;margin:0 0 12px}.result{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:10px 14px;background:var(--surface-2);border-radius:10px}.result dt{color:var(--muted)}.result dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums;text-align:right;overflow-wrap:anywhere}.result.strong{background:var(--accent-soft)}.result.strong dd{font-size:1.25rem}.error{color:var(--danger);padding:10px 14px;background:var(--surface-2);border-radius:10px}.note{color:var(--muted);font-size:.85rem;margin:8px 0 0}.big-result{display:block;font-size:1.3rem;font-weight:700;padding:12px 14px;margin-bottom:12px;background:var(--accent-soft);border-radius:10px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.big-result:empty{display:none}.unit-pair{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:end;grid-column:1 / -1}.table-scroll{max-height:480px;overflow:auto;border:1px solid var(--border);border-radius:10px}table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}caption{text-align:left;font-weight:600;padding:10px 12px}th,td{padding:6px 12px;text-align:right;border-top:1px solid var(--border);white-space:nowrap}th:first-child,td:first-child{text-align:left}thead th{position:sticky;top:0;background:var(--surface-2)}.calc-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:20px}.calc-display{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:10px 12px;margin-bottom:12px}.calc-input{border:0;background:transparent;font-size:1.6rem;text-align:right;padding:4px 0;font-variant-numeric:tabular-nums}.calc-input:focus-visible{outline:none}.calc-display:focus-within{outline:3px solid var(--accent);outline-offset:2px}.calc-result{display:block;min-height:1.6em;text-align:right;color:var(--muted);font-size:1.1rem;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.calc-result.error{color:var(--danger);background:transparent;padding:0}.keypad{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.key{font:inherit;font-size:1.05rem;min-height:48px;border-radius:10px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);cursor:pointer}.key.digit{background:var(--surface);font-weight:600}.key.equals{background:var(--accent);color:var(--accent-text);font-weight:700;border-color:transparent}.key:active{transform:translateY(1px)}.calc-side{display:grid;gap:12px;align-content:start}.history-head{display:flex;justify-content:space-between;align-items:center}.history-head h3{margin:0;font-size:1rem}.history{list-style:none;margin:0;padding:0;max-height:360px;overflow:auto;display:grid;gap:4px}.history-entry{font:inherit;width:100%;display:grid;text-align:right;background:transparent;color:var(--text);border:1px solid transparent;border-radius:8px;padding:6px 8px;cursor:pointer;font-variant-numeric:tabular-nums}.history-entry:hover{border-color:var(--border)}.history-expr{color:var(--muted);font-size:.85rem;overflow-wrap:anywhere}.history-value{font-weight:600;overflow-wrap:anywhere}.muted{color:var(--muted)}.grade-rows{display:grid;gap:8px;margin-bottom:12px}.grade-row{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:8px;align-items:end}.grade-rows+.button{margin-bottom:16px}.zones{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:8px}.zone{display:grid;grid-template-columns:1fr auto auto auto;gap:12px;align-items:center;padding:10px 14px;background:var(--surface-2);border-radius:10px}.zone.local{grid-template-columns:1fr auto;background:var(--accent-soft)}.zone-time{font-weight:700;font-variant-numeric:tabular-nums}.zone-diff{color:var(--muted);font-size:.85rem}.foot{padding-top:24px;padding-bottom:32px;text-align:center;color:var(--muted);font-size:.85rem}.foot p{margin:4px 0}@media(max-width:900px){.layout{grid-template-columns:1fr}.sidebar{position:static;padding:8px}.picker{display:block}.nav-list{display:none}.calc-layout{grid-template-columns:1fr}}@media(max-width:520px){.panel{padding:14px}.grade-row{grid-template-columns:1fr 1fr}.grade-row>.field:first-child{grid-column:1 / -1}.zone{grid-template-columns:1fr auto}.unit-pair{grid-template-columns:1fr}.tagline{display:none}}@media(prefers-reduced-motion:reduce){.key:active{transform:none}}