@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@400;500;600;700&family=DM+Sans:wght@400;500;600&family=JetBrains+Mono:wght@400;500;600&display=swap');
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text);line-height:1.7;overflow-x:hidden}
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(circle at 20% 20%,rgba(249,115,22,.03) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(52,211,153,.02) 0%,transparent 50%),linear-gradient(rgba(255,255,255,.01) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.01) 1px,transparent 1px);background-size:100% 100%,100% 100%,40px 40px,40px 40px}

/* Base palette — guide pages (Palette A pages override below) */
:root{
  --bg:#0e0f13;--surface:#16171d;--surface2:#1e1f27;--surface3:#262730;
  --border:#2a2b36;--border2:#31334a;
  --text:#e8e6f0;--text2:#9d9baf;--text3:#8a889e;
  --accent:#f97316;--accent2:#ea580c;--accent-bg:rgba(249,115,22,.08);
  --purple:#f97316;--purple-bg:rgba(249,115,22,.08);--purple-border:rgba(249,115,22,.25);
  --green:#34d399;--green-bg:rgba(52,211,153,.08);--green-border:rgba(52,211,153,.25);
  --amber:#fbbf24;--amber-bg:rgba(251,191,36,.08);--amber-border:rgba(251,191,36,.25);
  --red:#f87171;--red-bg:rgba(248,113,113,.06);
  --blue:#60a5fa;--blue-bg:rgba(96,165,250,.08);--blue-border:rgba(96,165,250,.25);
  --cyan:#22d3ee;--cyan-bg:rgba(34,211,238,.08);--cyan-border:rgba(34,211,238,.25);
  --radius:10px;--radius-lg:14px;
}

/* Layout */
.container{max-width:820px;margin:0 auto;padding:2rem 1.25rem 4rem;position:relative;z-index:1}
.subtitle{color:var(--text2);font-size:.95rem;margin-bottom:2rem}
h2{font-size:1.15rem;font-weight:600;margin-bottom:.75rem}
.section{margin-bottom:2.5rem}
.divider{border:none;border-top:1px solid var(--border);margin:2rem 0}
.hidden{display:none}

/* Typography & utilities */
.mono{font-family:'JetBrains Mono',monospace;font-size:.82rem}

/* Cards */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.15rem;margin-bottom:10px}
.card h3{font-size:.95rem;font-weight:600;margin-bottom:4px}
.card p{font-size:.88rem;color:var(--text2);line-height:1.65}

/* Labels */
.label{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;padding:2px 8px;border-radius:4px;display:inline-block;margin-bottom:6px}

/* Notification boxes */
.tip-box{background:var(--green-bg);border:1px solid var(--green-border);border-left:3px solid var(--green);border-radius:0 var(--radius) var(--radius) 0;padding:1rem 1.15rem;margin-bottom:1rem}
.tip-box h3{font-size:.9rem;font-weight:600;color:var(--green);margin-bottom:4px}
.tip-box p{font-size:.85rem;color:var(--text2)}
.warn-box{background:rgba(248,113,113,.06);border:1px solid rgba(248,113,113,.2);border-left:3px solid var(--red);border-radius:0 var(--radius) var(--radius) 0;padding:1rem 1.15rem;margin-bottom:1rem}
.warn-box h3{font-size:.9rem;font-weight:600;color:var(--red);margin-bottom:4px}
.warn-box p{font-size:.85rem;color:var(--text2)}

/* Time converter — shared */
.tc-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:.9rem 1rem;margin-bottom:1.25rem}
.tc-title{font-size:.65rem;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;font-weight:600;margin-bottom:.75rem;display:flex;align-items:center;gap:8px}
.tc-title::after{content:'';flex:1;height:1px;background:var(--border)}
.tc-row{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}
.tc-field{display:flex;flex-direction:column;gap:4px;flex:1;min-width:130px}
.tc-lbl{font-size:.62rem;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.tc-inp{background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:8px 10px;color:var(--text);font-family:'JetBrains Mono',monospace;font-size:.92rem;width:100%;box-sizing:border-box}
.tc-inp:focus{outline:none;border-color:var(--cyan)}
.tc-arrow{font-size:1.1rem;color:var(--text3);padding-bottom:7px;flex-shrink:0}
.tc-hint{font-size:.72rem;color:var(--text3);margin-top:.5rem;font-family:'JetBrains Mono',monospace}
.tc-dual{display:flex;align-items:center;gap:6px;margin-top:6px;flex-wrap:wrap;min-height:1.1em}
.tc-chip{display:inline-flex;align-items:center;gap:5px;background:var(--surface3);border:1px solid var(--border);border-radius:5px;padding:3px 8px;font-family:'JetBrains Mono',monospace;font-size:.78rem}
.tc-tag{font-size:.55rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text3)}
.tc-d24{color:var(--text);font-weight:600}
.tc-d12{color:var(--text2)}