/* KaiOpen: shared craft pass, 25 October 2026.
   Preserve every palette and product. Keep app density distinct from editorial pages. */
@media screen {
  html[data-kaiopen-palette][data-appearance] {
    --radius: 14px;
    --craft-control: 10px;
    --craft-ease: cubic-bezier(.23,1,.32,1);
    --craft-muted: color-mix(in srgb, var(--ap-ink) 74%, var(--ap-panel));
    --ap-muted: var(--craft-muted);
    --muted: var(--craft-muted);
    --ko-muted: var(--craft-muted);
    --v-bg: var(--ap-bg);
    --v-panel: var(--ap-panel);
    --v-text: var(--ap-ink);
    --v-muted: var(--craft-muted);
    --v-line: var(--ap-line);
    --v-accent: var(--ap-accent);
    --v-button: var(--ap-soft);
    scroll-padding-top: 96px;
  }
  html[data-kaiopen-palette] body {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif;
    line-height: 1.65;
    background-image: none;
    caret-color: var(--ap-accent);
  }
  html[data-kaiopen-palette] :is(button,input,select,textarea) { font-family: inherit; }
  html[data-kaiopen-palette] :is(h1,h2,h3) { letter-spacing: -.025em; text-wrap: balance; }
  html[data-kaiopen-palette] p { text-wrap: pretty; }
  html[data-kaiopen-palette] :is(button,a,input,select,textarea,summary):focus-visible {
    outline: 3px solid var(--ap-accent); outline-offset: 4px;
  }
  html[data-kaiopen-palette] ::selection { background: var(--ap-accent); color: var(--ap-on); }
  html[data-kaiopen-palette] input::placeholder,
  html[data-kaiopen-palette] textarea::placeholder { color: var(--craft-muted); opacity: 1; }
  html[data-kaiopen-palette] :is(table,output,.metrics,.hub-stats,.finance-kpis) {
    font-variant-numeric: tabular-nums;
  }
  html[data-kaiopen-palette] :is(button,input,select,textarea,summary) { accent-color: var(--ap-accent); }
  html[data-kaiopen-palette] :is(.button,.control,.node,.app-card,.knowledge-card,.lesson,.panel,.hub-card,.resource-card,.branch-card) {
    border-radius: var(--radius);
  }
  html[data-kaiopen-palette] :is(.button,.control,input,select,textarea) { border-radius: var(--craft-control); }
  html[data-kaiopen-palette] :is(.button,.control,.primary) { min-height: 42px; }
  html[data-kaiopen-palette] :is(.header,.topbar) { backdrop-filter: none; -webkit-backdrop-filter: none; }
  html[data-kaiopen-palette] .header { background: var(--ap-bg); }
  html[data-kaiopen-palette] :is(.eyebrow,.section-label,.index) { letter-spacing: 0; text-transform: none; }
  html[data-kaiopen-palette] :is(.status,.tag,.source-note,.hero-meta,.hint) { font-size: 12px; line-height: 1.6; }
  html[data-kaiopen-palette] :is(.node,.app-card,.knowledge-card,.panel,.hub-card,.branch-card) { box-shadow: none; }
  html[data-kaiopen-motion=on] :is(.button,.control,.node,.app-card,.knowledge-card,.panel,.hub-card,.branch-card) {
    transition: background-color 160ms ease-out, color 160ms ease-out, border-color 160ms ease-out;
  }
  html[data-kaiopen-motion=on] :is(.button,.app-card,.knowledge-card,.branch-card):hover { transform: none; }
  html[data-kaiopen-motion=on] .button:active { transform: scale(.98); }

  /* Home: the connected-space artwork leads; the links form a readable directory. */
  html[data-kaiopen-palette] .ko-hub { --hub-side: 224px; --space: 36px; --max: 1440px; }
  html[data-kaiopen-palette] .ko-hub .header-inner { min-height: 76px; padding-inline: 28px; }
  html[data-kaiopen-palette] .ko-hub #hub-sidebar {
    inset: 76px auto 0 0; width: 224px; padding: 28px 16px 20px;
    background: var(--ap-bg); border-right: 1px solid var(--ap-line); border-radius: 0;
    scrollbar-width: thin; scrollbar-color: var(--ap-line) transparent;
  }
  html[data-kaiopen-palette] .hub-side-title { font-size: 12px; padding: 0 12px 16px; }
  html[data-kaiopen-palette] #hub-sidebar nav { gap: 4px; }
  html[data-kaiopen-palette] #hub-sidebar nav button {
    border-radius: 10px; min-height: 44px; padding: 10px 12px; font-size: 13px;
    color: var(--ap-ink); transform: none; transition: background-color 150ms ease-out;
  }
  html[data-kaiopen-palette] #hub-sidebar nav button[aria-pressed=true] { background: var(--ap-soft); box-shadow: none; }
  html[data-kaiopen-palette] .hub-nav-symbol { color: var(--craft-muted); width: 20px; height: 20px; }
  .hub-nav-symbol svg { width: 20px; height: 20px; display: block; }
  html[data-kaiopen-palette] .hub-side-bottom { padding-top: 24px; font-size: 12px; gap: 12px; }
  html[data-kaiopen-palette] .hub-side-bottom>span { line-height: 1.7; }
  html[data-kaiopen-palette] .hub-lab-link { border: 0; padding: 12px; font-size: 12px; background: var(--ap-soft); }
  html[data-kaiopen-palette] .ko-hub .hero {
    padding-block: 40px 28px; min-height: 360px; gap: 28px;
    grid-template-columns: minmax(0,1.12fr) minmax(0,1fr); align-items: center;
  }
  html[data-kaiopen-palette] .ko-hub .hero-copy { padding: 0; }
  html[data-kaiopen-palette] .ko-hub .hero .eyebrow { display: none; }
  html[data-kaiopen-palette] .ko-hub .hero h1 {
    font-size: clamp(36px,3.75vw,56px); line-height: 1.16; letter-spacing: -.035em; margin: 0 0 24px;
  }
  html[data-kaiopen-palette] .ko-hub .hero h1 span { background: none; color: inherit; -webkit-text-fill-color: currentColor; }
  html[data-kaiopen-palette] .ko-hub .hero .lead { font-size: 16px; line-height: 1.8; max-width: 47ch; }
  html[data-kaiopen-palette] .ko-hub .hero-art { display: block; height: 310px; min-width: 0; }
  html[data-kaiopen-palette] .ko-hub .hero-art>svg { width: 100%; height: 100%; }
  html[data-kaiopen-palette] .ko-hub .hero-art:after { display: none; }
  html[data-kaiopen-palette] .ko-hub .hero-meta { margin-top: 18px; font-size: 11px; letter-spacing: 0; }
  html[data-kaiopen-palette] .ko-hub .ctas { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
  html[data-kaiopen-palette] .ko-hub .ctas .button { font-size: 13px; padding: 12px 16px; min-height: 44px; }
  html[data-kaiopen-palette] #hub-overview { padding-top: 12px; }
  html[data-kaiopen-palette] .hub-stats {
    gap: 0; padding-block: 24px; border-block: 1px solid var(--ap-line); background: none;
  }
  html[data-kaiopen-palette] .hub-stats>a,
  html[data-kaiopen-palette] .hub-stats>button { background: none; border-radius: 0; padding: 0 24px; gap: 5px; }
  html[data-kaiopen-palette] .hub-stats>:first-child { padding-left: 0; }
  html[data-kaiopen-palette] .hub-stats>:not(:first-child) { border-left: 1px solid var(--ap-line); }
  html[data-kaiopen-palette] .hub-stats strong { font-size: 30px; color: var(--ap-ink); }
  html[data-kaiopen-palette] .hub-stats span { font-size: 13px; }
  html[data-kaiopen-palette] .hub-stats small { font-size: 12px; }
  html[data-kaiopen-palette] .hub-start-heading { margin-block: 40px 12px; }
  html[data-kaiopen-palette] .hub-start-heading h2 { font-size: 23px; }
  html[data-kaiopen-palette] .hub-start-heading>span { font-size: 12px; }
  html[data-kaiopen-palette] .hub-start-grid { grid-template-columns: 1fr; gap: 0; }
  html[data-kaiopen-palette] .hub-start-grid>a {
    display: grid; grid-template-columns: minmax(125px,.7fr) minmax(0,2fr) 28px; gap: 6px 24px;
    padding: 24px 0; border-radius: 0; border-bottom: 1px solid var(--ap-line); background: none; transform: none; box-shadow: none;
  }
  html[data-kaiopen-palette] .hub-start-grid>a:hover { background: none; transform: none; box-shadow: none; }
  html[data-kaiopen-palette] .hub-start-grid .hub-small-label { grid-column: 1; grid-row: 1/3; padding-top: 4px; font-size: 12px; color: var(--craft-muted); }
  html[data-kaiopen-palette] .hub-start-grid h3 { grid-column: 2; font-size: 19px; }
  html[data-kaiopen-palette] .hub-start-grid p { grid-column: 2; font-size: 14px; max-width: 65ch; }
  html[data-kaiopen-palette] .hub-start-grid>a>span:last-child { grid-column: 3; grid-row: 1/3; align-self: center; margin: 0; }
  html[data-kaiopen-palette] .ko-hub .section-heading h2 { font-size: clamp(28px,3vw,38px); }
  html[data-kaiopen-palette] .ko-hub .section-heading p { font-size: 14px; line-height: 1.75; }
  html[data-kaiopen-palette] .ko-hub :is(.app-card,.knowledge-card) { padding: 26px; border-radius: 14px; }
  html[data-kaiopen-palette] .ko-hub :is(.app-card,.knowledge-card) p { font-size: 14px; line-height: 1.75; }
  html[data-kaiopen-palette] .ko-hub .orbital-map .node { border-radius: 14px; padding: 20px; }
  html[data-kaiopen-palette] .ko-hub .orbital-map .node strong { font-size: 14px; }
  html[data-kaiopen-palette] .ko-hub .orbital-map .node small { font-size: 12px; }
  html[data-kaiopen-palette] .ko-hub .map-detail { border-radius: 14px; padding: 28px; }
  html[data-kaiopen-palette] .ko-hub .map-detail p { font-size: 14px; line-height: 1.8; }
  html[data-kaiopen-palette] .ko-hub .footer-bottom { font-size: 12px; }

  /* Note is a working desk: compact heading, quiet surfaces and visible real data. */
  html[data-kaiopen-surface=note] {
    --text: var(--ap-ink); --panel: var(--ap-panel); --panel2: var(--ap-soft);
    --side: var(--ap-bg); --hero: var(--ap-soft); --on: var(--ap-on); --shadow: none;
  }
  html[data-kaiopen-surface=note] .top { height: 72px; gap: 20px; padding-inline: 24px; }
  html[data-kaiopen-surface=note] .sidebar { top: 72px; max-height: calc(100dvh - 72px); padding: 24px 16px; }
  html[data-kaiopen-surface=note] main { padding: 28px 32px 0; }
  html[data-kaiopen-surface=note] .hero { min-height: 0; padding: 0 0 24px; background: none; border: 0; border-bottom: 1px solid var(--ap-line); border-radius: 0; }
  html[data-kaiopen-surface=note] .hero h1 { font-size: 30px; line-height: 1.3; letter-spacing: -.025em; margin-bottom: 12px; }
  html[data-kaiopen-surface=note] .hero h1 br { display: none; }
  html[data-kaiopen-surface=note] .hero h1 br:after { content: ' '; }
  html[data-kaiopen-surface=note] .hero :is(.eyebrow,.planet) { display: none; }
  html[data-kaiopen-surface=note] .hero-tags { gap: 12px; }
  html[data-kaiopen-surface=note] .hero-tags span { padding: 0; border: 0; font-size: 12px; }
  html[data-kaiopen-surface=note] nav button.active { box-shadow: none; }
  html[data-kaiopen-surface=note] :is(.panel,.quick-actions button) { background: var(--ap-panel); box-shadow: none; border: 1px solid var(--ap-line); }
  html[data-kaiopen-surface=note] .quick-actions button { min-height: 56px; display: flex; gap: 8px; justify-content: center; align-items: center; font-size: 12px; }
  html[data-kaiopen-surface=note] .quick-actions span { font-size: 18px; }
  html[data-kaiopen-surface=note] .panel { border-radius: 14px; padding: 22px; }
  html[data-kaiopen-surface=note] :is(.small,.empty,.workspace-toolbar,.hero-tags span,.bars-caption) { font-size: 12px; }
  html[data-kaiopen-surface=note] .task-row { border-radius: 0; padding: 12px 0; }
  html[data-kaiopen-surface=note] :is(.big-number,.progress-ring strong) { color: var(--ap-ink); font-variant-numeric: tabular-nums; }
  html[data-kaiopen-surface=note] .bars .bar i { background: var(--ap-accent); }
  html[data-kaiopen-surface=note] .side-quote { color: var(--craft-muted); font-size: 12px; }
  html[data-kaiopen-surface=note] button:disabled { opacity: .65; }

  /* Estimate: readable inputs, aligned figures and a restrained cost hierarchy. */
  html[data-kaiopen-surface=estimate] :is(.panel,.metrics article) { border-radius: 14px; box-shadow: none; }
  html[data-kaiopen-surface=estimate] .hero { padding-block: 44px 30px; }
  html[data-kaiopen-surface=estimate] .hero h1 { font-size: clamp(30px,3.2vw,44px); letter-spacing: -.03em; line-height: 1.2; }
  html[data-kaiopen-surface=estimate] .hero h1 em { color: inherit; }
  html[data-kaiopen-surface=estimate] .hero .eyebrow { display: none; }
  html[data-kaiopen-surface=estimate] :is(label,td,caption,.costlines p,.terms p) { font-size: 14px; line-height: 1.7; }
  html[data-kaiopen-surface=estimate] :is(.hint,.notice,.metrics span,.metrics small,.grow small,.actualrow) { font-size: 12px; line-height: 1.7; }
  html[data-kaiopen-surface=estimate] th { font-size: 12px; letter-spacing: 0; text-transform: none; }
  html[data-kaiopen-surface=estimate] :is(input,select) { min-height: 44px; font-size: 15px; border-radius: 9px; }
  html[data-kaiopen-surface=estimate] input[type=range] { min-height: 32px; }
  html[data-kaiopen-surface=estimate] .metrics strong { font-size: 28px; color: var(--ap-ink); letter-spacing: -.02em; }
  html[data-kaiopen-surface=estimate] .metrics .primary { border-color: var(--ap-line); background: var(--ap-soft); }
  html[data-kaiopen-surface=estimate] .grow label { font-size: 12px; }
  html[data-kaiopen-surface=estimate] .results>section { margin-bottom: 32px; }

  /* Learning and Vision: comfortable reading without changing lesson structure. */
  html[data-kaiopen-surface=academy] :is(.card,.lesson,.panel) { border-radius: 14px; box-shadow: none; }
  html[data-kaiopen-surface=academy] .cards { gap: 24px; }
  html[data-kaiopen-surface=academy] :is(.card p,.lesson p,.lead) { line-height: 1.8; }
  html[data-kaiopen-surface=academy] :is(.lesson h2,.card h2) { line-height: 1.35; }
  html[data-kaiopen-surface=academy] :is(.eyebrow,.lesson-meta) { font-size: 12px; letter-spacing: 0; }
  html[data-kaiopen-surface=academy] :is(.hero,.intro)>.eyebrow,
  html[data-kaiopen-surface=academy] .hero>div>.eyebrow { display: none; }
  html[data-kaiopen-surface=vision] :is(.intro p,.branch p,.roadmap-column p,.available-list p,.section-heading>p) { font-size: 14px; line-height: 1.8; }
  html[data-kaiopen-surface=vision] :is(.map-note,.branch-foot,.tag,figcaption) { font-size: 12px; }
  html[data-kaiopen-surface=vision] .intro .section-label { display: none; }
  html[data-kaiopen-surface=vision] .branch-grid { gap: 20px; }
  html[data-kaiopen-surface=vision] .branch { border-radius: 14px; }
  html[data-kaiopen-surface=vision] .roadmap-column article { background: var(--ap-panel); }

  /* Preferences remain available, with short, reversible motion. */
  html[data-kaiopen-palette] .ko-appearance summary { border-radius: 12px; padding: 10px 14px; }
  html[data-kaiopen-palette] .ko-appearance-panel { border-radius: 16px; }
  html[data-kaiopen-palette] .ko-appearance[open] .ko-appearance-panel { animation-duration: 160ms; transform-origin: bottom right; }
  @media(max-width:1100px) {
    html[data-kaiopen-palette] .ko-hub { --hub-side: 200px; --space: 28px; }
    html[data-kaiopen-palette] .ko-hub #hub-sidebar { width: 200px; padding-inline: 12px; }
    html[data-kaiopen-palette] .ko-hub .hero { grid-template-columns: minmax(0,1fr) minmax(0,.8fr); gap: 16px; }
    html[data-kaiopen-palette] .ko-hub .hero-art { height: 250px; }
    html[data-kaiopen-palette] .ko-hub .hero h1 { font-size: 38px; }
    html[data-kaiopen-surface=note] main { padding-inline: 24px; }
  }
  @media(max-width:760px) {
    html[data-kaiopen-palette] .ko-hub { --hub-side: 0px; --space: 20px; }
    html[data-kaiopen-palette] .ko-hub :is(#main,.footer) { margin-left: 0; }
    html[data-kaiopen-palette] .ko-hub #hub-sidebar {
      position: relative; inset: auto; width: auto; margin: 0; padding: 10px 20px;
      border-right: 0; border-bottom: 1px solid var(--ap-line); overflow: visible;
    }
    html[data-kaiopen-palette] .ko-hub #hub-sidebar nav { display: flex; overflow-x: auto; gap: 4px; scrollbar-width: none; padding: 4px; }
    html[data-kaiopen-palette] #hub-sidebar nav button { flex: none; white-space: nowrap; min-height: 40px; padding: 8px 12px; font-size: 12px; }
    html[data-kaiopen-palette] .ko-hub :is(.hub-side-title,.hub-side-bottom,.hub-nav-symbol,.hub-lab-link) { display: none; }
    html[data-kaiopen-palette] .ko-hub .hero { grid-template-columns: 1fr; padding-block: 32px 24px; gap: 18px; }
    html[data-kaiopen-palette] .ko-hub .hero h1 { font-size: clamp(32px,8.2vw,42px); margin-bottom: 18px; }
    html[data-kaiopen-palette] .ko-hub .hero .lead { font-size: 15px; }
    html[data-kaiopen-palette] .ko-hub .hero-art { display: none; }
    html[data-kaiopen-palette] .ko-hub .ctas .button { font-size: 12px; padding: 12px 13px; }
    html[data-kaiopen-palette] .hub-stats { padding-block: 20px; }
    html[data-kaiopen-palette] .hub-stats>a,
    html[data-kaiopen-palette] .hub-stats>button { padding-inline: 12px; }
    html[data-kaiopen-palette] .hub-stats>:first-child { padding-left: 0; }
    html[data-kaiopen-palette] .hub-stats strong { font-size: 26px; }
    html[data-kaiopen-palette] .hub-stats span { font-size: 12px; }
    html[data-kaiopen-palette] .hub-start-grid>a { grid-template-columns: minmax(0,1fr) 24px; gap: 6px 14px; padding-block: 24px; }
    html[data-kaiopen-palette] .hub-start-grid .hub-small-label { grid-column: 1; grid-row: auto; padding: 0; }
    html[data-kaiopen-palette] .hub-start-grid :is(h3,p) { grid-column: 1; }
    html[data-kaiopen-palette] .hub-start-grid>a>span:last-child { grid-column: 2; grid-row: 1/4; }
    html[data-kaiopen-palette] .ko-hub .header-inner { padding-inline: 16px; }
    html[data-kaiopen-surface=note] .top { height: auto; min-height: 68px; gap: 12px; padding-inline: 18px; }
    html[data-kaiopen-surface=note] main { padding: 24px 18px 0; }
    html[data-kaiopen-surface=note] .hero h1 { font-size: 26px; }
    html[data-kaiopen-surface=note] .quick-actions { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
    html[data-kaiopen-surface=note] .quick-actions button { flex-direction: column; gap: 4px; padding: 10px 5px; min-height: 64px; }
    html[data-kaiopen-surface=note] .panel { padding: 20px; }
    html[data-kaiopen-surface=estimate] .hero { padding-top: 32px; }
    html[data-kaiopen-surface=estimate] .metrics strong { font-size: 24px; }
    html[data-kaiopen-palette] .ko-appearance { right: 12px; bottom: 12px; }
    html[data-kaiopen-palette] .ko-appearance summary { padding: 10px 12px; }
  }
  @media(prefers-reduced-motion:reduce) {
    html[data-kaiopen-palette] *,html[data-kaiopen-palette] *::before,html[data-kaiopen-palette] *::after {
      animation: none !important; transition: none !important; scroll-behavior: auto !important;
    }
  }
}


/* KaiOpen ecosystem craft refinement · 2026-10-25 */
@media screen{
html[data-kaiopen-surface=note][data-theme=navy]{--ap-bg:#050e19;--ap-panel:#091b2a;--ap-soft:#0d2637;--ap-ink:#e6f2fc;--ap-line:#183e54;--ap-accent:#49d8eb;--ap-on:#04202c}
html[data-kaiopen-surface=note][data-theme=black]{--ap-bg:#000;--ap-panel:#111;--ap-soft:#1b1b1b;--ap-ink:#f6f6f6;--ap-line:#383838;--ap-accent:#ddd;--ap-on:#111}
html[data-kaiopen-surface=note][data-theme=white]{--ap-bg:#fff;--ap-panel:#fff;--ap-soft:#edf3f7;--ap-ink:#182937;--ap-line:#d2dce3;--ap-accent:#006779;--ap-on:#fff}
html[data-kaiopen-surface=note][data-theme=purple]{--ap-bg:#110c22;--ap-panel:#211637;--ap-soft:#302048;--ap-ink:#f1eafa;--ap-line:#49355e;--ap-accent:#d7a2ff;--ap-on:#271336}
html[data-kaiopen-surface=note][data-theme=green]{--ap-bg:#061713;--ap-panel:#0d2a23;--ap-soft:#133a2e;--ap-ink:#e3f5eb;--ap-line:#285647;--ap-accent:#6fe1ae;--ap-on:#08291c}
html[data-kaiopen-surface=note][data-theme=neon]{--ap-bg:#050611;--ap-panel:#0b1330;--ap-soft:#111f3a;--ap-ink:#edfaff;--ap-line:#245c76;--ap-accent:#4df6ff;--ap-on:#04151f}
html[data-kaiopen-surface=note] .hero-tags{margin-top:16px}
@media(max-width:760px){html[data-kaiopen-surface=note] .sidebar{top:var(--top-height,125px);bottom:auto;min-height:0;height:calc(100dvh - var(--top-height,125px));max-height:calc(100dvh - var(--top-height,125px))}}
}