*{box-sizing:border-box}
:root{color-scheme:light;--background:#f3e8d5;--ink:#232f2a;--wheel-mix:#f9f2e7;--hover-brightness:.96}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--background)}
#wheel{
  --wheel-top:max(12px,env(safe-area-inset-top,0px));
  --wheel-bottom:max(12px,env(safe-area-inset-bottom,0px));
  --safe-left:env(safe-area-inset-left,0px);
  --safe-right:env(safe-area-inset-right,0px);
  --available-width:calc(100vw - var(--safe-left) - var(--safe-right));
  --full-height-size:calc(100dvh - var(--wheel-top) - var(--wheel-bottom));
  /* Below the full-height radius, shrink and make room for labels near the hub. */
  --radius-shortfall:max(0px,calc(var(--full-height-size) / 2 - var(--available-width)));
  --label-room:min(calc(var(--available-width) * .1),calc(var(--radius-shortfall) * 2));
  --wheel-size:min(var(--full-height-size),max(1px,calc((var(--available-width) - var(--label-room)) * 2)));
  /* Keep the right edge visible as the left side moves outside the viewport. */
  --overflow:max(0px,calc(var(--wheel-size) + 24px - var(--available-width)));
  --initial-reveal:min(calc(var(--overflow) * .15),calc(var(--available-width) * .14));
  --left-reveal:min(var(--initial-reveal),12px);
  --word-size:clamp(18px,calc(18px + var(--overflow) * .014),20.7px);
  --category-size:clamp(24px,calc(24px + var(--overflow) * .018),27.6px);
  position:fixed;
  top:calc(var(--wheel-top) + (var(--full-height-size) - var(--wheel-size)) / 2);
  left:calc(var(--safe-left) + min(calc((var(--available-width) - var(--wheel-size)) / 2),calc(var(--available-width) - var(--wheel-size) - 12px)) + var(--left-reveal));
  width:var(--wheel-size);
  height:var(--wheel-size);
  touch-action:pinch-zoom;
  user-select:none;
  -webkit-user-select:none;
}
svg{display:block;width:100%;height:100%;overflow:visible}
.sector{cursor:pointer;outline:none;transition:opacity .12s}
#wheel .is-dragging,#wheel .is-dragging .sector{cursor:grabbing}
.sector path{fill:color-mix(in srgb,var(--family-color) var(--light-weight),var(--wheel-mix));stroke:var(--background);stroke-width:1.4;stroke-linejoin:round;transition:filter .12s}
.sector text{font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:var(--word-size);fill:var(--ink);pointer-events:none}
.sector text[font-size="24"]{font-size:var(--category-size)}
.sector.is-muted{opacity:.38}
.wheel-outlines path{fill:none;stroke:var(--ink);stroke-width:2.5;stroke-linejoin:round}
.rotation-hint{fill:none;stroke:var(--ink);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;pointer-events:none;opacity:.72;transition:opacity .4s ease-out}
.rotation-hint.is-hidden{opacity:0}
.sector:hover path{filter:brightness(var(--hover-brightness))}
@media(max-width:600px){
  .sector text{font-weight:500}
  .sector text[font-size="24"]{font-weight:700}
  .sector.is-muted{opacity:.68}
}
:root[data-theme="dark"]{color-scheme:dark;--background:#201e1b;--ink:#f1eade;--wheel-mix:#201e1b;--hover-brightness:1.12}
[data-theme="dark"] .sector path{fill:color-mix(in srgb,var(--family-color) var(--dark-weight),var(--wheel-mix))}
#theme-toggle,#about-link{position:fixed;top:max(12px,env(safe-area-inset-top));z-index:1;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid color-mix(in srgb,var(--ink) 20%,transparent);border-radius:50%;background:var(--background);color:var(--ink);cursor:pointer;-webkit-tap-highlight-color:transparent}
#theme-toggle{right:max(12px,env(safe-area-inset-right))}
#about-link{right:calc(max(12px,env(safe-area-inset-right)) + 52px);font:600 18px/1 system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;text-decoration:none}
#theme-toggle:hover,#about-link:hover{background:color-mix(in srgb,var(--ink) 8%,var(--background))}
#theme-toggle:focus-visible,#about-link:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
#theme-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#theme-toggle .sun,[data-theme="dark"] #theme-toggle .moon{display:none}
[data-theme="dark"] #theme-toggle .sun{display:block}
#definition{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:2;width:min(288px,calc(100vw - 32px));padding:16px 18px;border:1px solid color-mix(in srgb,var(--ink) 12%,transparent);border-radius:12px;background:color-mix(in srgb,var(--background) 94%,transparent);backdrop-filter:blur(12px);box-shadow:0 4px 20px #0000000a;color:var(--ink);font:15px/1.5 system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;animation:definition-in .14s ease-out}
#definition h2{margin:0 24px 6px 0;font-size:16px;font-weight:600;line-height:1.4}
#definition p{margin:0}
#definition-close{position:absolute;top:6px;right:6px;width:32px;height:32px;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;font:22px/1 system-ui;opacity:.55;cursor:pointer}
#definition-close:hover,#definition-close:focus-visible{opacity:1}
#definition-close:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
body.about-page{height:100vh;height:100dvh;overflow:auto;padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));color:var(--ink);font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.about-content{max-width:36rem;margin:clamp(32px,9vh,96px) auto}
.about-content h1{margin:32px 0 16px;font-size:clamp(1.75rem,5vw,2.25rem);line-height:1.2}
.about-content h2{margin:32px 0 12px;font-size:1.125rem;line-height:1.3}
.about-content p{margin:0 0 16px}
.about-citation{padding-left:2em;text-indent:-2em;overflow-wrap:anywhere}
.about-content a{color:inherit;text-underline-offset:.18em}
.about-content a:hover{opacity:.75}
.about-content a:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.about-back{font-size:14px}
@keyframes definition-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.sector,.sector path,.rotation-hint{transition:none}#definition{animation:none}}