/* Circle 0.0.2 — standalone widget styles. */
[hidden] { display: none !important; }
.circle-widget {
  --bg:#0b0e11; --surface:#11161b; --surface-2:#161c22;
  --line:rgba(240,246,250,.09); --line-strong:rgba(240,246,250,.25);
  --ink:#f2f5f7; --ink-2:#9aa5ae; --ink-3:#7d8892;
  --accent:#1e9ad4; --accent-text:#5ec1ee; --accent-ink:#06202e;
  --pos:#65d6bd; --neg:#ff7e6b; --focus:#8ed0f2;
  --radius:16px; --radius-s:10px; --ease:cubic-bezier(.2,.8,.2,1); --dur:180ms;
  --ff:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --ff-mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --ff-serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --ground:radial-gradient(120% 90% at 50% -10%,#10161d 0%,var(--bg) 55%),var(--bg);
  --cell-ink:#fff; --cell-halo:rgba(2,6,10,.5); --cell-edge:#070a0d; --ring:rgba(240,246,250,.72);
  --tone0-0:#20417a;--tone0-1:#285096;--tone0-2:#2e5dad;--tone0-3:#3367c1;--tone0-4:#3d71cb;
  --tone1-0:#124c2d;--tone1-1:#165e38;--tone1-2:#196c40;--tone1-3:#1c7947;--tone1-4:#1f834e;
  --tone2-0:#134950;--tone2-1:#175a63;--tone2-2:#1b6872;--tone2-3:#1e747f;--tone2-4:#217e8b;
  --tone3-0:#5f3a0f;--tone3-1:#754813;--tone3-2:#875216;--tone3-3:#975c19;--tone3-4:#a5641b;
  --tone4-0:#79261c;--tone4-1:#942e23;--tone4-2:#ab3528;--tone4-3:#be3b2d;--tone4-4:#cf4131;
  --tone5-0:#53327a;--tone5-1:#673d96;--tone5-2:#7647ad;--tone5-3:#8252b8;--tone5-4:#8b5ebd;
  color-scheme:dark;
}
.circle-widget[data-skin="solari"] {
  --bg:#0d0e10;--surface:#16181c;--surface-2:#1d2025;--line:rgba(245,232,205,.10);--line-strong:rgba(245,232,205,.27);
  --ink:#f3ecdd;--ink-2:#bcae94;--ink-3:#948868;--accent:#f3a51f;--accent-text:#ffc65e;--accent-ink:#241800;
  --pos:#86d68f;--neg:#ff9152;--focus:#ffc65e;--ground:radial-gradient(120% 90% at 50% -10%,#16171a 0%,var(--bg) 60%),var(--bg);
}
.circle-widget[data-skin="ink"] {
  --bg:#efece3;--surface:#f6f3ea;--surface-2:#e8e3d6;--line:rgba(28,24,16,.16);--line-strong:rgba(28,24,16,.38);
  --ink:#1b1a15;--ink-2:#514d43;--ink-3:#5f5b4f;--accent:#2f3f86;--accent-text:#2b3a7d;--accent-ink:#fff;
  --pos:#1f7a4d;--neg:#b23a2e;--focus:#2f3f86;--ground:var(--bg);--cell-ink:#1b1a15;--cell-halo:rgba(255,255,255,.6);--cell-edge:#efece3;--ring:rgba(28,24,16,.5);color-scheme:light;
  --tone0-0:#cfdbee;--tone0-1:#bacae7;--tone0-2:#a2b8de;--tone0-3:#86a3d4;--tone0-4:#6388c8;
  --tone1-0:#b1e6ca;--tone1-1:#8cdab0;--tone1-2:#60cb92;--tone1-3:#3bb675;--tone1-4:#329962;
  --tone2-0:#b6e2e7;--tone2-1:#95d4dc;--tone2-2:#6dc4cf;--tone2-3:#3eb0bf;--tone2-4:#3494a1;
  --tone3-0:#eed6bc;--tone3-1:#e6c49d;--tone3-2:#ddaf7a;--tone3-3:#d29550;--tone3-4:#ba7a30;
  --tone4-0:#f0d4d1;--tone4-1:#e9c0bb;--tone4-2:#e1aaa3;--tone4-3:#d88f87;--tone4-4:#cc6c62;
  --tone5-0:#e0d6eb;--tone5-1:#d2c4e2;--tone5-2:#c2afd8;--tone5-3:#b097cc;--tone5-4:#9a7abe;
}
.circle-widget *, .circle-widget *::before, .circle-widget *::after { box-sizing:border-box; }
.circle-widget .sr-only { position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important; }
.circle-widget .micro { font: .7rem/1.45 var(--ff-mono); color:var(--ink-3); letter-spacing:.05em; }
.circle-widget .hmenu-btn,.circle-widget .skin-btn,.circle-widget .chip-btn,.circle-widget .play,.circle-widget .disc-btn {
  border:1px solid var(--line);background:var(--surface-2);color:var(--ink-2);border-radius:999px;min-height:40px;
}
.circle-widget .hmenu-btn,.circle-widget .skin-btn,.circle-widget .chip-btn { display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.34rem .8rem; }
.circle-widget .play { display:grid;place-items:center;width:44px;height:44px;padding:.6rem;color:var(--accent-text); }
.circle-widget .disc-nav { position:absolute;inset:0;pointer-events:none; }
.circle-widget .disc-btn { position:absolute;left:50%;top:50%;display:grid;place-items:center;padding:.35rem;pointer-events:auto;color:var(--accent-text); }
.circle-widget .disc-btn::before { font:700 1.15rem var(--ff);line-height:1; }
.circle-widget .circle-overview::before { content:"▦"; }
.circle-widget .circle-root::before { content:"●"; }
.circle-widget .circle-up::before { content:"←"; }
.circle-widget .disc-ring { fill:none;stroke:var(--ring);stroke-width:3;pointer-events:none; }
.circle-widget .cell { stroke:var(--cell-edge);stroke-width:1.5;stroke-linejoin:round;cursor:pointer; }
.circle-widget .cell.s0{fill:var(--c0)}.circle-widget .cell.s1{fill:var(--c1)}.circle-widget .cell.s2{fill:var(--c2)}.circle-widget .cell.s3{fill:var(--c3)}.circle-widget .cell.s4{fill:var(--c4)}
.circle-widget .cell:hover { stroke:var(--ink);stroke-width:3.5; }
.circle-widget .cell-label text { fill:var(--cell-ink);paint-order:stroke fill;stroke:var(--cell-halo);stroke-width:2.6px;stroke-linejoin:round;font-family:var(--ff);font-variant-numeric:tabular-nums; }
.circle-widget .chip { font-size:.62rem;letter-spacing:.08em;padding:.22rem .55rem;border-radius:999px;line-height:1; }
.circle-widget .chip-live { color:var(--accent-text);border:1px solid currentColor; }
.circle-widget .yearbar { display:grid;grid-template-columns:minmax(0,1fr);align-items:center; }
.circle-widget .detail-split { grid-column:1/-1;border-top:1px solid var(--line); }
.circle-widget .detail-science { grid-column:1/-1; }
.circle-widget .ranked-row { font:inherit; }


.circle-widget [data-tone="0"] { --c0: var(--tone0-0); --c1: var(--tone0-1); --c2: var(--tone0-2); --c3: var(--tone0-3); --c4: var(--tone0-4); }
.circle-widget [data-tone="1"] { --c0: var(--tone1-0); --c1: var(--tone1-1); --c2: var(--tone1-2); --c3: var(--tone1-3); --c4: var(--tone1-4); }
.circle-widget [data-tone="2"] { --c0: var(--tone2-0); --c1: var(--tone2-1); --c2: var(--tone2-2); --c3: var(--tone2-3); --c4: var(--tone2-4); }
.circle-widget [data-tone="3"] { --c0: var(--tone3-0); --c1: var(--tone3-1); --c2: var(--tone3-2); --c3: var(--tone3-3); --c4: var(--tone3-4); }
.circle-widget [data-tone="4"] { --c0: var(--tone4-0); --c1: var(--tone4-1); --c2: var(--tone4-2); --c3: var(--tone4-3); --c4: var(--tone4-4); }
.circle-widget [data-tone="5"] { --c0: var(--tone5-0); --c1: var(--tone5-1); --c2: var(--tone5-2); --c3: var(--tone5-3); --c4: var(--tone5-4); }
.circle-widget [data-tone="6"] { --c0: #38516a; --c1: #3e5a72; --c2: #466279; --c3: #526d83; --c4: #586f85; }
.circle-widget[data-skin="ink"] [data-tone="6"] { --c0: #e0e5ea; --c1: #d1dbe3; --c2: #bacad8; --c3: #a1b6c9; --c4: #8da6bc; }.circle-widget { width: 100%; color: var(--ink); background: var(--ground); font-family: var(--ff); padding: 0 0 1.5rem; border-radius: var(--radius); }
.circle-widget *, .circle-widget *::before, .circle-widget *::after { box-sizing: border-box; }
.circle-widget button, .circle-widget select, .circle-widget input { font: inherit; }
.circle-widget button { cursor: pointer; }
.circle-widget button:disabled { cursor: default; opacity: .45; }
.circle-widget :focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.circle-widget .circle-toolbar { position: relative; z-index: 31; display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; justify-content: center; margin-bottom: 1rem; padding-inline: .5rem; }
.circle-widget .circle-toolbar .hmenu-btn, .circle-widget .skin-btn { min-height: 44px; padding: .5rem .85rem; font-size: .75rem; letter-spacing: .01em; text-transform: none; }
.circle-widget .circle-group-label { min-width: 0; max-width: min(360px, 100%); }
.circle-widget .circle-filter { width: 100%; max-width: 100%; color: var(--ink); background: var(--surface-2); border: 1px solid var(--line-strong); border-radius: var(--radius-s); }
.circle-widget .circle-filter option, .circle-widget .circle-filter optgroup { background: var(--surface); color: var(--ink); }
.circle-widget .circle-views { position: relative; }
.circle-widget .circle-views summary { cursor: pointer; }
.circle-widget .circle-links { position: absolute; z-index: 10; min-width: 180px; top: calc(100% + .3rem); left: 0; padding: .4rem; background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--radius-s); box-shadow: 0 .8rem 2.5rem #0005; }
.circle-widget .circle-links a { display: block; border: 0; border-radius: .3rem; }
.circle-widget .circle-links a[aria-current="page"] { color: var(--accent-text); }
.circle-widget .circle-transport { width: min(100%, 840px); margin: 0 auto 1.25rem; padding: 1rem 1.25rem .35rem; }
.circle-widget .circle-console { display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.circle-widget .console-left, .circle-widget .console-right { display: flex; align-items: center; flex: 1 1 0; min-width: 0; gap: .65rem; }
.circle-widget .console-right { justify-content: flex-end; }
.circle-widget .console-center { flex: 0 0 auto; flex-direction: column; gap: .15rem; text-align: center; }
.circle-widget .year-out { color: var(--accent-text); font: 600 1.25rem var(--ff-mono); }
.circle-widget .play, .circle-widget .tick-control { flex: 0 0 44px; width: 44px; height: 44px; padding: .6rem; }
.circle-widget .play .ic { width: 24px; height: 24px; }
.circle-widget .play .ic-pause { display: none; }
.circle-widget .play.is-playing .ic-play { display: none; }
.circle-widget .play.is-playing .ic-pause { display: block; }
.circle-widget .circle-speed { min-height: 44px; min-width: 95px; padding: .45rem; white-space: nowrap; font: .75rem var(--ff-mono); }
.circle-widget .tick-control { color: var(--accent-text); border-radius: 50%; }
.circle-widget .tick-control[aria-pressed="false"] { color: var(--ink-3); }
.circle-widget .yearbar { width: 100%; }
.circle-widget .year-range { width: 100%; height: 44px; margin: 0; cursor: ew-resize; accent-color: var(--accent); }
.circle-widget .circle-time-scale { position: relative; display: block; height: 35px; margin-top: -10px; }
.circle-widget .circle-time-tick { position: absolute; left: var(--at); top: 0; transform: translateX(-50%); height: 35px; min-width: 32px; border: 0; padding: 0; color: var(--ink-3); background: transparent; font: .6rem var(--ff-mono); }
.circle-widget .circle-time-tick:first-child { transform: none; }
.circle-widget .circle-time-tick:last-child { transform: translateX(-100%); }
.circle-widget .lede { max-width: none; margin: 1.25rem auto .6rem; padding-inline: .8rem; }
.circle-widget .lede-row { display: flex; flex-direction: column; align-items: center; gap: .3rem; }
.circle-widget .circle-scope-line { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .25rem .8rem; text-align: center; }
.circle-widget .lede-title { margin: 0; }
.circle-widget .lede-place { max-width: 30ch; font-size: .68rem; line-height: 1.5; margin: 0; }
.circle-widget .lede-hero { font-size: clamp(2rem, 5vw, 3.5rem); }
.circle-widget .lede-share, .circle-widget .circle-item-count { font-size: .65rem; margin: 0; white-space: normal; min-width: 0; }
.circle-widget .circle-wrap { display: block; width: 100%; margin: 0; padding: 16px 88px 28px; }
.circle-widget .circle-fig { width: 100%; margin: 0; display: block; }
.circle-widget .circle-fig > .circle-item-count { display: block; margin-top: 1.1rem; text-align: center; }
.circle-widget .circle-box { padding: 0; --group-size: 84px; width: min(100%, 720px, max(240px, 68svh)); height: auto; aspect-ratio: 1; margin: 0 auto; position: relative; }
.circle-widget .circle { width: 100%; max-width: none; height: auto; display: block; margin: 0; overflow: visible; }
.circle-widget .circle-rim { width: 100%; height: 100%; top: 0; left: 0; transform: none; }
.circle-widget .disc-btn { transform: translate(-50%, -50%) rotate(var(--angle)) translateY(var(--rim-distance, -330px)) rotate(var(--counter-angle)); width: var(--icon, 48px); height: var(--icon, 48px); }
.circle-widget .circle-root { }
.circle-widget .circle-board { font: 650 .95rem var(--ff-mono); color: var(--accent-text); }
.circle-widget .circle-search-button::before, .circle-widget .circle-board::before, .circle-widget .circle-group-btn::before { display: none; }
.circle-widget .circle-group-btn { width: var(--group-size); height: var(--group-size); min-height: 44px; padding: .3rem .45rem; border-radius: 50%; background: var(--surface); border-color: color-mix(in srgb, var(--c3) 65%, var(--line-strong)); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .15rem; color: var(--ink); font-size: .68rem; line-height: 1.15; }
.circle-widget .circle-group-btn[aria-pressed="true"] { outline: 2px solid var(--accent); outline-offset: 2px; }
.circle-widget .circle-group-name { font-weight: 650; max-width: 100%; white-space: normal; overflow-wrap: normal; word-break: normal; text-align: center; }
.circle-widget .circle-group-value { font: .62rem var(--ff-mono); color: var(--ink-2); }
.circle-widget .cell-label { pointer-events: none; }
.circle-widget .cell-label.is-hidden { display: none; }
.circle-widget .cell-label .cl-name { font-family: var(--ff); font-weight: 650; }
.circle-widget .cell-label .cl-value { font-family: var(--ff); font-weight: 480; }
.circle-widget .detail-in-circle { position: absolute; inset: .8%; width: 98.4%; height: 98.4%; max-width: none; aspect-ratio: 1; margin: 0; padding: 0; border-radius: 50%; border: 2px solid var(--ring); display: grid; place-items: center; overflow: hidden; background: var(--surface); background: color-mix(in srgb, var(--c0) 10%, var(--surface)); }

.circle-widget .detail-in-circle { grid-template: minmax(0, 1fr) / minmax(0, 1fr); }
.circle-widget .detail-inner { width: 68%; height: auto; max-height: 72%; align-self: center; justify-self: center; margin-top: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: .4rem; }
.circle-widget .detail-name { margin: 0 0 .3rem; font-size: 1.1rem; overflow-wrap: anywhere; }
.circle-widget .circle-name-door { border: 0; color: var(--ink); background: none; font: inherit; font-weight: 700; min-height: 44px; padding: .2rem .4rem; }
.circle-widget .circle-name-door:disabled { opacity: 1; }
.circle-widget .circle-name-door.is-door { color: var(--accent-text); text-decoration: underline; text-underline-offset: .22em; }
.circle-widget .detail-rows { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: .25rem .5rem; font-size: .8rem; line-height: 1.35; margin: 0; }
.circle-widget .detail-rows dt { color: var(--ink-2); font-family: var(--ff); font-size: inherit; overflow-wrap: anywhere; text-align: right; }
.circle-widget .detail-rows dd { text-align: left; color: var(--ink); font-family: var(--ff-mono); font-size: inherit; margin: 0; overflow-wrap: anywhere; white-space: normal; }
.circle-widget .detail-rows .detail-split { grid-column: 1/-1; margin-block: .35rem; border-top: 1px solid var(--line-strong); }
.circle-widget .detail-rows .detail-science { grid-column: 1/-1; text-align: left; font-family: var(--ff); }
.circle-widget .detail-note { margin-top: .8rem; font-size: .72rem; letter-spacing: 0; text-transform: none; }
.circle-widget .circle-empty { position: absolute; inset: 35% 15%; text-align: center; pointer-events: none; font-size: .85rem; }
.circle-widget .circle-data-note { font-size: .73rem; max-width: 78ch; margin: .2rem auto .8rem; letter-spacing: 0; text-transform: none; line-height: 1.5; padding: 0 .75rem; }
.circle-widget .circle-scope-definition { margin: 0 auto 1rem; max-width: 78ch; padding: .5rem .75rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-s); }
.circle-widget .circle-scope-definition summary { cursor: pointer; min-height: 32px; font-size: .75rem; display: flex; align-items: center; }
.circle-widget .circle-scope-definition p { font: .8rem/1.6 var(--ff); text-transform: none; letter-spacing: 0; }
.circle-widget .circle-list-heading { display: flex; align-items: center; justify-content: flex-end; gap: .5rem; margin: .7rem .5rem; }
.circle-widget .circle-list-heading .chip-btn { min-height: 44px; font-size: .8rem; }
.circle-widget .ranked-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .3rem; padding: 0 .5rem; list-style: none; margin: 0; }
.circle-widget .ranked-list li { min-width: 0; }
.circle-widget .ranked-row { display: flex; align-items: center; justify-content: space-between; gap: .6rem; width: 100%; min-height: 44px; padding: .55rem .6rem; border: 1px solid var(--line); border-inline-start: 3px solid var(--c3, var(--line)); border-radius: 7px; background: var(--surface); color: var(--ink); text-align: left; }
.circle-widget .ranked-name { font-size: .77rem; white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.3; }
.circle-widget .ranked-value { font: .74rem var(--ff-mono); white-space: nowrap; }
.circle-widget .circle-attribution { margin: 1.25rem .7rem 0; text-align: center; font-size: .7rem; letter-spacing: 0; text-transform: none; }
.circle-widget .circle-picker { position: fixed; inset: auto; margin: 0; max-width: none; max-height: none; box-sizing: border-box; overflow: hidden; padding: clamp(.65rem, 2vw, 1.2rem); border: 1px solid var(--line-strong); border-radius: var(--radius-s, 12px); background: var(--surface); color: var(--ink); box-shadow: 0 .8rem 2rem #0005; font-family: var(--ff); }
.circle-widget .circle-picker[open] { display: flex; flex-direction: column; }
.circle-widget .circle-picker-title { flex: none; margin: 0 0 .7rem; color: var(--accent-text); font: 650 1.05rem var(--ff); letter-spacing: -.01em; text-transform: none; }
.circle-widget .circle-picker::backdrop { background: transparent; }
.circle-widget .circle-picker-head { display: flex; flex: none; gap: .5rem; background: var(--surface); padding-bottom: .8rem; }
.circle-widget .circle-picker-head .chip-btn { min-height: 44px; padding: .5rem .7rem; font: .8rem var(--ff); }
.circle-widget .circle-search { min-width: 0; flex: 1; min-height: 44px; padding: .6rem; background: var(--surface-2); color: var(--ink); border: 1px solid var(--line-strong); border-radius: 8px; }
.circle-widget .circle-search-list { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; list-style: none; padding: 0 .2rem 0 0; margin: 0; }
.circle-widget .circle-search-list .ranked-row { padding: .65rem .75rem; background: var(--surface-2); border-radius: var(--radius-s, 8px); }
.circle-widget .circle-search-list .ranked-row:hover { background: color-mix(in srgb, var(--c3) 16%, var(--surface)); border-color: var(--c3); }
.circle-widget .circle-search-list .ranked-name { font-size: .85rem; }
.circle-widget .circle-search-list .ranked-value { font-size: .8rem; color: var(--accent-text); }
.circle-widget .circle-search-list li { margin-bottom: .3rem; }
@media (max-width: 600px) {
  .circle-brand { padding: .6rem .75rem; }
  .circle-widget .circle-toolbar { gap: .3rem; padding: 0; }
  .circle-widget .circle-toolbar .hmenu-btn, .circle-widget .skin-btn { padding: .4rem .6rem; font-size: .7rem; }
  .circle-widget .circle-group-label { flex-basis: 100%; max-width: 100%; order: 3; }
  .circle-widget .circle-transport { padding: .65rem .7rem 0; margin-bottom: .9rem; }
  .circle-widget .console-left { gap: .3rem; }
  .circle-widget .circle-speed { min-width: 78px; font-size: .65rem; }
  .circle-widget .year-out { font-size: 1rem; }
  .circle-widget .circle-time-tick { font-size: .5rem; }
  .circle-widget .lede-place { font-size: .6rem; max-width: 35ch; }
  .circle-widget .circle-wrap { padding: 16px 58px 26px; }
  .circle-widget .circle-box { --group-size: 54px; }
  .circle-widget .circle-group-btn { font-size: .68rem; }
  .circle-widget .circle-group-value { font-size: .58rem; }
  .circle-widget .detail-name { font-size: .85rem; margin-bottom: .35rem; }
  .circle-widget .detail-inner { width: 70%; max-height: 72%; padding: .35rem; }
  .circle-widget .detail-rows { font-size: .72rem; line-height: 1.35; gap: .25rem .4rem; }
  .circle-widget .detail-note { font-size: .68rem; }
  .circle-widget .ranked-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .circle-widget .ranked-value { font-size: .68rem; }
  .circle-widget .ranked-name { font-size: .72rem; }
}
@media (prefers-reduced-motion: reduce) { .circle-widget *, .circle-widget *::before { animation: none !important; transition: none !important; } }

.circle-widget .circle-group-code { display: none; }
.circle-widget .year-range { appearance: none; -webkit-appearance: none; background: transparent; }
.circle-widget .year-range::-webkit-slider-runnable-track { height: 4px; border: 1px solid var(--line-strong); border-radius: 5px; background: var(--surface-2); }
.circle-widget .year-range::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: 14px; height: 14px; margin-top: -6px; border-radius: 50%; background: var(--ink); border: 0; }
.circle-widget .year-range::-moz-range-track { height: 3px; border: 1px solid var(--line-strong); border-radius: 5px; background: var(--surface-2); }
.circle-widget .year-range::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: var(--ink); border: 0; }
@media(max-width:600px){ .circle-widget .circle-group-name { display:none; } .circle-widget .circle-group-code { display:block; font-weight:650; } }


.circle-widget .circle-transport { padding-top: .65rem; margin-bottom: .9rem; }
.circle-widget .circle-console { margin-bottom: 0; }
.circle-widget .circle-time-scale { height: 25px; margin-top: -15px; }
.circle-widget .circle-time-tick { height: 28px; z-index: 1; }
.circle-widget .circle-event-mark { position: absolute; left: var(--at); top: -21px; width: 14px; height: 18px; padding: 0; border: 0; transform: translateX(-50%); background: transparent; z-index: 2; }
.circle-widget .circle-event-mark::before { content: ''; display: block; width: 3px; height: 7px; background: var(--accent); margin: 0 auto; border-radius: 1px; }

.circle-widget .circle-event-mark[data-lead]::before { transform: translateY(-5px); }
.circle-widget .circle-event-mark[data-lead]::after { content: ''; position: absolute; top: 7.5px; height: 5px; width: var(--lead); border-top: 1px solid var(--accent); pointer-events: none; }
.circle-widget .circle-event-mark[data-lead="r"]::after { left: 7px; border-right: 1px solid var(--accent); }
.circle-widget .circle-event-mark[data-lead="l"]::after { right: 7px; border-left: 1px solid var(--accent); }
.circle-widget .circle-time-hint { max-width: 36ch; margin: 0; color: var(--ink-2); font: .68rem/1.4 var(--ff); letter-spacing: 0; text-transform: none; }
.circle-widget .circle-time-hint[hidden] { display: none; }
.circle-widget .circle-box { width: min(100%, 720px, max(240px, 61svh)); }
@media(max-width:600px){
 .circle-widget .lede-row { gap: .4rem .45rem; }
 .circle-widget .lede-hero { font-size: clamp(1.4rem, 6vw, 2rem); }
 .circle-widget .lede-share, .circle-widget .circle-item-count { font-size: .6rem; letter-spacing: .02em; }
 .circle-widget .circle-time-hint { font-size: .65rem; }
 .circle-widget .circle-group-value { max-width: 100%; overflow: hidden; }
}

.circle-widget .console-left { order: 0; }
.circle-widget .console-center { order: 1; }
.circle-widget .console-right { order: 2; }
.circle-widget .circle-scroll-hint { position: absolute; bottom: 9%; left: 25%; right: 25%; margin: 0; text-align: center; font: .64rem var(--ff); color: var(--ink-2); pointer-events: none; }
@media(max-width:600px){ .circle-widget .circle-scroll-hint { font-size:.58rem; bottom:8%; } }

.circle-widget .circle-search-button svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }

.circle-widget .circle-card-container { display: block; margin: 0 auto .65rem; max-width: 100%; min-height: 44px; padding: .25rem .5rem; border: 0; background: none; color: var(--accent-text); font: 700 1.3rem var(--ff); text-decoration: underline; text-underline-offset: .2em; overflow-wrap: anywhere; cursor: pointer; }
.circle-widget .circle-card-container[hidden] { display: none; }
@media (max-width: 599px) { .circle-widget .circle-card-container { font-size: 1.05rem; margin-bottom: .3rem; } }

.circle-widget .circle-group-btn.is-root-group .circle-group-value { font-size: .82rem; font-weight: 650; }
@media (max-width: 899px) { .circle-widget .circle-group-btn.is-root-group .circle-group-value { font-size: .68rem; } }

@media (max-width: 600px) {
 .circle-widget .circle-console { flex-wrap: wrap; }
 .circle-widget .console-center { order: -1; flex-basis: 100%; margin-bottom: .25rem; }
}


.circle-widget .circle-group-btn {
  background: var(--c4);
  color: var(--cell-ink);
  border: 3px solid var(--bg);
  box-shadow: 0 0 0 1px var(--c4);
}
.circle-widget .circle-group-btn .circle-group-value { color: inherit; }

.circle-widget .circle-group-btn.is-home { background: var(--surface-2); color: var(--ink); box-shadow: 0 0 0 1px var(--line-strong); }

.circle-widget .circle-group-btn.is-home.has-art::before { display: block; flex: none; width: 42%; height: 42%; margin: 0; }
.circle-widget .circle-rim-groups .circle-group-btn.is-home.has-art .circle-group-name, .circle-widget .circle-rim-groups .circle-group-btn.is-home.has-art .circle-group-code { display: none; }
.circle-widget .circle-up::before { transform: none; }


.circle-widget .circle-time-hint { max-width: var(--hint-w, 36ch); max-height: none; overflow: hidden; text-align: center; }
.circle-widget .circle-time-event { display: block; }


.circle-widget .is-scrolling .circle-group-btn:not(.is-root-group) { font-size: .63rem; gap: .08rem; padding: .25rem .35rem; }
.circle-widget .is-scrolling .circle-group-value { font-size: .58rem; }
.circle-widget .circle-group-rank { font: 600 .58rem var(--ff-mono); opacity: .85; }
.circle-widget .circle-scroll-group { display: flex; gap: 3px; width: max-content; margin-left: -16px; height: 30px; min-height: 0; padding: 0; border: 0; background: none; box-shadow: none; }
.circle-widget .circle-scroll-group::before { display: none; }
.circle-widget .circle-scroll-button { display: grid; place-items: center; width: 30px; height: 30px; min-height: 0; padding: 4px; border: 1px solid currentColor; border-radius: 50%; background: var(--surface); color: var(--accent-text); cursor: pointer; }
.circle-widget .circle-scroll-button[data-kind="page"] { color: var(--accent-text); }
.circle-widget .circle-scroll-button[data-kind="item"] { color: var(--pos); }
.circle-widget .circle-scroll-button:disabled { opacity: .28; cursor: default; }
.circle-widget .circle-scroll-button svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.circle-widget .circle-scroll-button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.circle-widget .cell.is-highlighted { stroke: var(--accent); stroke-width: 4; vector-effect: non-scaling-stroke; paint-order: fill stroke; }

.circle-widget .is-scrolling .circle-group-btn .circle-group-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; flex-shrink: 1; min-height: 0; }
.circle-widget .is-scrolling .circle-group-btn.is-root-group .circle-group-value { font-size: .62rem; }
.circle-widget .is-scrolling .circle-group-btn.is-root-group .circle-group-name { font-size: .58rem; }
.circle-widget .is-scrolling .circle-group-rank,
.circle-widget .is-scrolling .circle-group-value { flex-shrink: 0; }
@media (max-width: 600px) { .circle-widget .is-scrolling .circle-group-btn .circle-group-name { display: none; } }
@media (max-width: 600px) { .circle-widget .is-scrolling .circle-group-btn.is-home { padding: .2rem .15rem; } .circle-widget .is-scrolling .circle-group-btn.is-home .circle-group-value { font-size: .46rem; letter-spacing: -.05em; white-space: nowrap; } }

.circle-widget .circle-board.is-measure { font-size: 1.15rem; line-height: 1; }

.circle-widget .circle-group-btn.has-art::before { display: block; flex: none; width: 72%; height: 72%; margin: 0; }
.circle-widget .circle-rim-groups .circle-group-btn.has-art .circle-group-name, .circle-widget .circle-rim-groups .circle-group-btn.has-art .circle-group-code { display: none; }

.circle-widget .circle-rim-groups .circle-group-btn[data-fit] > .circle-group-name { font-size: var(--fit-name) !important; }
.circle-widget .circle-rim-groups .circle-group-btn[data-fit] > .circle-group-value { font-size: var(--fit-value) !important; }
.circle-widget .circle-rim-groups .circle-group-btn[data-fit] > .circle-group-rank { font-size: var(--fit-rank) !important; }
.circle-widget .circle-rim-groups .circle-group-btn[data-fit] > .circle-group-code { font-size: var(--fit-code) !important; }
.circle-widget .circle-rim-groups .circle-group-btn[data-fit-wrap] > .circle-group-name { overflow-wrap: anywhere; }


.circle-widget .circle-group-btn.has-art::before { content:""; background:currentColor; mask:var(--art) center / contain no-repeat; -webkit-mask:var(--art) center / contain no-repeat; }

.circle-widget .lede-title{font-weight:500;line-height:1.1;color:var(--ink)}