/* Areté — constitution (2026-09-11). Governed by DESIGN-CONSTITUTION.md. */

/* 1. No uppercase tracking anywhere in the instrument (Constitution §2). */
#content-wrap .ui-chip, #content-wrap .ui-prov, #content-wrap .ui-label, #content-wrap .ui-meta,
#content-wrap .overline, #content-wrap .brief-empty-overline, #content-wrap .ui-section, #content-wrap [class*="overline"]{
  text-transform:none !important; letter-spacing:0 !important; }
#content-wrap .ui-chip{ height:auto; padding:0; border:0; background:transparent; border-radius:0;
  font:400 14px/1.4 var(--f-body); color:rgb(var(--ink2)); gap:8px; }
#content-wrap .ui-chip::before{ width:6px; height:6px; opacity:.9; box-shadow:none; }
#content-wrap .ui-prov{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#content-wrap .ui-label, #content-wrap .ui-meta{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }

/* 2. No texture: the scanline layer is off (Constitution §13). */
body::after{ display:none !important; animation:none !important; }

/* 3. Glow on controls is not allowed (Constitution §5). */
#content-wrap button:not(.ui-btn--primary):not(.int-pill):not(.vv-pill):not(.rc-disc):not(.int-disc){ text-shadow:none; }
#content-wrap .ui-btn--quiet, #content-wrap .dc-link, #content-wrap .rc-q, #content-wrap .int-quiet button{ box-shadow:none; }

/* 4. Text is one of three inks, never glowing (Constitution §3, §5). */
#content-wrap h1, #content-wrap h2, #content-wrap h3, #content-wrap p, #content-wrap .ui-display{ text-shadow:none !important; }

/* 5. The room ground: no card frame around a whole view (Constitution §4). */
#content-wrap .view > .card:only-child{ border:0; background:transparent; box-shadow:none; }

/* 6. The rail speaks in words, not caps (Constitution §2). The wordmark keeps its tracking: it is the mark. */
.ui-dest, #ui-tabbar .ui-dest{ font:500 12px/1 var(--f-body); letter-spacing:0; text-transform:none; }
#ui-more h3{ text-transform:none; letter-spacing:0; font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }

/* 7. Every room stands at the same width, centred (Constitution §6). Record and the Intercept keep their own stage. */
#view-sensors, #view-archive, #view-profile, #view-calendar, #view-calibration, #view-practice{
  box-sizing:border-box; max-width:var(--room-max,1180px); margin-left:auto; margin-right:auto; padding-left:var(--room-pad,24px); padding-right:var(--room-pad,24px); }
#view-sensors > *, #view-archive > *, #view-profile > *, #view-calendar > *, #view-calibration > *{ max-width:100%; }
/* The primary pill's cast is the one glow a room gets; nothing brighter than the Intercept's (Constitution §5). */
#content-wrap .ui-btn--primary{ box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 14px 36px -14px rgba(47,123,255,.8) !important; filter:none !important; }

/* 8. The website's typography, in the instrument (her 09-11 verdict). Source: Desktop\ARETÉ — WEBSITE\index.html :26-28, :182-184, :193.
      Body 18px/1.6 on the ground. The room's sentence: Syne 500, tight, with one italic Cormorant turn at 1.14em in ice-hi.
      Record (§19) and the Intercept (§18) keep their own type; they are the benchmark. */
#content-wrap .view :is(.ui-title, .td-verdict, .rdo-title, #sig-arch, .ar-lead, .cb-lead, #cal-today-band, .cl-lead, #dc-verdict, #sim-verdict, .yo-h){
  font-family:var(--f-disp) !important; font-weight:500 !important; font-size:clamp(30px,2.6vw,44px) !important; line-height:1.06 !important;
  letter-spacing:-.025em !important; text-wrap:balance; color:rgb(var(--ink)); }
#content-wrap .view :is(.ui-title, .td-verdict, .rdo-title, .ar-lead, .cb-lead, #sim-verdict, .yo-h) em,
#content-wrap .view :is(.ui-title, .td-verdict, .rdo-title, .ar-lead, .cb-lead, #sim-verdict, .yo-h) .ui-em{
  font-family:var(--f-em) !important; font-style:italic !important; font-weight:400 !important; font-size:1.14em !important; letter-spacing:0 !important; color:#CFF3FF !important; }
#content-wrap .view :is(.ui-body, .td-sub, .rdo-sub, .rdo-say, #sig-lead, .cb-sub, .ar-sub, .yo-lead, .dc-note, .cb-p){
  font-family:var(--f-body); font-size:clamp(17px,1.2vw,18px); line-height:1.6; color:rgb(var(--ink2)); max-width:46ch; }
#content-wrap .view :is(.td-sub, .rdo-sub, #sig-lead){ color:rgb(var(--ink)); }   /* the standfirst reads in full ink, website :193 */
#content-wrap .view :is(.ui-label, .ui-meta, .ui-support, .td-tier, .rc-stamp, .cb-stamp, .ar-stamp, .dc-label){ font-size:14px; line-height:1.5; }
#content-wrap .ui-btn, #content-wrap .ui-btn--primary{ font-family:var(--f-body); font-weight:600; font-size:16px; }
#content-wrap .ui-btn--quiet, #content-wrap .dc-link{ font-size:15px; }
#page-title{ font-family:var(--f-disp); font-weight:500; letter-spacing:-.02em; }

/* 9. PROPORTION (her 09-11 ship prompt §4). Two rules, both global.
      (a) The room box stands in the middle of the shell. It was left-aligned, so on a wide
          screen Record and its neighbours sat off to one side with the weight all on the left. */
#content-wrap .view{ width:100%; margin-left:auto; margin-right:auto; }   /* width, or the flex shell shrinks the room to its content and the sentences clip */
/*    (b) A room that is shorter than the viewport stands in the middle of it, rather than
          hanging from the top with a void underneath. Rooms that scroll keep their top edge. */
/*    (b) lives in css/proportion.css, which loads last: the room rules would otherwise reset display. */

/* The Cormorant turn lifts by being lighter than the body on the dark ground; on the light theme it
   has to lift by being darker, or it disappears (the audit caught it at 1.01:1 in Documents). */
html[data-theme="light"] #content-wrap .view :is(.ui-title, .td-verdict, .rdo-title, .ar-lead, .cb-lead, #sim-verdict, .yo-h, .dr-s__h) em,
html[data-theme="light"] #content-wrap .view :is(.ui-title, .td-verdict, .rdo-title, .ar-lead, .cb-lead, #sim-verdict, .yo-h, .dr-s__h) .ui-em,
html[data-theme="light"] #content-wrap .view .ui-em{ color:#0B1E33 !important; }

/* 10. NO DECORATIVE DOTS (her 09-11 ruling). The room's name carried a pulsing coloured dot in the
      header that stood for nothing. Identity comes from type, space and hierarchy, not punctuation.
      State dots stay: the chip's dot is the tier, the provenance ring is where the reading came from. */
#page-title::before, #page-title::after{ display:none !important; content:none !important; animation:none !important; }

/* 11. The Anatomy stage is dark in BOTH themes (arete-system.css treats [data-dark-stage] as
      obsidian ground). The rules above paint from the ink tokens, which flip dark on the light
      theme and turn that stage's words invisible. Inside a dark stage the ink ramp stays light. */
html[data-theme="light"] [data-dark-stage]{ --ink:238 244 250; --ink2:175 192 210; --ink3:138 156 176;
/*    The same rule has to cover the SVG/canvas ink ramp and the cold signal, or anything drawn
      inside the stage keeps the light theme's dark values and disappears into the obsidian.
      Caught by the census at 1.07:1 on "How the instrument works." once js/14 stopped carrying
      its own literals and started reading the tokens. A dark stage is dark all the way down. */
  --svg-ink:#eef0f3; --svg-label:#b4b4bc; --svg-faint:#8fa2b8;
  --ice:#7FD3FF; --ice-hi:#DFF4FF; --ice-lo:#9FE2FF; --ice2:#7FD3FF;
  --accent:#00BFFF; --warn:#66D9FF; --mg-glow:#1F7EDB; --s1:#0B1E33; }