/* Keleuo, by Wundur AI. Fonts: Bricolage Grotesque and Inter, both SIL OFL 1.1 (see fonts/). */
@font-face {
  font-family: "Bricolage";
  src: url("fonts/bricolage-grotesque-wght.woff2") format("woff2-variations"), url("fonts/bricolage-grotesque-wght.woff2") format("woff2");
  font-weight: 200 800; font-style: normal; font-display: swap;
}
@font-face { font-family: "Inter"; src: url("fonts/inter-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/inter-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }

/* ---------- tokens: light ---------- */
:root {
  color-scheme: light;
  --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px; --s9: 96px;
  --gutter: clamp(16px, 4vw, 64px);

  --bg: #f6f4ee;
  --bg-2: #eeebe3;
  --surface: #fffefa;
  --ink: #16171a;
  --ink-2: #33353c;
  --muted: #5a5d66;
  --line: #e3ded3;
  --line-2: #cec8bb;
  --brand: #6084e8;
  --brand-ink: #3150bd;
  --brand-deep: #2f49a8;
  --brand-top: #8fa8f2;
  --gold: #ffbf4a; --gold-top: #ffd06b; --gold-side: #e5a637;
  --cream: #fffcf3;
  --work: #1f8a5b; --wait: #e5a637; --idle: #8a8d96;
  --focus: #3150bd;
  --shadow: 0 1px 2px rgba(40, 32, 20, .05), 0 12px 28px -16px rgba(40, 32, 20, .24);
  --card-side: #dfd8c9;
  --sky-a: #e7ecfb;
  --stage: #4464d2; --stage-2: #3654bf; --stage-grid: rgba(255, 255, 255, .09);
  --win-shadow: 0 2px 0 rgba(20, 24, 50, .08), 0 30px 60px -24px rgba(20, 30, 80, .55);

  /* scene */
  --sl-t: #8aa4f1; --sl-l: #4e6fd4; --sl-r: #6084e8; --sl-edge: rgba(255, 255, 255, .55);
  --slot: rgba(255, 255, 255, .75); --pad: rgba(36, 56, 140, .16); --pad-mark: #ffd06b;
  --cr-t: #fffcf3; --cr-l: #ddcfac; --cr-r: #f1e8d4;
  --gd-t: #ffd06b; --gd-l: #e5a637; --gd-r: #ffbf4a;
  --tm-t: #3a3d44; --tm-l: #1f2024; --tm-r: #2b2d33;
  --ch-t: #fffdf7; --ch-l: #fff4de; --ch-r: #e2d3b0; --eye: #292a28;
  --lbl: #3a3427; --pill-bg: #ffffff; --pill-line: #dcd6c9; --pill-t: #16171a;
}

/* ---------- tokens: dark (system, unless the visitor chose light) ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0e1120; --bg-2: #151a2d; --surface: #171c30; --ink: #eef0f8; --ink-2: #c9cddc; --muted: #9da3b8;
    --line: #262c44; --line-2: #39425f; --brand-ink: #aabcff; --brand-deep: #3f5cc4; --focus: #aabcff;
    --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 14px 30px -16px rgba(0, 0, 0, .7); --card-side: #0a0d18;
    --sky-a: #151c38; --stage: #34489a; --stage-2: #2b3d86; --stage-grid: rgba(255, 255, 255, .06);
    --win-shadow: 0 2px 0 rgba(0, 0, 0, .3), 0 30px 60px -24px rgba(0, 0, 0, .8);
    --sl-t: #5672d2; --sl-l: #2a3f92; --sl-r: #3a54b4; --sl-edge: rgba(255, 255, 255, .28);
    --slot: rgba(255, 255, 255, .5); --pad: rgba(10, 16, 50, .3);
    --cr-t: #f6f0e1; --cr-l: #cbbd99; --cr-r: #e2d8c0;
    --tm-t: #4a4e58; --tm-l: #24262c; --tm-r: #33363e;
    --ch-t: #fbf8ef; --ch-l: #f6efdf; --ch-r: #d6c9ab;
    --pill-bg: #1d2338; --pill-line: #0b0e1a; --pill-t: #eef0f8;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0e1120; --bg-2: #151a2d; --surface: #171c30; --ink: #eef0f8; --ink-2: #c9cddc; --muted: #9da3b8;
  --line: #262c44; --line-2: #39425f; --brand-ink: #aabcff; --brand-deep: #3f5cc4; --focus: #aabcff;
  --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 14px 30px -16px rgba(0, 0, 0, .7); --card-side: #0a0d18;
  --sky-a: #151c38; --stage: #34489a; --stage-2: #2b3d86; --stage-grid: rgba(255, 255, 255, .06);
  --win-shadow: 0 2px 0 rgba(0, 0, 0, .3), 0 30px 60px -24px rgba(0, 0, 0, .8);
  --sl-t: #5672d2; --sl-l: #2a3f92; --sl-r: #3a54b4; --sl-edge: rgba(255, 255, 255, .28);
  --slot: rgba(255, 255, 255, .5); --pad: rgba(10, 16, 50, .3);
  --cr-t: #f6f0e1; --cr-l: #cbbd99; --cr-r: #e2d8c0;
  --tm-t: #4a4e58; --tm-l: #24262c; --tm-r: #33363e;
  --ch-t: #fbf8ef; --ch-l: #f6efdf; --ch-r: #d6c9ab;
  --pill-bg: #1d2338; --pill-line: #0b0e1a; --pill-t: #eef0f8;
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font: 400 17px/1.6 "Inter", system-ui, sans-serif; font-feature-settings: "cv11", "ss01";
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
a { color: inherit; }
img { display: block; max-width: 100%; height: auto; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; border-radius: 6px; }
.skip { position: absolute; left: 16px; top: -60px; background: var(--surface); color: var(--ink); padding: 8px 14px; border-radius: 8px; z-index: 10; }
.skip:focus { top: 12px; }
.vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; margin: 0; padding: 0; border: 0; }
.defs { position: absolute; }
.wrap { width: min(1200px, 100% - 2 * var(--gutter)); margin-inline: auto; }
h1, h2, h3 { font-family: "Bricolage", sans-serif; font-weight: 700; letter-spacing: -.028em; margin: 0; }
p { margin: 0; }

/* small cube symbol colours */
.cu-t { fill: var(--c-t, var(--cr-t)); } .cu-l { fill: var(--c-l, var(--cr-l)); } .cu-r { fill: var(--c-r, var(--cr-r)); }
.cu-gold { --c-t: var(--gd-t); --c-l: var(--gd-l); --c-r: var(--gd-r); }
.cu-blue { --c-t: #8fa8f2; --c-l: #4e6fd4; --c-r: #6084e8; }
.cu-dark { --c-t: var(--tm-t); --c-l: var(--tm-l); --c-r: var(--tm-r); }

/* ---------- header ---------- */
.top { position: relative; z-index: 3; }
.top-in { display: flex; align-items: center; justify-content: space-between; gap: var(--s4); height: 72px; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font: 700 24px/1 "Bricolage", sans-serif; letter-spacing: -.02em; }
.mark { width: 52px; height: 52px; flex: none; }
.mark-sm { width: 22px; height: 22px; }
.top nav { display: flex; gap: 2px; margin-left: auto; }
.top nav a { text-decoration: none; font-size: 15px; font-weight: 600; color: var(--ink-2); padding: 8px 12px; border-radius: 8px; }
.top nav a:hover { color: var(--ink); background: var(--bg-2); }
.top-end { display: flex; align-items: center; gap: var(--s2); }
.theme-toggle {
  display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; cursor: pointer;
  background: transparent; border: 1px solid var(--line); color: var(--ink-2);
}
.theme-toggle[hidden] { display: none; }
.theme-toggle:hover { background: var(--bg-2); color: var(--ink); }
.theme-toggle svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle .i-moon { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .theme-toggle .i-sun { display: none; }
  :root:not([data-theme="light"]) .theme-toggle .i-moon { display: block; }
}
:root[data-theme="dark"] .theme-toggle .i-sun { display: none; }
:root[data-theme="dark"] .theme-toggle .i-moon { display: block; }

/* ---------- hero ---------- */
.hero { position: relative; isolation: isolate; }
.hero::before {
  content: ""; position: absolute; inset: -72px 0 0 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(40% 50% at 74% 42%, color-mix(in oklab, var(--brand) 16%, transparent), transparent 70%),
    radial-gradient(26% 30% at 92% 78%, color-mix(in oklab, var(--gold) 16%, transparent), transparent 72%),
    linear-gradient(to bottom, color-mix(in oklab, var(--sky-a) 80%, var(--bg)), var(--bg) 85%);
}
.hero-in {
  display: grid; grid-template-columns: minmax(0, 30fr) minmax(0, 42fr); column-gap: clamp(16px, 2.5vw, 40px);
  align-items: center; padding: var(--s4) 0 var(--s6);
}
.eyebrow {
  display: inline-flex; align-items: center; gap: 9px; margin: 0 0 var(--s5);
  font: 600 13px/1.2 "Bricolage", sans-serif; letter-spacing: .02em; color: var(--ink-2);
  background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: 7px 13px 7px 11px; box-shadow: var(--shadow);
}
.eb-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 3px color-mix(in oklab, var(--gold) 30%, transparent); }
h1 { font-size: clamp(40px, 2.6vw + 22px, 72px); font-weight: 800; line-height: 1; letter-spacing: -.035em; text-wrap: balance; }
.lede { margin-top: clamp(18px, 1.5vw, 26px); font-size: clamp(17px, .3vw + 14px, 19.5px); line-height: 1.6; color: var(--ink-2); max-width: 34em; text-wrap: pretty; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3); margin-top: clamp(22px, 2vw, 32px); }
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 20px;
  border-radius: 12px; font-weight: 600; font-size: 15.5px; letter-spacing: -.005em; text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.btn-solid { background: var(--brand-deep); color: #fff; box-shadow: 0 3px 0 0 #22377f, 0 10px 20px -12px rgba(30, 50, 140, .6); }
.btn-solid:hover { transform: translateY(-1px); }
.btn-solid:active { transform: translateY(2px); box-shadow: 0 1px 0 0 #22377f; }
.btn-ghost { color: var(--muted); border: 1.5px dashed var(--line-2); cursor: default; }
.note { display: flex; align-items: flex-start; gap: 10px; margin-top: clamp(24px, 2.2vw, 36px); padding-top: var(--s4); border-top: 1px solid var(--line); font-size: 14.5px; line-height: 1.5; color: var(--muted); max-width: 32em; }
.note i { font-style: italic; color: var(--ink-2); }
.note-cube { flex: none; width: 20px; height: 20px; margin-top: 1px; }

.art { margin: 0 calc(-.5 * var(--gutter)) 0 0; display: flex; flex-direction: column; align-items: center; min-width: 0; }
.stage { width: 100%; }
.scene { display: block; width: 100%; height: auto; overflow: visible; }
.art-cap { display: flex; align-items: center; gap: var(--s3); margin-top: var(--s2); font: 600 12.5px/1.3 "Bricolage", sans-serif; letter-spacing: .02em; color: var(--muted); }
.replay { font: inherit; color: var(--brand-ink); background: none; border: 0; padding: 6px 4px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.replay[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { .replay { display: none; } }

/* scene fills */
.scene polygon { stroke-linejoin: round; }
.sl-t { fill: var(--sl-t); } .sl-l { fill: var(--sl-l); } .sl-r { fill: var(--sl-r); }
.sl-edge { fill: none; stroke: var(--sl-edge); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.slot { fill: none; stroke: var(--slot); stroke-width: 1.3; stroke-dasharray: 5 4; }
.pad { fill: var(--pad); }
.pad-mark { fill: none; stroke: var(--pad-mark); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.cr-t { fill: var(--cr-t); } .cr-l { fill: var(--cr-l); } .cr-r { fill: var(--cr-r); }
.gd-t { fill: var(--gd-t); } .gd-l { fill: var(--gd-l); } .gd-r { fill: var(--gd-r); }
.tm-t { fill: var(--tm-t); } .tm-l { fill: var(--tm-l); } .tm-r { fill: var(--tm-r); }
.cr-t, .cr-l, .cr-r, .gd-t, .gd-l, .gd-r, .tm-t, .tm-l, .tm-r { stroke-width: .6; }
.cr-t { stroke: var(--cr-t); } .cr-l { stroke: var(--cr-l); } .cr-r { stroke: var(--cr-r); }
.lbl { fill: var(--lbl); font: 700 .5px "Bricolage", sans-serif; letter-spacing: -.01px; }
.lbl-dk { fill: #f4efe2; }
.dot-work { fill: #1f9a63; } .dot-wait { fill: #e5a637; } .dot-idle { fill: none; stroke: #9a9078; stroke-width: .05; }
.fl { fill: #cdbf9c; }
.bub { fill: #8fa8f2; } .bub2 { fill: #e9dfc6; }
.cd1 { fill: #6084e8; } .cd2 { fill: #e5a637; }
.prompt { fill: #ffd06b; font: 700 .6px ui-monospace, "SF Mono", Menlo, Consolas, monospace; }
.sk { fill: #fff3d6; opacity: .85; }
/* crane: gold from the icon */
.cb-t { fill: #ffd06b; } .cb-l { fill: #e5a637; } .cb-r { fill: #ffbf4a; }
.cm-t { fill: #ffd16a; } .cm-l { fill: #dfa233; } .cm-r { fill: #ffc354; }
.cs-t { fill: #c68b28; } .cs-l { fill: #8d6418; } .cs-r { fill: #a87720; }
.bm-t { fill: #ffd16a; } .bm-l, .bm-r { fill: #eaaf42; }
.cw-t { fill: #5a5f6e; } .cw-l { fill: #3a3e4a; } .cw-r { fill: #4a4e5b; }
.cab-t { fill: #ffd16a; } .cab-l { fill: #e3a438; } .cab-r { fill: #ffc353; }
.lat { stroke: rgba(120, 80, 10, .35); stroke-width: 1.1; }
.tr-t { fill: #5a5f6e; } .tr-l { fill: #3a3e4a; } .tr-r { fill: #4a4e5b; }
.cable { fill: #414844; }
.hk-t { fill: #ffc553; } .hk-l { fill: #dfa333; } .hk-r { fill: #ffc553; }
/* the friend */
.ch-t { fill: var(--ch-t); stroke: var(--ch-t); stroke-width: .5; }
.ch-l { fill: var(--ch-l); stroke: var(--ch-l); stroke-width: .5; }
.ch-r { fill: var(--ch-r); stroke: var(--ch-r); stroke-width: .5; }
.eye { fill: var(--eye); }
/* status tags */
.pill-bg { fill: var(--pill-bg); stroke: var(--pill-line); stroke-width: 1; }
.pill-sh { fill: var(--pill-line); }
.pill-t { fill: var(--pill-t); font: 600 12.5px "Inter", sans-serif; }
.p-work .pd { fill: #1f9a63; } .p-wait .pd { fill: #e5a637; }

/* scene motion: only when the visitor allows it. Without motion, the finished scene shows. */
@media (prefers-reduced-motion: no-preference) {
  .scene.play .boom { transform-box: view-box; transform-origin: 0 0; animation: k-boom var(--build) linear .5s both; }
  .scene.play .trolley { animation: k-trolley var(--build) linear .5s both; }
  .scene.play .cable { transform-box: fill-box; transform-origin: 50% 0; animation: k-cable var(--build) linear .5s both; }
  .scene.play .hook { animation: k-hook var(--build) linear .5s both; }
  .scene.play .b-sessions { animation: k-b0 var(--build) linear .5s both; }
  .scene.play .b-skills { animation: k-b1 var(--build) linear .5s both; }
  .scene.play .b-claude { animation: k-b2 var(--build) linear .5s both; }
  .scene.play .b-code { animation: k-b3 var(--build) linear .5s both; }
  .scene.play .b-terminal { animation: k-b4 var(--build) linear .5s both; }
  .scene.play .slot { animation: slot-in .6s ease-out .2s both; }
  .scene.play .pill { animation: pill-in .5s ease-out both; }
  .scene.play .p-work { animation-delay: calc(.5s + var(--land0)); }
  .scene.play .p-wait { animation-delay: calc(.8s + var(--land0)); }
  .scene .eyes { transform-box: fill-box; transform-origin: 50% 50%; animation: blink 6s ease-in-out 2s infinite; }
  .hero.paused .scene *, .hero.paused .scene { animation-play-state: paused !important; }
}
@keyframes pill-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes slot-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes blink { 0%, 46%, 50%, 100% { transform: scaleY(1); } 48% { transform: scaleY(.1); } }
.pill { transform-box: fill-box; }

/* scene-anim:start */
/* generated by tools/scene.py: 5 blocks, 24.1s */
:root{--build:24.12s;--land0:3.68s}
@keyframes k-boom{0.00%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}6.01%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}6.39%{transform:matrix(0.9998,0.0074,-0.0394,0.9999,-10.10,-3.49)}6.76%{transform:matrix(0.9978,0.0278,-0.1489,0.9980,-37.49,-13.58)}7.14%{transform:matrix(0.9904,0.0589,-0.3151,0.9909,-77.01,-30.02)}7.51%{transform:matrix(0.9737,0.0978,-0.5234,0.9745,-122.99,-52.56)}7.89%{transform:matrix(0.9443,0.1415,-0.7575,0.9455,-169.73,-80.62)}8.26%{transform:matrix(0.9009,0.1869,-1.0005,0.9025,-212.17,-113.09)}8.64%{transform:matrix(0.8444,0.2309,-1.2360,0.8464,-246.52,-148.29)}9.02%{transform:matrix(0.7782,0.2708,-1.4498,0.7805,-270.70,-184.10)}9.39%{transform:matrix(0.7079,0.3047,-1.6314,0.7104,-284.59,-218.17)}9.77%{transform:matrix(0.6403,0.3315,-1.7745,0.6431,-289.86,-248.15)}10.14%{transform:matrix(0.5832,0.3506,-1.8771,0.5862,-289.53,-271.88)}10.52%{transform:matrix(0.5441,0.3622,-1.9390,0.5472,-287.16,-287.42)}10.89%{transform:matrix(0.5297,0.3661,-1.9603,0.5328,-285.89,-292.99)}17.34%{transform:matrix(0.5297,0.3661,-1.9603,0.5328,-285.89,-292.99)}17.72%{transform:matrix(0.5441,0.3622,-1.9390,0.5472,-287.16,-287.42)}18.09%{transform:matrix(0.5832,0.3506,-1.8771,0.5862,-289.53,-271.88)}18.47%{transform:matrix(0.6403,0.3315,-1.7745,0.6431,-289.86,-248.15)}18.84%{transform:matrix(0.7079,0.3047,-1.6314,0.7104,-284.59,-218.17)}19.22%{transform:matrix(0.7782,0.2708,-1.4498,0.7805,-270.70,-184.10)}19.59%{transform:matrix(0.8444,0.2309,-1.2360,0.8464,-246.52,-148.29)}19.97%{transform:matrix(0.9009,0.1869,-1.0005,0.9025,-212.17,-113.09)}20.34%{transform:matrix(0.9443,0.1415,-0.7575,0.9455,-169.73,-80.62)}20.72%{transform:matrix(0.9737,0.0978,-0.5234,0.9745,-122.99,-52.56)}21.10%{transform:matrix(0.9904,0.0589,-0.3151,0.9909,-77.01,-30.02)}21.47%{transform:matrix(0.9978,0.0278,-0.1489,0.9980,-37.49,-13.58)}21.85%{transform:matrix(0.9998,0.0074,-0.0394,0.9999,-10.10,-3.49)}22.22%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}26.58%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}26.98%{transform:matrix(0.9997,0.0092,-0.0491,0.9998,-12.57,-4.36)}27.38%{transform:matrix(0.9968,0.0340,-0.1821,0.9970,-45.58,-16.76)}27.78%{transform:matrix(0.9863,0.0704,-0.3770,0.9869,-91.08,-36.49)}28.18%{transform:matrix(0.9642,0.1139,-0.6098,0.9651,-140.87,-62.57)}28.59%{transform:matrix(0.9284,0.1598,-0.8557,0.9298,-187.67,-93.31)}28.99%{transform:matrix(0.8810,0.2038,-1.0909,0.8828,-226.21,-126.13)}29.39%{transform:matrix(0.8277,0.2419,-1.2950,0.8297,-253.92,-157.77)}29.79%{transform:matrix(0.7772,0.2714,-1.4528,0.7795,-270.98,-184.64)}30.19%{transform:matrix(0.7396,0.2903,-1.5540,0.7421,-279.53,-203.19)}30.60%{transform:matrix(0.7252,0.2970,-1.5901,0.7277,-282.06,-210.07)}38.21%{transform:matrix(0.7252,0.2970,-1.5901,0.7277,-282.06,-210.07)}38.61%{transform:matrix(0.7396,0.2903,-1.5540,0.7421,-279.53,-203.19)}39.01%{transform:matrix(0.7772,0.2714,-1.4528,0.7795,-270.98,-184.64)}39.42%{transform:matrix(0.8277,0.2419,-1.2950,0.8297,-253.92,-157.77)}39.82%{transform:matrix(0.8810,0.2038,-1.0909,0.8828,-226.21,-126.13)}40.22%{transform:matrix(0.9284,0.1598,-0.8557,0.9298,-187.67,-93.31)}40.62%{transform:matrix(0.9642,0.1139,-0.6098,0.9651,-140.87,-62.57)}41.02%{transform:matrix(0.9863,0.0704,-0.3770,0.9869,-91.08,-36.49)}41.43%{transform:matrix(0.9968,0.0340,-0.1821,0.9970,-45.58,-16.76)}41.83%{transform:matrix(0.9997,0.0092,-0.0491,0.9998,-12.57,-4.36)}42.23%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}46.58%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}47.40%{transform:matrix(0.9996,0.0117,-0.0625,0.9997,-15.96,-5.57)}48.22%{transform:matrix(0.9984,0.0233,-0.1249,0.9986,-31.57,-11.32)}56.69%{transform:matrix(0.9984,0.0233,-0.1249,0.9986,-31.57,-11.32)}57.51%{transform:matrix(0.9996,0.0117,-0.0625,0.9997,-15.96,-5.57)}58.33%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}62.68%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}63.07%{transform:matrix(0.9998,-0.0087,0.0467,0.9998,12.15,4.04)}63.46%{transform:matrix(0.9973,-0.0324,0.1733,0.9971,46.07,14.46)}63.85%{transform:matrix(0.9882,-0.0670,0.3588,0.9876,98.35,28.31)}64.24%{transform:matrix(0.9685,-0.1085,0.5807,0.9675,165.04,42.61)}64.63%{transform:matrix(0.9364,-0.1524,0.8159,0.9351,240.93,54.88)}65.02%{transform:matrix(0.8937,-0.1946,1.0418,0.8921,319.42,63.58)}65.41%{transform:matrix(0.8455,-0.2314,1.2390,0.8436,393.09,68.35)}65.80%{transform:matrix(0.7997,-0.2601,1.3925,0.7975,454.34,69.93)}66.19%{transform:matrix(0.7657,-0.2786,1.4916,0.7633,495.98,69.78)}66.58%{transform:matrix(0.7525,-0.2852,1.5270,0.7501,511.31,69.47)}74.30%{transform:matrix(0.7525,-0.2852,1.5270,0.7501,511.31,69.47)}74.69%{transform:matrix(0.7657,-0.2786,1.4916,0.7633,495.98,69.78)}75.07%{transform:matrix(0.7997,-0.2601,1.3925,0.7975,454.34,69.93)}75.46%{transform:matrix(0.8455,-0.2314,1.2390,0.8436,393.09,68.35)}75.85%{transform:matrix(0.8937,-0.1946,1.0418,0.8921,319.42,63.58)}76.24%{transform:matrix(0.9364,-0.1524,0.8159,0.9351,240.93,54.88)}76.63%{transform:matrix(0.9685,-0.1085,0.5807,0.9675,165.04,42.61)}77.02%{transform:matrix(0.9882,-0.0670,0.3588,0.9876,98.35,28.31)}77.41%{transform:matrix(0.9973,-0.0324,0.1733,0.9971,46.07,14.46)}77.80%{transform:matrix(0.9998,-0.0087,0.0467,0.9998,12.15,4.04)}78.19%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}82.55%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}82.92%{transform:matrix(0.9999,-0.0073,0.0392,0.9998,10.20,3.40)}83.29%{transform:matrix(0.9981,-0.0277,0.1484,0.9978,39.28,12.47)}83.67%{transform:matrix(0.9910,-0.0586,0.3140,0.9905,85.44,25.12)}84.04%{transform:matrix(0.9747,-0.0974,0.5214,0.9739,146.77,39.03)}84.42%{transform:matrix(0.9459,-0.1410,0.7547,0.9447,220.64,51.98)}84.79%{transform:matrix(0.9032,-0.1862,0.9969,0.9016,303.37,62.11)}85.17%{transform:matrix(0.8475,-0.2301,1.2318,0.8455,390.31,68.23)}85.54%{transform:matrix(0.7821,-0.2699,1.4452,0.7798,476.24,69.97)}85.92%{transform:matrix(0.7125,-0.3038,1.6265,0.7100,555.86,67.83)}86.29%{transform:matrix(0.6457,-0.3305,1.7696,0.6429,624.31,63.05)}86.66%{transform:matrix(0.5891,-0.3497,1.8722,0.5861,677.44,57.38)}87.04%{transform:matrix(0.5503,-0.3613,1.9343,0.5473,711.73,52.78)}87.41%{transform:matrix(0.5361,-0.3653,1.9555,0.5330,723.92,50.95)}93.89%{transform:matrix(0.5361,-0.3653,1.9555,0.5330,723.92,50.95)}94.26%{transform:matrix(0.5503,-0.3613,1.9343,0.5473,711.73,52.78)}94.64%{transform:matrix(0.5891,-0.3497,1.8722,0.5861,677.44,57.38)}95.01%{transform:matrix(0.6457,-0.3305,1.7696,0.6429,624.31,63.05)}95.39%{transform:matrix(0.7125,-0.3038,1.6265,0.7100,555.86,67.83)}95.76%{transform:matrix(0.7821,-0.2699,1.4452,0.7798,476.24,69.97)}96.14%{transform:matrix(0.8475,-0.2301,1.2318,0.8455,390.31,68.23)}96.51%{transform:matrix(0.9032,-0.1862,0.9969,0.9016,303.37,62.11)}96.88%{transform:matrix(0.9459,-0.1410,0.7547,0.9447,220.64,51.98)}97.26%{transform:matrix(0.9747,-0.0974,0.5214,0.9739,146.77,39.03)}97.63%{transform:matrix(0.9910,-0.0586,0.3140,0.9905,85.44,25.12)}98.01%{transform:matrix(0.9981,-0.0277,0.1484,0.9978,39.28,12.47)}98.38%{transform:matrix(0.9999,-0.0073,0.0392,0.9998,10.20,3.40)}98.76%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}100.00%{transform:matrix(1.0000,-0.0000,0.0000,1.0000,0.00,0.00)}}
@keyframes k-trolley{0.00%{transform:translate(0px,0px)}6.01%{transform:translate(0px,0px)}6.39%{transform:translate(-3.9px,-1.5px)}6.76%{transform:translate(-14.4px,-5.8px)}7.14%{transform:translate(-29.5px,-12.8px)}7.51%{transform:translate(-46.9px,-22.3px)}7.89%{transform:translate(-64.3px,-34.1px)}8.26%{transform:translate(-79.8px,-47.6px)}8.64%{transform:translate(-91.9px,-62.1px)}9.02%{transform:translate(-99.8px,-76.8px)}9.39%{transform:translate(-103.7px,-90.6px)}9.77%{transform:translate(-104.3px,-102.8px)}10.14%{transform:translate(-103.0px,-112.3px)}10.52%{transform:translate(-101.2px,-118.6px)}10.89%{transform:translate(-100.5px,-120.8px)}11.84%{transform:translate(-80.8px,-119.4px)}12.78%{transform:translate(-61.2px,-118.1px)}17.34%{transform:translate(-61.2px,-118.1px)}17.72%{transform:translate(-62.6px,-116.2px)}18.09%{transform:translate(-65.9px,-110.8px)}18.47%{transform:translate(-70.0px,-102.4px)}18.84%{transform:translate(-73.0px,-91.6px)}19.22%{transform:translate(-73.6px,-78.8px)}19.59%{transform:translate(-70.6px,-64.8px)}19.97%{transform:translate(-63.6px,-50.6px)}20.34%{transform:translate(-52.9px,-36.9px)}20.72%{transform:translate(-39.6px,-24.6px)}21.10%{transform:translate(-25.5px,-14.4px)}21.47%{transform:translate(-12.6px,-6.6px)}21.85%{transform:translate(-3.4px,-1.7px)}22.22%{transform:translate(0px,0px)}26.58%{transform:translate(0px,0px)}26.98%{transform:translate(-4.8px,-1.9px)}27.38%{transform:translate(-17.5px,-7.2px)}27.78%{transform:translate(-34.9px,-15.6px)}28.18%{transform:translate(-53.6px,-26.6px)}28.59%{transform:translate(-70.9px,-39.4px)}28.99%{transform:translate(-84.8px,-53.0px)}29.39%{transform:translate(-94.4px,-66.0px)}29.79%{transform:translate(-99.9px,-77.0px)}30.19%{transform:translate(-102.4px,-84.5px)}30.60%{transform:translate(-103.1px,-87.3px)}32.12%{transform:translate(-47.6px,-89.6px)}33.65%{transform:translate(8.0px,-91.9px)}38.21%{transform:translate(8.0px,-91.9px)}38.61%{transform:translate(5.3px,-89.9px)}39.01%{transform:translate(-1.4px,-84.4px)}39.42%{transform:translate(-9.8px,-75.6px)}39.82%{transform:translate(-17.1px,-64.0px)}40.22%{transform:translate(-21.2px,-50.4px)}40.62%{transform:translate(-20.9px,-35.9px)}41.02%{transform:translate(-16.2px,-22.2px)}41.43%{transform:translate(-9.2px,-10.7px)}41.83%{transform:translate(-2.7px,-2.9px)}42.23%{transform:translate(0px,0px)}46.58%{transform:translate(0px,0px)}47.40%{transform:translate(-6.2px,-2.4px)}48.22%{transform:translate(-12.2px,-4.9px)}50.18%{transform:translate(45.5px,-30.4px)}52.13%{transform:translate(103.1px,-55.8px)}56.69%{transform:translate(103.1px,-55.8px)}57.51%{transform:translate(49.9px,-28.6px)}58.33%{transform:translate(0px,0px)}62.68%{transform:translate(0px,0px)}63.07%{transform:translate(4.7px,1.7px)}63.46%{transform:translate(17.8px,6.3px)}63.85%{transform:translate(38.2px,12.3px)}64.24%{transform:translate(64.4px,18.7px)}64.63%{transform:translate(94.3px,24.4px)}65.02%{transform:translate(125.5px,28.6px)}65.41%{transform:translate(155.0px,31.3px)}65.80%{transform:translate(179.6px,32.5px)}66.19%{transform:translate(196.4px,32.8px)}66.58%{transform:translate(202.6px,32.8px)}68.16%{transform:translate(202.6px,7.3px)}69.74%{transform:translate(202.6px,-18.2px)}74.30%{transform:translate(202.6px,-18.2px)}74.69%{transform:translate(198.7px,-16.8px)}75.07%{transform:translate(187.5px,-13.1px)}75.46%{transform:translate(169.3px,-8.3px)}75.85%{transform:translate(144.7px,-3.4px)}76.24%{transform:translate(115.1px,0.5px)}76.63%{transform:translate(83.1px,2.7px)}77.02%{transform:translate(51.9px,3.0px)}77.41%{transform:translate(25.2px,2.0px)}77.80%{transform:translate(6.8px,0.6px)}78.19%{transform:translate(0px,0px)}82.55%{transform:translate(0px,0px)}82.92%{transform:translate(3.9px,1.5px)}83.29%{transform:translate(15.2px,5.4px)}83.67%{transform:translate(33.2px,10.9px)}84.04%{transform:translate(57.2px,17.1px)}84.42%{transform:translate(86.3px,23.0px)}84.79%{transform:translate(119.1px,27.9px)}85.17%{transform:translate(153.9px,31.2px)}85.54%{transform:translate(188.4px,32.7px)}85.92%{transform:translate(220.6px,32.6px)}86.29%{transform:translate(248.4px,31.3px)}86.66%{transform:translate(270.1px,29.5px)}87.04%{transform:translate(284.2px,28.0px)}87.41%{transform:translate(289.2px,27.4px)}88.37%{transform:translate(283.4px,18.8px)}89.33%{transform:translate(277.5px,10.2px)}93.89%{transform:translate(277.5px,10.2px)}94.26%{transform:translate(273.4px,11.0px)}94.64%{transform:translate(261.6px,13.2px)}95.01%{transform:translate(243.1px,16.0px)}95.39%{transform:translate(218.7px,18.8px)}95.76%{transform:translate(189.7px,20.7px)}96.14%{transform:translate(157.5px,21.3px)}96.51%{transform:translate(124.1px,20.3px)}96.88%{transform:translate(91.5px,17.6px)}97.26%{transform:translate(61.6px,13.6px)}97.63%{transform:translate(36.3px,8.9px)}98.01%{transform:translate(16.8px,4.5px)}98.38%{transform:translate(4.4px,1.2px)}98.76%{transform:translate(0px,0px)}100.00%{transform:translate(0px,0px)}}
@keyframes k-cable{0.00%{transform:scaleY(1.000)}1.66%{transform:scaleY(1.000)}2.59%{transform:scaleY(1.477)}3.52%{transform:scaleY(1.955)}4.15%{transform:scaleY(1.955)}5.08%{transform:scaleY(1.386)}6.01%{transform:scaleY(0.818)}12.78%{transform:scaleY(0.818)}14.02%{transform:scaleY(1.386)}15.27%{transform:scaleY(1.955)}15.89%{transform:scaleY(1.955)}16.62%{transform:scaleY(1.477)}17.34%{transform:scaleY(1.000)}22.22%{transform:scaleY(1.000)}23.15%{transform:scaleY(1.557)}24.09%{transform:scaleY(2.114)}24.71%{transform:scaleY(2.114)}25.64%{transform:scaleY(1.545)}26.58%{transform:scaleY(0.977)}33.65%{transform:scaleY(0.977)}34.89%{transform:scaleY(1.545)}36.14%{transform:scaleY(2.114)}36.76%{transform:scaleY(2.114)}37.48%{transform:scaleY(1.557)}38.21%{transform:scaleY(1.000)}42.23%{transform:scaleY(1.000)}43.16%{transform:scaleY(1.409)}44.10%{transform:scaleY(1.818)}44.72%{transform:scaleY(1.818)}45.65%{transform:scaleY(1.250)}46.58%{transform:scaleY(0.682)}52.13%{transform:scaleY(0.682)}53.38%{transform:scaleY(1.250)}54.62%{transform:scaleY(1.818)}55.24%{transform:scaleY(1.818)}55.97%{transform:scaleY(1.409)}56.69%{transform:scaleY(1.000)}58.33%{transform:scaleY(1.000)}59.26%{transform:scaleY(1.511)}60.19%{transform:scaleY(2.023)}60.82%{transform:scaleY(2.023)}61.75%{transform:scaleY(1.455)}62.68%{transform:scaleY(0.886)}69.74%{transform:scaleY(0.886)}70.98%{transform:scaleY(1.455)}72.22%{transform:scaleY(2.023)}72.84%{transform:scaleY(2.023)}73.57%{transform:scaleY(1.511)}74.30%{transform:scaleY(1.000)}78.19%{transform:scaleY(1.000)}79.13%{transform:scaleY(1.602)}80.06%{transform:scaleY(2.205)}80.68%{transform:scaleY(2.205)}81.61%{transform:scaleY(1.636)}82.55%{transform:scaleY(1.068)}89.33%{transform:scaleY(1.068)}90.57%{transform:scaleY(1.636)}91.82%{transform:scaleY(2.205)}92.44%{transform:scaleY(2.205)}93.16%{transform:scaleY(1.602)}93.89%{transform:scaleY(1.000)}100.00%{transform:scaleY(1.000)}}
@keyframes k-hook{0.00%{transform:translate(0,0px)}1.66%{transform:translate(0,0px)}2.59%{transform:translate(0,31.5px)}3.52%{transform:translate(0,63.0px)}4.15%{transform:translate(0,63.0px)}5.08%{transform:translate(0,25.5px)}6.01%{transform:translate(0,-12.0px)}12.78%{transform:translate(0,-12.0px)}14.02%{transform:translate(0,25.5px)}15.27%{transform:translate(0,63.0px)}15.89%{transform:translate(0,63.0px)}16.62%{transform:translate(0,31.5px)}17.34%{transform:translate(0,0px)}22.22%{transform:translate(0,0px)}23.15%{transform:translate(0,36.8px)}24.09%{transform:translate(0,73.5px)}24.71%{transform:translate(0,73.5px)}25.64%{transform:translate(0,36.0px)}26.58%{transform:translate(0,-1.5px)}33.65%{transform:translate(0,-1.5px)}34.89%{transform:translate(0,36.0px)}36.14%{transform:translate(0,73.5px)}36.76%{transform:translate(0,73.5px)}37.48%{transform:translate(0,36.8px)}38.21%{transform:translate(0,0px)}42.23%{transform:translate(0,0px)}43.16%{transform:translate(0,27.0px)}44.10%{transform:translate(0,54.0px)}44.72%{transform:translate(0,54.0px)}45.65%{transform:translate(0,16.5px)}46.58%{transform:translate(0,-21.0px)}52.13%{transform:translate(0,-21.0px)}53.38%{transform:translate(0,16.5px)}54.62%{transform:translate(0,54.0px)}55.24%{transform:translate(0,54.0px)}55.97%{transform:translate(0,27.0px)}56.69%{transform:translate(0,0px)}58.33%{transform:translate(0,0px)}59.26%{transform:translate(0,33.8px)}60.19%{transform:translate(0,67.5px)}60.82%{transform:translate(0,67.5px)}61.75%{transform:translate(0,30.0px)}62.68%{transform:translate(0,-7.5px)}69.74%{transform:translate(0,-7.5px)}70.98%{transform:translate(0,30.0px)}72.22%{transform:translate(0,67.5px)}72.84%{transform:translate(0,67.5px)}73.57%{transform:translate(0,33.8px)}74.30%{transform:translate(0,0px)}78.19%{transform:translate(0,0px)}79.13%{transform:translate(0,39.8px)}80.06%{transform:translate(0,79.5px)}80.68%{transform:translate(0,79.5px)}81.61%{transform:translate(0,42.0px)}82.55%{transform:translate(0,4.5px)}89.33%{transform:translate(0,4.5px)}90.57%{transform:translate(0,42.0px)}91.82%{transform:translate(0,79.5px)}92.44%{transform:translate(0,79.5px)}93.16%{transform:translate(0,39.8px)}93.89%{transform:translate(0,0px)}100.00%{transform:translate(0,0px)}}
@keyframes k-b0{0.00%{transform:translate(61.2px,118.1px);opacity:0}3.52%{transform:translate(61.2px,118.1px);opacity:0}4.15%{transform:translate(61.2px,118.1px);opacity:1}5.08%{transform:translate(61.2px,80.6px);opacity:1}6.01%{transform:translate(61.2px,43.1px);opacity:1}6.39%{transform:translate(57.3px,41.6px);opacity:1}6.76%{transform:translate(46.8px,37.3px);opacity:1}7.14%{transform:translate(31.7px,30.3px);opacity:1}7.51%{transform:translate(14.3px,20.7px);opacity:1}7.89%{transform:translate(-3.1px,9.0px);opacity:1}8.26%{transform:translate(-18.6px,-4.5px);opacity:1}8.64%{transform:translate(-30.7px,-19.0px);opacity:1}9.02%{transform:translate(-38.6px,-33.7px);opacity:1}9.39%{transform:translate(-42.5px,-47.5px);opacity:1}9.77%{transform:translate(-43.1px,-59.7px);opacity:1}10.14%{transform:translate(-41.8px,-69.2px);opacity:1}10.52%{transform:translate(-40.0px,-75.5px);opacity:1}10.89%{transform:translate(-39.2px,-77.7px);opacity:1}11.84%{transform:translate(-19.6px,-76.4px);opacity:1}12.78%{transform:translate(0px,-75.0px);opacity:1}14.02%{transform:translate(0px,-37.5px);opacity:1}15.27%{transform:translate(0px,0px);opacity:1}15.89%{transform:translate(0,0);opacity:1}100.00%{transform:translate(0,0);opacity:1}}
@keyframes k-b1{0.00%{transform:translate(-8.0px,91.9px);opacity:0}24.09%{transform:translate(-8.0px,91.9px);opacity:0}24.71%{transform:translate(-8.0px,91.9px);opacity:1}25.64%{transform:translate(-8.0px,54.4px);opacity:1}26.58%{transform:translate(-8.0px,16.9px);opacity:1}26.98%{transform:translate(-12.8px,15.0px);opacity:1}27.38%{transform:translate(-25.5px,9.7px);opacity:1}27.78%{transform:translate(-42.8px,1.3px);opacity:1}28.18%{transform:translate(-61.6px,-9.7px);opacity:1}28.59%{transform:translate(-78.9px,-22.5px);opacity:1}28.99%{transform:translate(-92.8px,-36.1px);opacity:1}29.39%{transform:translate(-102.4px,-49.1px);opacity:1}29.79%{transform:translate(-107.9px,-60.1px);opacity:1}30.19%{transform:translate(-110.4px,-67.7px);opacity:1}30.60%{transform:translate(-111.1px,-70.5px);opacity:1}32.12%{transform:translate(-55.5px,-72.7px);opacity:1}33.65%{transform:translate(0px,-75.0px);opacity:1}34.89%{transform:translate(0px,-37.5px);opacity:1}36.14%{transform:translate(0px,0px);opacity:1}36.76%{transform:translate(0,0);opacity:1}100.00%{transform:translate(0,0);opacity:1}}
@keyframes k-b2{0.00%{transform:translate(-103.1px,55.8px);opacity:0}44.10%{transform:translate(-103.1px,55.8px);opacity:0}44.72%{transform:translate(-103.1px,55.8px);opacity:1}45.65%{transform:translate(-103.1px,18.3px);opacity:1}46.58%{transform:translate(-103.1px,-19.2px);opacity:1}47.40%{transform:translate(-109.3px,-21.5px);opacity:1}48.22%{transform:translate(-115.3px,-24.0px);opacity:1}50.18%{transform:translate(-57.6px,-49.5px);opacity:1}52.13%{transform:translate(0px,-75.0px);opacity:1}53.38%{transform:translate(0px,-37.5px);opacity:1}54.62%{transform:translate(0px,0px);opacity:1}55.24%{transform:translate(0,0);opacity:1}100.00%{transform:translate(0,0);opacity:1}}
@keyframes k-b3{0.00%{transform:translate(-202.6px,18.2px);opacity:0}60.19%{transform:translate(-202.6px,18.2px);opacity:0}60.82%{transform:translate(-202.6px,18.2px);opacity:1}61.75%{transform:translate(-202.6px,-19.3px);opacity:1}62.68%{transform:translate(-202.6px,-56.8px);opacity:1}63.07%{transform:translate(-197.9px,-55.1px);opacity:1}63.46%{transform:translate(-184.7px,-50.6px);opacity:1}63.85%{transform:translate(-164.4px,-44.5px);opacity:1}64.24%{transform:translate(-138.2px,-38.1px);opacity:1}64.63%{transform:translate(-108.2px,-32.4px);opacity:1}65.02%{transform:translate(-77.0px,-28.2px);opacity:1}65.41%{transform:translate(-47.6px,-25.6px);opacity:1}65.80%{transform:translate(-23.0px,-24.4px);opacity:1}66.19%{transform:translate(-6.2px,-24.0px);opacity:1}66.58%{transform:translate(0px,-24.0px);opacity:1}68.16%{transform:translate(0px,-49.5px);opacity:1}69.74%{transform:translate(0px,-75.0px);opacity:1}70.98%{transform:translate(0px,-37.5px);opacity:1}72.22%{transform:translate(0px,0px);opacity:1}72.84%{transform:translate(0,0);opacity:1}100.00%{transform:translate(0,0);opacity:1}}
@keyframes k-b4{0.00%{transform:translate(-277.5px,-10.2px);opacity:0}80.06%{transform:translate(-277.5px,-10.2px);opacity:0}80.68%{transform:translate(-277.5px,-10.2px);opacity:1}81.61%{transform:translate(-277.5px,-47.7px);opacity:1}82.55%{transform:translate(-277.5px,-85.2px);opacity:1}82.92%{transform:translate(-273.6px,-83.8px);opacity:1}83.29%{transform:translate(-262.3px,-79.8px);opacity:1}83.67%{transform:translate(-244.4px,-74.3px);opacity:1}84.04%{transform:translate(-220.3px,-68.1px);opacity:1}84.42%{transform:translate(-191.2px,-62.2px);opacity:1}84.79%{transform:translate(-158.4px,-57.3px);opacity:1}85.17%{transform:translate(-123.7px,-54.0px);opacity:1}85.54%{transform:translate(-89.1px,-52.5px);opacity:1}85.92%{transform:translate(-56.9px,-52.6px);opacity:1}86.29%{transform:translate(-29.1px,-53.9px);opacity:1}86.66%{transform:translate(-7.4px,-55.7px);opacity:1}87.04%{transform:translate(6.7px,-57.2px);opacity:1}87.41%{transform:translate(11.7px,-57.9px);opacity:1}88.37%{transform:translate(5.8px,-66.4px);opacity:1}89.33%{transform:translate(0px,-75.0px);opacity:1}90.57%{transform:translate(0px,-37.5px);opacity:1}91.82%{transform:translate(0px,0px);opacity:1}92.44%{transform:translate(0,0);opacity:1}100.00%{transform:translate(0,0);opacity:1}}
/* scene-anim:end */

/* ---------- product shot ---------- */
.hero-shot { grid-column: 1 / -1; margin-top: var(--s3); }
.shot-stage {
  position: relative; padding: clamp(14px, 3.4vw, 48px) clamp(14px, 3.4vw, 48px) clamp(12px, 2.4vw, 32px);
  border-radius: clamp(16px, 2vw, 26px);
  background:
    linear-gradient(var(--stage-grid) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(90deg, var(--stage-grid) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(160deg, var(--stage), var(--stage-2));
  box-shadow: 0 4px 0 0 color-mix(in oklab, var(--stage-2) 70%, #000);
}
.window { margin: 0; border-radius: clamp(8px, 1vw, 13px); overflow: hidden; background: #17181c; box-shadow: var(--win-shadow); outline: 1px solid rgba(255, 255, 255, .08); outline-offset: -1px; }
.window img { width: 100%; }
.callouts { list-style: none; margin: clamp(14px, 2vw, 26px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s4); color: #f3f5ff; font-size: 15px; line-height: 1.45; }
.callouts li { display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: start; }
.callouts b { font: 700 16px/1.3 "Bricolage", sans-serif; display: block; color: #fff; }
.callouts li { grid-template-areas: "n t"; }
.plate { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 7px; background: var(--gold-top); color: #3a2a06; font: 700 14px/1 "Bricolage", sans-serif; box-shadow: inset -2px -2px 0 var(--gold-side); grid-row: span 2; }

/* ---------- section heads ---------- */
.sec-head { max-width: 46em; margin-bottom: var(--s7); }
.kicker { font: 700 12.5px/1.2 "Bricolage", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--brand-ink); margin-bottom: var(--s3); }
.sec-head h2 { font-size: clamp(30px, 1.6vw + 20px, 46px); line-height: 1.06; text-wrap: balance; }
.sec-lede { margin-top: var(--s4); font-size: 18px; color: var(--ink-2); max-width: 36em; }

/* ---------- features ---------- */
.features { padding: var(--s9) 0; }
.cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s5); }
.card {
  position: relative; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 22px 24px 26px;
  box-shadow: 4px 4px 0 0 var(--card-side), var(--shadow);
}
.card h3 { font-size: 21px; line-height: 1.2; margin: 14px 0 8px; }
.card p { font-size: 15.5px; line-height: 1.55; color: var(--ink-2); }
.card-cube { width: 40px; height: 40px; display: block; }

/* ---------- tour ---------- */
.tour { padding: 0 0 var(--s8); }
.row { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 8fr); gap: clamp(24px, 4vw, 64px); align-items: center; padding: var(--s7) 0; }
.row + .row { border-top: 1px solid var(--line); }
.row-flip { grid-template-columns: minmax(0, 8fr) minmax(0, 5fr); }
.row-flip .row-copy { order: 2; }
.row-copy h3 { font-size: clamp(26px, 1vw + 18px, 34px); line-height: 1.1; margin-bottom: var(--s3); text-wrap: balance; }
.row-copy p:not(.kicker) { color: var(--ink-2); font-size: 16.5px; }
.row .window { box-shadow: 0 0 0 6px color-mix(in oklab, var(--brand) 22%, transparent), var(--win-shadow); }
.window-code { background: #0b0b0c; padding-top: 12px; }

.views { border: 0; margin: 0; padding: 0; min-width: 0; }
.seg { display: inline-flex; padding: 4px; border-radius: 12px; background: var(--bg-2); border: 1px solid var(--line); margin-bottom: var(--s3); }
.seg label { font: 600 14.5px/1 "Inter", sans-serif; padding: 9px 16px; border-radius: 9px; cursor: pointer; color: var(--muted); }
.seg label:hover { color: var(--ink); }
#v-chat:checked ~ .seg label[for="v-chat"], #v-term:checked ~ .seg label[for="v-term"] { background: var(--surface); color: var(--ink); box-shadow: 0 1px 2px rgba(0, 0, 0, .12), 0 0 0 1px var(--line); }
#v-chat:focus-visible ~ .seg label[for="v-chat"], #v-term:focus-visible ~ .seg label[for="v-term"] { outline: 2px solid var(--focus); outline-offset: 2px; }
.panes { display: grid; }
.panes img { grid-area: 1 / 1; transition: opacity .12s ease; }
.pane-term { opacity: 0; visibility: hidden; }
#v-term:checked ~ .panes .pane-term { opacity: 1; visibility: visible; }
#v-term:checked ~ .panes .pane-chat { opacity: 0; visibility: hidden; }

/* session browser illustration */
.mock { background: #1b1c21; color: #e6e7ec; font-size: 13.5px; }
.mock i { font-style: normal; display: block; }
.mock-bar { display: flex; align-items: center; gap: 7px; padding: 11px 14px; border-bottom: 1px solid #2c2e35; }
.mock-bar span { width: 11px; height: 11px; border-radius: 50%; background: #3a3c44; }
.mock-bar b { margin-left: 10px; font-weight: 600; font-size: 13px; }
.mock-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2.4fr); min-height: 270px; }
.mock-side { border-right: 1px solid #2c2e35; padding: 12px; display: grid; align-content: start; gap: 4px; }
.mock-main { padding: 14px 16px; display: grid; align-content: start; gap: 8px; }
.m-label { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #9a9ca6; margin-top: 4px; }
.m-folder { padding: 6px 8px; border-radius: 6px; color: #c9cad1; }
.m-folder::before { content: ""; display: inline-block; width: 11px; height: 8px; border: 1.4px solid #8c8e98; border-radius: 2px; margin-right: 7px; }
.m-on { background: #2c3550; color: #fff; }
.m-title { font: 600 18px/1.2 "Inter", sans-serif; }
.m-btns { display: flex; flex-wrap: wrap; gap: 6px; }
.m-btn { padding: 6px 10px; border-radius: 6px; border: 1px solid #3a3c44; }
.m-btn-on { background: #f3f3f5; color: #17181c; border-color: #f3f3f5; }
.m-row { display: flex; align-items: center; gap: 10px; padding: 9px 4px; border-top: 1px solid #2a2c33; }
.m-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.m-work { background: #34c38a; } .m-idle { border: 1.5px solid #8c8e98; }
.m-txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-act { color: #9fb4ff; }
.mock-cap { padding: 10px 14px; font: 600 12.5px/1.4 "Bricolage", sans-serif; letter-spacing: .02em; color: #3a2a06; background: var(--gold-top); }

/* ---------- speed ---------- */
.speed { padding: var(--s8) 0; background: var(--bg-2); border-block: 1px solid var(--line); }
.stats { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s5); }
.stat { background: var(--surface); border: 1px solid var(--line); border-top: 4px solid var(--gold); border-radius: 16px; padding: 22px 24px; box-shadow: 4px 4px 0 0 var(--card-side), var(--shadow); display: grid; gap: 6px; }
.stat-n { font: 800 clamp(40px, 2vw + 24px, 56px)/1 "Bricolage", sans-serif; letter-spacing: -.035em; }
.stat-n small { font-size: .45em; font-weight: 700; letter-spacing: 0; margin-left: 4px; color: var(--muted); }
.stat-l { color: var(--ink-2); font-size: 15.5px; }
.fine { margin-top: var(--s4); font-size: 14px; color: var(--muted); }

/* ---------- status ---------- */
.status { padding: var(--s9) 0 var(--s8); }
.status .sec-head { margin-bottom: var(--s6); }
.lists { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5); }
.list { border-top: 3px solid var(--line-2); padding-top: var(--s4); }
.list h3 { font-size: 20px; display: flex; align-items: center; gap: 10px; margin-bottom: var(--s3); }
.list ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; color: var(--ink-2); }
.list li { padding-left: 22px; position: relative; }
.list li::before { content: ""; position: absolute; left: 2px; top: .55em; width: 9px; height: 9px; background: var(--brand); transform: rotate(45deg) skew(8deg, 8deg); border-radius: 1px; }
.dot { width: 10px; height: 10px; border-radius: 50%; }
.dot-work { background: var(--work); } .dot-wait { background: var(--wait); }

/* ---------- open source band ---------- */
.source { padding: 0 0 var(--s9); }
.band {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s5);
  padding: clamp(24px, 3.4vw, 44px); border-radius: 22px; color: #fff;
  background: linear-gradient(160deg, #3f5ccb, #2e47a6);
  box-shadow: 0 5px 0 0 #1f3277, 0 26px 50px -26px rgba(30, 50, 140, .8);
}
.band-copy { max-width: 40em; }
.band-k { font: 700 12px/1.2 "Bricolage", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #ffe3a6; margin-bottom: 10px; }
.band h2 { font-size: clamp(26px, 1.2vw + 18px, 36px); line-height: 1.1; margin-bottom: 10px; text-wrap: balance; }
.band p:not(.band-k) { color: #e4e9ff; }
.band-copy p + p { margin-top: 12px; }
.band-links { display: flex; flex-wrap: wrap; gap: var(--s3); }
.btn-light { background: #fff; color: #1f2f6e; box-shadow: 0 3px 0 0 #c7d2f7; }
.btn-light:hover { transform: translateY(-1px); }
.btn-line { color: #fff; border: 1.5px solid rgba(255, 255, 255, .55); }
.btn-line:hover { background: rgba(255, 255, 255, .1); }
.band :focus-visible { outline-color: #ffd06b; }

/* ---------- footer ---------- */
.foot { border-top: 1px solid var(--line); padding: var(--s6) 0 var(--s7); font-size: 14.5px; color: var(--muted); }
.foot-in { display: grid; grid-template-columns: auto 1fr auto; gap: var(--s5); align-items: center; }
.brand-sm { font-size: 17px; color: var(--ink); }
.foot-meta a { color: var(--ink-2); }

/* ---------- responsive ---------- */
@media (max-width: 1080px) {
  .hero-in { grid-template-columns: minmax(0, 1fr); row-gap: var(--s5); }
  .hero-copy { max-width: 40em; }
  .hero-shot { order: 2; margin-top: 0; }
  .art { order: 3; }
  .art { max-width: 760px; width: 100%; justify-self: center; }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .foot-in { grid-template-columns: 1fr; gap: var(--s3); }
}
@media (max-width: 860px) {
  .row, .row-flip { grid-template-columns: minmax(0, 1fr); }
  .row-flip .row-copy { order: 0; }
  .callouts { grid-template-columns: minmax(0, 1fr); gap: var(--s3); }
  .stats { grid-template-columns: minmax(0, 1fr); }
  .top nav { display: none; }
}
@media (max-width: 620px) {
  body { font-size: 16px; }
  .cards, .lists { grid-template-columns: minmax(0, 1fr); }
  .btn { width: 100%; }
  .actions { flex-direction: column; align-items: stretch; }
  .band-links { width: 100%; }
  .mock-body { grid-template-columns: minmax(0, 1fr); }
  .mock-side { display: none; }
  .features { padding-top: var(--s7); }
  .note { display: none; }
}
