/* THE MERCURIAL WORLD — HG DESIGN SYSTEM v0.6.0 MASTER-LANGUAGE PROPAGATION CANDIDATE
   Whole-campus propagation layer. Native-room identity remains controlling; this layer harmonizes materials, typography, framing, and controls without replacing accepted mechanics.
   Design law: impossible architecture rendered with engineering seriousness;
   mythic distance / instrument precision up close. */

:root{
  --hg-black-0:#030303;
  --hg-black-1:#070707;
  --hg-black-2:#0c0c0b;
  --hg-graphite:#141514;
  --hg-metal:#20211f;
  --hg-metal-edge:#3b3b36;
  --hg-brass:#b9975d;
  --hg-gold:#d7b878;
  --hg-gold-hi:#f0dba7;
  --hg-mercury:#9bc9cf;
  --hg-mercury-hi:#d9eff1;
  --hg-ivory:#eee5d1;
  --hg-dim:#a99f8e;
  --hg-rule:rgba(221,199,153,.22);
  --hg-rule-cold:rgba(155,202,209,.22);
  --hg-inset:inset 0 1px rgba(255,255,255,.035),inset 0 -1px rgba(0,0,0,.8);
  --hg-panel-shadow:0 26px 90px rgba(0,0,0,.48);
}

/* shared material grammar, only on explicitly opted-in pages */
body.hg-mode-system,
body.hg-mode-instruction,
body.hg-mode-archive,
body.hg-mode-narrative{
  --gold:var(--hg-brass);
  --gold2:var(--hg-gold-hi);
  --mercury:var(--hg-mercury);
  --ivory:var(--hg-ivory);
  --dim:var(--hg-dim);
  background-color:var(--hg-black-0);
  background-image:
    radial-gradient(90rem 44rem at 88% -10%,rgba(190,155,92,.055),transparent 56%),
    radial-gradient(70rem 42rem at 8% 18%,rgba(127,188,198,.035),transparent 58%),
    linear-gradient(180deg,#050505,#090908 48%,#040404);
}
body.hg-mode-system::before,
body.hg-mode-instruction::before,
body.hg-mode-archive::before,
body.hg-mode-narrative::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.28;
  background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0 1px,transparent 1px 4px);
  mix-blend-mode:soft-light;
}
body.hg-mode-system .site-header,
body.hg-mode-instruction .site-header,
body.hg-mode-archive .site-header,
body.hg-mode-narrative .site-header{
  background:linear-gradient(180deg,rgba(5,5,5,.97),rgba(9,9,8,.93));
  border-bottom:1px solid rgba(200,171,111,.25);
  box-shadow:0 12px 40px rgba(0,0,0,.28),inset 0 -1px rgba(156,201,207,.05);
}
body.hg-mode-system .brand-mark,
body.hg-mode-instruction .brand-mark,
body.hg-mode-archive .brand-mark,
body.hg-mode-narrative .brand-mark{
  border-radius:4px;
  border-color:rgba(207,174,108,.48);
  color:var(--hg-gold-hi);
  background:linear-gradient(145deg,#151514,#070707);
  box-shadow:var(--hg-inset),0 0 0 1px rgba(0,0,0,.8),0 0 28px rgba(196,160,93,.05);
}
body.hg-mode-system .primary-nav a,
body.hg-mode-instruction .primary-nav a,
body.hg-mode-archive .primary-nav a,
body.hg-mode-narrative .primary-nav a{
  letter-spacing:.14em;
}

/* SYSTEM MODE — machine / instrument / route control */
body.hg-mode-system{
  --line:rgba(184,168,134,.19);
  --lineg:rgba(205,171,105,.44);
}
body.hg-mode-system .orientation-axis,
body.hg-mode-system .route-schematic,
body.hg-mode-system .card,
body.hg-mode-system .door,
body.hg-mode-system .mw-feature,
body.hg-mode-system .mw-media-pair>.copy{
  background:
    linear-gradient(145deg,rgba(21,22,21,.98),rgba(7,7,7,.99)),
    radial-gradient(circle at 20% 0,rgba(213,180,111,.04),transparent 40%);
  border-color:rgba(204,174,111,.22);
  box-shadow:var(--hg-inset);
}
body.hg-mode-system .orientation-axis{box-shadow:var(--hg-panel-shadow),var(--hg-inset)}
body.hg-mode-system .orientation-chamber{filter:saturate(.78) contrast(1.08)}
body.hg-mode-system .orientation-node{
  background:linear-gradient(180deg,#161716,#080808);
  border-color:rgba(197,170,112,.28);
  box-shadow:var(--hg-inset);
}
body.hg-mode-system .orientation-node[aria-pressed="true"]{
  border-color:rgba(232,205,146,.72);
  box-shadow:var(--hg-inset),0 0 22px rgba(213,176,103,.12);
}
body.hg-mode-system .button,
body.hg-mode-system .button-quiet,
body.hg-mode-system button{
  border-radius:2px;
}

/* INSTRUCTION MODE — same civilization, less cognitive density */
body.hg-mode-instruction{
  --line:rgba(214,200,170,.16);
  --lineg:rgba(190,160,101,.34);
}
body.hg-mode-instruction .hero,
body.hg-mode-instruction .section-head{max-width:1180px}
body.hg-mode-instruction .card,
body.hg-mode-instruction .academy-card,
body.hg-mode-instruction .record-card,
body.hg-mode-instruction .index-card,
body.hg-mode-instruction .notice{
  background:linear-gradient(145deg,rgba(17,17,16,.98),rgba(8,8,7,.98));
  border-color:rgba(202,180,133,.18)!important;
  box-shadow:var(--hg-inset);
}
body.hg-mode-instruction .card p,
body.hg-mode-instruction .index-card p{line-height:1.72}
body.hg-mode-instruction .micro,
body.hg-mode-instruction .eyebrow,
body.hg-mode-instruction .kicker{color:#c9a96b}
body.hg-mode-instruction .button,
body.hg-mode-instruction .button-quiet{background:transparent;color:var(--hg-ivory)}
body.hg-mode-instruction .button:hover,
body.hg-mode-instruction .button-quiet:hover{background:rgba(204,171,107,.08)}

/* ARCHIVE MODE — editorial / codex / reference */
body.hg-mode-archive{
  --line:rgba(207,191,158,.18);
  --lineg:rgba(188,153,89,.38);
  background-image:
    radial-gradient(60rem 40rem at 18% 5%,rgba(191,151,81,.07),transparent 60%),
    linear-gradient(180deg,#080705,#0d0b08 56%,#060504);
}
body.hg-mode-archive .card,
body.hg-mode-archive .catalog article,
body.hg-mode-archive .door,
body.hg-mode-archive .mw-feature{
  background:
    linear-gradient(145deg,rgba(19,17,13,.98),rgba(8,7,6,.98));
  border-color:rgba(211,190,147,.18);
  box-shadow:var(--hg-inset);
}
body.hg-mode-archive .card::before,
body.hg-mode-archive .catalog article::before{
  content:"";display:block;width:34px;height:1px;margin-bottom:1rem;background:var(--hg-brass);opacity:.75;
}
body.hg-mode-archive h1,
body.hg-mode-archive h2{letter-spacing:-.025em}
body.hg-mode-archive .micro,
body.hg-mode-archive .eyebrow{color:#d0ae6c}

/* NARRATIVE MODE — cinematic / inhabitable / less panelized */
body.hg-mode-narrative{
  --line:rgba(190,205,207,.14);
  --lineg:rgba(187,153,91,.34);
  background-image:
    radial-gradient(78rem 48rem at 72% 14%,rgba(111,169,181,.045),transparent 62%),
    radial-gradient(74rem 48rem at 18% 64%,rgba(188,147,78,.045),transparent 60%),
    linear-gradient(180deg,#050606,#090908 52%,#050505);
}
body.hg-mode-narrative .section{border-top-color:rgba(208,221,221,.09)}
body.hg-mode-narrative .figure{
  border-color:rgba(186,198,199,.12);
  box-shadow:0 34px 110px rgba(0,0,0,.38);
}
body.hg-mode-narrative .card,
body.hg-mode-narrative .recurrence-copy,
body.hg-mode-narrative .resident-copy,
body.hg-mode-narrative .support-return,
body.hg-mode-narrative .institution-debate article{
  background:linear-gradient(145deg,rgba(13,15,15,.97),rgba(6,7,7,.98));
}
body.hg-mode-narrative .section-head p,
body.hg-mode-narrative .recurrence-copy>p,
body.hg-mode-narrative .resident-lead{color:#b8bcb8}
body.hg-mode-narrative .micro,
body.hg-mode-narrative .eyebrow{color:#c5a263}
body.hg-mode-narrative .story-rail a{background:linear-gradient(180deg,#0c0e0e,#060707)}

/* PF-07 production translation of approved instrument benchmark. */
body.pf07-production{
  --bg:#030303;--panel:#0b0b0a;--panel2:#11110f;--line:#3a352c;--line2:#514a3b;
  --text:#eee7d8;--muted:#9e988c;--cold:#a9cdd1;--cold2:#729ca3;--gold:#bd9a60;--gold2:#eed8a4;
  background:
    radial-gradient(70rem 45rem at 75% 0,rgba(180,145,80,.055),transparent 55%),
    linear-gradient(180deg,#030303,#080807 52%,#030303);
}
body.pf07-production .wrap{width:min(1560px,calc(100% - 28px))}
body.pf07-production .topbar{
  border:1px solid rgba(194,163,103,.25);
  margin-bottom:12px;padding:12px 16px;
  background:linear-gradient(180deg,#0e0e0d,#070707);
  box-shadow:var(--hg-inset);
}
body.pf07-production .topbar .brand{color:#e9dec7}
body.pf07-production .visual-threshold{
  border-color:rgba(199,169,110,.36);
  box-shadow:0 40px 120px rgba(0,0,0,.55),var(--hg-inset);
}
body.pf07-production .visual-threshold::before{
  content:"";position:absolute;inset:12px;z-index:2;border:1px solid rgba(232,207,155,.12);pointer-events:none;
}
body.pf07-production .rail,
body.pf07-production .sidepanel,
body.pf07-production .instrument,
body.pf07-production .decision,
body.pf07-production .later,
body.pf07-production .scene-shell{
  border-color:rgba(194,163,103,.28);
  background:
    linear-gradient(145deg,rgba(17,18,17,.985),rgba(6,6,6,.99));
  box-shadow:var(--hg-panel-shadow),var(--hg-inset);
}
body.pf07-production .scene-head,
body.pf07-production .route-btn,
body.pf07-production .preset,
body.pf07-production .choice,
body.pf07-production .control{
  background:linear-gradient(180deg,#151614,#080808);
  border-color:rgba(187,159,102,.32);
  box-shadow:var(--hg-inset);
}
body.pf07-production .route-btn:hover,
body.pf07-production .preset:hover,
body.pf07-production .choice:hover,
body.pf07-production .control:hover{border-color:rgba(231,205,150,.65)}
body.pf07-production .knob-box{border-color:rgba(197,168,108,.22)}
body.pf07-production .knob-wrap{
  width:250px;height:250px;
  filter:drop-shadow(0 22px 30px rgba(0,0,0,.5));
}
body.pf07-production .knob{
  width:184px;height:184px;
  border:1px solid rgba(222,195,139,.52)!important;
  background:
    radial-gradient(circle at 50% 50%,#121311 0 18%,transparent 19%),
    repeating-radial-gradient(circle at 50% 50%,transparent 0 15px,rgba(194,164,106,.08) 16px,transparent 17px 29px),
    repeating-conic-gradient(from 0deg,rgba(214,184,124,.13) 0 .8deg,transparent .8deg 9deg),
    radial-gradient(circle at 36% 28%,#2b2d2a,#121311 42%,#060606 76%,#181817 100%)!important;
  box-shadow:
    inset 0 0 0 8px #0a0a09,
    inset 0 0 0 10px rgba(212,182,122,.36),
    inset 0 0 48px rgba(0,0,0,.92),
    0 0 0 1px #000,
    0 18px 50px rgba(0,0,0,.55),
    0 0 26px rgba(202,168,101,.08)!important;
}
body.pf07-production .knob::before{
  content:"Hg";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
  border:1px solid rgba(221,194,137,.46);background:#0b0b0a;color:#ecd59d;
  font:400 18px Georgia,serif;box-shadow:inset 0 0 18px rgba(215,178,105,.08);
}
body.pf07-production .knob:after{top:13px;height:62px;background:linear-gradient(#f2d99f,#8c6c38);box-shadow:0 0 14px rgba(236,207,144,.45)}
body.pf07-production .ticks{
  border-color:rgba(205,176,116,.18)!important;
  background:
    repeating-conic-gradient(from -135deg,rgba(225,199,144,.72) 0 1deg,transparent 1deg 11.25deg)!important;
  -webkit-mask:radial-gradient(circle,transparent 0 88px,#000 89px 104px,transparent 105px)!important;
  mask:radial-gradient(circle,transparent 0 88px,#000 89px 104px,transparent 105px)!important;
}
body.pf07-production .eq,
body.pf07-production .next-target{
  background:rgba(190,155,88,.035);
  border-color:rgba(207,175,110,.4);
}
body.pf07-production .equal-steps div{background:#090909;border-color:rgba(178,153,103,.25)}
body.pf07-production .stage.active .dot,
body.pf07-production .preset.target{box-shadow:0 0 22px rgba(217,179,104,.18)}
body.pf07-production .scene{
  background:
    radial-gradient(ellipse at 75% 15%,rgba(106,153,166,.13),transparent 22%),
    radial-gradient(ellipse at 58% 83%,rgba(201,164,95,.10),transparent 22%),
    linear-gradient(180deg,#020303 0%,#060808 56%,#0a0a09 78%,#040404 100%);
}
body.pf07-production .scene-coach{background:linear-gradient(90deg,#121311,#070807);border-top-color:rgba(194,164,104,.25)}
body.pf07-production .footer-note{color:#756f64}

/* Compact route-mode tag used only in owner review builds. */
.hg-mode-tag{display:inline-flex;align-items:center;gap:.5rem;margin-left:.7rem;padding:.25rem .45rem;border:1px solid rgba(203,173,111,.22);font:500 .51rem/1 ui-monospace,monospace;letter-spacing:.13em;text-transform:uppercase;color:#bfa46e;background:rgba(8,8,7,.62)}

@media(max-width:800px){
  body.pf07-production .knob-wrap{width:230px;height:230px}
}
@media(max-width:520px){
  body.pf07-production .knob-wrap{width:220px;height:220px;transform:scale(.86);margin-top:-8px;margin-bottom:-12px}
}


/* v0.6.0 WHOLE-CAMPUS PROPAGATION
   One civilization, four route densities. These are deliberately restrained
   generic rules so accepted native instruments keep their own interaction identity. */
body.hg-mode-system,
body.hg-mode-instruction,
body.hg-mode-archive,
body.hg-mode-narrative{accent-color:var(--hg-gold);}
body.hg-mode-system :where(button,input,select,textarea),
body.hg-mode-instruction :where(button,input,select,textarea),
body.hg-mode-archive :where(button,input,select,textarea),
body.hg-mode-narrative :where(button,input,select,textarea){
  font:inherit;
}
body.hg-mode-system :where(button,[role="button"]),
body.hg-mode-instruction :where(button,[role="button"]),
body.hg-mode-archive :where(button,[role="button"]),
body.hg-mode-narrative :where(button,[role="button"]){
  border-color:rgba(201,171,111,.28);
}
body.hg-mode-system :where(button,[role="button"]):focus-visible,
body.hg-mode-instruction :where(button,[role="button"]):focus-visible,
body.hg-mode-archive :where(button,[role="button"]):focus-visible,
body.hg-mode-narrative :where(button,[role="button"]):focus-visible,
body.hg-mode-system a:focus-visible,
body.hg-mode-instruction a:focus-visible,
body.hg-mode-archive a:focus-visible,
body.hg-mode-narrative a:focus-visible{
  outline:1px solid var(--hg-mercury-hi);outline-offset:3px;
}
body.hg-mode-system :where(hr,.rule),
body.hg-mode-instruction :where(hr,.rule),
body.hg-mode-archive :where(hr,.rule),
body.hg-mode-narrative :where(hr,.rule){border-color:rgba(207,182,130,.18);}
body.hg-mode-system :where(.panel,.module,.lesson,.control-panel,.record,.drawer,.tile,.console),
body.hg-mode-instruction :where(.panel,.module,.lesson,.control-panel,.record,.drawer,.tile,.console),
body.hg-mode-archive :where(.panel,.module,.lesson,.control-panel,.record,.drawer,.tile,.console),
body.hg-mode-narrative :where(.panel,.module,.lesson,.control-panel,.record,.drawer,.tile,.console){
  border-color:rgba(199,171,116,.18);
}
body.hg-mode-system code,
body.hg-mode-instruction code,
body.hg-mode-archive code,
body.hg-mode-narrative code{color:#c8dfe2;}

/* Threshold/home inherits the instrument material language without becoming a dashboard. */
body.hg-mode-threshold .hero{position:relative;isolation:isolate}
body.hg-mode-threshold .hero::after{
  content:"";position:absolute;inset:auto 0 -1px 0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(211,180,118,.42),rgba(150,201,208,.22),transparent);
}

/* Music reads as a playable instrument room. */
body.hg-mode-system.music-room :where(.track,.album,.music-card,.release,.player,.control-tower){
  border-color:rgba(199,170,109,.24)!important;
  background:linear-gradient(145deg,rgba(17,18,17,.97),rgba(6,6,6,.99));
  box-shadow:var(--hg-inset);
}

/* Archive / Atlas held-state: onyx mathematical wall without inventing Atlas content. */
body.mathematical-atlas-room{
  background-image:
    radial-gradient(65rem 40rem at 50% 5%,rgba(69,139,151,.055),transparent 62%),
    radial-gradient(48rem 36rem at 14% 38%,rgba(204,166,95,.06),transparent 60%),
    linear-gradient(180deg,#050505,#0a0907 55%,#040404);
}
body.mathematical-atlas-room :where(.card,.catalog article,.atlas-panel,.source-group){
  background:
    linear-gradient(145deg,rgba(12,13,13,.985),rgba(5,5,5,.995));
  border-color:rgba(198,170,111,.22)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.025),inset 0 -1px #000;
}

/* Remove obsolete six-movement ribbon if any historical fragment survives markup cleanup. */
.campus-band{display:none!important}

/* Native-room harmony: don't let inherited framing force horizontal overflow. */
body[class*="hg-mode-"] :where(main,section,article,aside,nav,div){min-width:0}
body[class*="hg-mode-"] img,body[class*="hg-mode-"] svg,body[class*="hg-mode-"] canvas{max-width:100%}
@media(max-width:640px){
  body[class*="hg-mode-"]{background-attachment:scroll}
  body[class*="hg-mode-"] :where(button,a.button,a.button-quiet){min-height:44px}
}