/* Krot public site: the design system's stylesheets in one (demo, page, fonts). Generated from the preview by
   .krot/tools/port_to_repo.py in the design project; edit the preview, then re-run it. */
/* The hero demo (next/demo.js): an iPhone, and on wide boxes a laptop browser beside it, playing one Krot chat in
   step. Laid out at a fixed design size (phone 410×864, stage 1560 wide) and scaled to fit by the script. */
.dm { --dm-max-h: 640px; position: relative; width: 100%; overflow: hidden; font-family: "Geist Variable", Geist, system-ui, sans-serif; }
.dm-stage { position: absolute; left: 0; top: 0; height: 864px; transform-origin: 0 0; transition: opacity .6s ease; }
.dm-caption { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; text-align: center; font-size: 12px; letter-spacing: .02em; color: var(--dm-caption, #8a877f); }
.dm *, .dm *::before, .dm *::after { box-sizing: border-box; }
.dm svg { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Narrow: the phone alone, centred. Wide: the laptop at left, the phone beside it. */
.dm:not(.dm-wide) .dm-laptop { display: none; }
.dm:not(.dm-wide) .dm-phone { left: 0; }
.dm-phone { position: absolute; top: 0; left: 1150px; width: 410px; height: 864px; border-radius: 68px; padding: 10px;
  background: linear-gradient(145deg, #3a3a3e, #121214 40%, #2a2a2e); box-shadow: 0 0 0 2px #4a4a50 inset, 0 40px 80px -20px rgba(0,0,0,.55), 0 20px 40px -20px rgba(0,0,0,.4); }
.dm-screen { position: relative; width: 390px; height: 844px; border-radius: 58px; overflow: hidden; background: #FAF9F7; isolation: isolate; }
.dm-status { position: absolute; z-index: 10; inset: 0 0 auto; height: 54px; display: flex; align-items: center; justify-content: space-between; padding: 6px 34px 0 46px; font: 600 16px/1 Geist, system-ui, sans-serif; color: #111; pointer-events: none; transition: color .3s; }
.dm-island { position: absolute; left: 50%; top: 11px; width: 122px; height: 35px; margin-left: -61px; border-radius: 20px; background: #000; }
.dm-bars { display: flex; align-items: flex-end; gap: 2px; }
.dm-bars b { width: 3.5px; background: currentColor; border-radius: 1px; }
.dm-bars b:nth-child(1) { height: 5px; } .dm-bars b:nth-child(2) { height: 7px; } .dm-bars b:nth-child(3) { height: 9px; } .dm-bars b:nth-child(4) { height: 11px; }
.dm-batt { width: 25px; height: 12px; margin-left: 7px; border-radius: 4px; border: 1.5px solid currentColor; box-shadow: inset 0 0 0 1.5px #FAF9F7; background: currentColor; opacity: .9; }
.dm-home-bar { position: absolute; z-index: 10; left: 50%; bottom: 8px; width: 136px; height: 5px; margin-left: -68px; border-radius: 3px; background: #111; opacity: .85; }
.dm-screen:has(.dm-layer-home.on):not(:has(.dm-from-icon.on)) .dm-status { color: #fff; }
.dm-screen:has(.dm-layer-home.on):not(:has(.dm-from-icon.on)) .dm-home-bar { background: #fff; }

.dm-layer { position: absolute; inset: 0; }
.dm-layer-chat { padding-top: 50px; z-index: 1; }
.dm-layer-home { z-index: 2; opacity: 0; transition: opacity .45s ease; }
.dm-layer-home.on { opacity: 1; }
.dm-layer-app { z-index: 3; padding-top: 50px; background: #F4EFE6; transform-origin: 151px 316px; }
.dm-from-icon { z-index: 4; transform: scale(.17); opacity: 0; border-radius: 120px; transition: transform .5s cubic-bezier(.2,.8,.2,1), opacity .25s ease, border-radius .5s; }
.dm-from-icon.on { transform: none; opacity: 1; border-radius: 0; }
/* The rewind: the reopened app dissolves in place rather than shrinking back into its icon. */
.dm-rewind .dm-from-icon { transform: none; border-radius: 0; transition: opacity .7s ease; }

/* Wide boxes: in step side by side until the app is ready, then the laptop leaves and the phone moves to the centre. */
.dm-laptop { transition: opacity .5s ease, transform .7s cubic-bezier(.5,0,.2,1); }
.dm-phone { transition: left .9s cubic-bezier(.65,0,.35,1); }
.dm-wide.dm-solo .dm-laptop { opacity: 0; transform: translateX(-90px) scale(.96); }
.dm-wide.dm-solo .dm-phone { left: 575px; }
/* Coming back (the rewind), the laptop waits for the phone to clear its way. */
.dm-wide:not(.dm-solo) .dm-laptop { transition-delay: .4s; }

/* Laptop browser window */
.dm-laptop { position: absolute; left: 0; top: 52px; width: 1100px; height: 760px; }
.dm-browser { height: 100%; border-radius: 14px; overflow: hidden; background: #FAF9F7; box-shadow: 0 0 0 1px rgba(0,0,0,.12), 0 40px 80px -24px rgba(0,0,0,.5); display: flex; flex-direction: column; }
.dm-browser-bar { flex: none; height: 44px; display: flex; align-items: center; gap: 8px; padding: 0 16px; background: #EDEBE7; border-bottom: 1px solid #DEDBD5; }
.dm-browser-bar i { width: 12px; height: 12px; border-radius: 50%; background: #D9D6D0; }
.dm-browser-bar i:nth-child(1) { background: #FF5F57; } .dm-browser-bar i:nth-child(2) { background: #FEBC2E; } .dm-browser-bar i:nth-child(3) { background: #28C840; }
.dm-url { margin: 0 auto; transform: translateX(-30px); width: 360px; height: 28px; border-radius: 8px; background: #fff; color: #6B6963; font-size: 13px; display: grid; place-items: center; }
.dm-browser-body { position: relative; flex: 1; min-height: 0; }

/* Krot chat */
.dm-chat { height: 100%; display: flex; flex-direction: column; color: #1d1c1a; background: #FAF9F7; font-size: 16px; line-height: 1.45; }
.dm-chat-head { flex: none; display: flex; align-items: center; justify-content: space-between; height: 58px; padding: 0 16px; border-bottom: 1px solid #ECEAE6; }
.dm-ic { display: inline-grid; place-items: center; width: 24px; height: 24px; font-size: 20px; color: #3b3a37; }
.dm-ic-s { width: 16px; height: 16px; font-size: 14px; vertical-align: -2px; color: #6B6963; }
.dm-chat-title { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 3px; }
.dm-chat-title strong { font-size: 16px; font-weight: 600; }
.dm-agent-row { display: inline-flex; align-items: center; gap: 6px; height: 18px; }
.dm-agent-row img { width: 16px; height: 16px; }
.dm-live { display: none; font-size: 12px; color: #3555E5; }
.dm-live.on { display: inline; }
.dm-thread { flex: 1; min-height: 0; overflow: hidden; }
.dm-thread-inner { min-height: 100%; display: flex; flex-direction: column; justify-content: flex-end; gap: 14px; padding: 18px 16px 10px; }
.dm-laptop .dm-thread-inner, .dm-laptop .dm-composer { width: 720px; margin: 0 auto; }
.dm-thread [data-at]:not(.on), .dm-thread [data-to]:not(.on) { display: none; }
.dm-thread .on { animation: dm-in .4s cubic-bezier(.2,.8,.2,1) both; }
@keyframes dm-in { from { opacity: 0; transform: translateY(10px); } }
.dm-empty { margin: auto 0; text-align: center; color: #9a978f; font-size: 18px; }
.dm-row { display: flex; flex-direction: column; }
.dm-you { align-items: flex-end; }
.dm-bubble { margin: 0; max-width: 82%; padding: 10px 14px; border-radius: 20px; background: #3555E5; color: #fff; }
.dm-claude p { margin: 0; }
.dm-work { display: flex; flex-direction: column; gap: 8px; }
.dm-step { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 15px; color: #3b3a37; }
.dm-step svg { flex: none; color: #2F8F5B; font-size: 16px; }
.dm-sub { padding-left: 4px; font-size: 14px; color: #6B6963; }
.dm-spin { flex: none; width: 16px; height: 16px; border-radius: 50%; border: 2px solid #c9d2fb; border-top-color: #3555E5; animation: dm-spin .8s linear infinite !important; }
.dm-spin:not(.on), .dm-done-dot:not(.on) { display: none; }
.dm-done-dot { display: inline-grid; }
@keyframes dm-spin { to { transform: rotate(360deg); } }
.dm-codex { display: flex; gap: 10px; align-items: flex-start; margin: 2px 0 2px 4px; padding: 10px 12px; border: 1px solid #E3E1DD; border-radius: 14px; background: #fff; font-size: 14px; color: #3b3a37; }
.dm-codex img { width: 24px; height: 24px; margin-top: 1px; }
.dm-codex strong { display: block; font-size: 13px; color: #1d1c1a; }
.dm-codex span { display: block; }
.dm-codex span:not(.on)[data-at], .dm-codex span:not(.on)[data-to] { display: none; }
.dm-dots { display: inline-flex !important; gap: 3px; margin-left: 4px; }
.dm-dots i { width: 4px; height: 4px; border-radius: 50%; background: #9a978f; animation: dm-dot 1s infinite; }
.dm-dots i:nth-child(2) { animation-delay: .15s; } .dm-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes dm-dot { 50% { opacity: .2; } }
.dm-swatches { display: flex !important; align-items: center; gap: 5px; margin-top: 7px; }
.dm-swatches i { width: 18px; height: 18px; border-radius: 6px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.1); }
.dm-mini-icon { display: grid; place-items: center; width: 26px; height: 26px; margin-left: 6px; border-radius: 7px; background: #201D18; color: #E9B65A; font-size: 15px; }
.dm-appcard { display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 10px 12px; border: 1px solid #E3E1DD; border-radius: 16px; background: #fff; }
.dm-appcard strong { display: block; font-size: 15px; }
.dm-appcard div span { font-size: 13px; color: #6B6963; }
.dm-appcard div { flex: 1; }
.dm-app-icon, .dm-hi.pickup { display: grid; place-items: center; border-radius: 11px; background: linear-gradient(160deg, #2b2620, #17140f); color: #E9B65A; }
.dm-app-icon { width: 42px; height: 42px; font-size: 22px; }
.dm-open { position: relative; padding: 8px 16px; border-radius: 999px; background: #3555E5; color: #fff; font-size: 14px; font-weight: 500; transition: transform .15s; }
.dm-open.tapped { transform: scale(.92); }
.dm-open.tapped::after { content: ""; position: absolute; inset: -6px; border-radius: inherit; border: 2px solid #3555E5; animation: dm-ring .45s ease-out both; }
@keyframes dm-ring { from { opacity: .8; transform: scale(.8); } to { opacity: 0; transform: scale(1.35); } }
.dm-composer { flex: none; margin: 0 12px 26px; padding: 10px 10px 8px 14px; border: 1px solid #E3E1DD; border-radius: 22px; background: #fff; box-shadow: 0 4px 14px -8px rgba(0,0,0,.15); }
.dm-laptop .dm-composer { margin-bottom: 24px; }
.dm-input { min-height: 24px; font-size: 16px; color: #1d1c1a; }
.dm-placeholder { color: #9a978f; }
.dm-input [data-at]:not(.on), .dm-input [data-to]:not(.on) { display: none; }
.dm-tools { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.dm-plus { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #F1EFEB; font-size: 18px; }
.dm-model { padding: 7px 12px; border-radius: 999px; background: #F1EFEB; font-size: 14px; }
.dm-mic { position: relative; display: grid; place-items: center; width: 38px; height: 38px; margin-left: auto; border-radius: 50%; background: #3555E5; color: #fff; font-size: 18px; transition: background .2s, width .3s; }
.dm-mic.on { width: 86px; border-radius: 19px; background: #E5484D; }
.dm-mic.on svg { display: none; }
.dm-wave { display: none; align-items: center; gap: 4px; height: 20px; }
.dm-mic.on .dm-wave { display: flex; }
.dm-wave b { width: 4px; height: 6px; border-radius: 2px; background: #fff; animation: dm-wave .7s ease-in-out infinite; }
.dm-wave b:nth-child(2) { animation-delay: .12s; } .dm-wave b:nth-child(3) { animation-delay: .24s; } .dm-wave b:nth-child(4) { animation-delay: .36s; }
@keyframes dm-wave { 50% { height: 18px; } }

/* Pickup, the app being built (styled after the real one) */
.dm-pickup { height: 100%; display: flex; flex-direction: column; padding: 22px 22px 0; background: #F4EFE6; color: #201D18; font-size: 15px; }
.dm-pk-brand { margin: 0; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: #B5532F; }
.dm-pickup .dm-pk-title { margin: 10px 0 2px; font: 400 32px/1.15 Georgia, "Times New Roman", serif; letter-spacing: -.01em; }
.dm-pk-upd { margin: 0 0 18px; font-size: 14px; color: #6f675b; }
.dm-pk-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 16px; }
.dm-pk-stats div { padding: 12px; border: 1px solid #E5DccB; border-radius: 16px; background: #FBF8F2; font-size: 13px; color: #4a4339; }
.dm-pk-stats b { display: block; margin-top: 6px; font: 400 28px/1 Georgia, serif; color: #201D18; }
.dm-pk-stats i, .dm-pk-list em::before { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; }
.g { --c: #2F6B4F; } .a { --c: #C9852B; } .r { --c: #B5532F; }
.dm-pk-stats i { background: var(--c); }
.dm-pk-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.dm-pk-list li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px; border: 1px solid #E5DCCB; border-radius: 18px; background: #FBF8F2; opacity: 0; transform: translateY(8px); transition: opacity .35s, transform .35s, box-shadow .3s, border-color .3s; }
.dm-pk-list li.on { opacity: 1; transform: none; }
.dm-pk-list strong { display: block; font-size: 16px; font-weight: 600; }
.dm-pk-list span { font-size: 13px; color: #6f675b; }
.dm-pk-list em { flex: none; display: inline-flex; align-items: center; padding: 5px 10px; border-radius: 999px; background: color-mix(in srgb, var(--c) 12%, #fff); color: var(--c); font-style: normal; font-size: 13px; font-weight: 600; }
.dm-pk-list em::before { content: ""; background: var(--c); }
.dm-pk-tabs { margin: auto -22px 0; display: grid; grid-template-columns: repeat(3, 1fr); padding: 10px 0 34px; border-top: 1px solid #E5DCCB; background: #FBF8F2; font-size: 12px; color: #6f675b; }
.dm-pk-tabs span { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.dm-pk-tabs svg { font-size: 22px; }
.dm-pk-tabs .on { color: #201D18; }

/* iPhone home screen */
.dm-home { position: absolute; inset: 0; padding: 70px 28px 0; background: radial-gradient(120% 70% at 20% 0%, #F5B83D 0%, #E0743A 38%, #5B2A4E 72%, #1B1530 100%); color: #fff; }
.dm-home-grid { display: grid; grid-template-columns: repeat(4, 1fr); row-gap: 22px; }
.dm-home-app { display: flex; flex-direction: column; align-items: center; gap: 6px; font-size: 12px; text-shadow: 0 1px 2px rgba(0,0,0,.35); }
.dm-hi { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 15px; color: #fff; font-size: 34px; box-shadow: 0 6px 14px -6px rgba(0,0,0,.35); }
.dm-hi svg { stroke-width: 1.8; }
.dm-hi[style*="#fff"] { color: #E5484D; }
.dm-hi.krot { background: #ac3823; overflow: hidden; }
.dm-hi.krot svg { width: 100%; height: 100%; stroke: none; }
.dm-hi.pickup { width: 64px; height: 64px; border-radius: 15px; font-size: 34px; }
.dm-new { opacity: 0; transform: scale(.3); transition: opacity .3s, transform .55s cubic-bezier(.3,1.6,.5,1); }
.dm-new.on { opacity: 1; transform: none; }
.dm-new.tapped .dm-hi { filter: brightness(.7); transform: scale(.92); }
.dm-home-toast { position: absolute; left: 50%; bottom: 150px; margin: 0; padding: 10px 16px; border-radius: 999px; background: rgba(20,18,24,.55); backdrop-filter: blur(14px); font-size: 14px; white-space: nowrap; opacity: 0; transform: translate(-50%, 10px); transition: opacity .35s, transform .35s; }
.dm-home-toast.on { opacity: 1; transform: translate(-50%, 0); }
.dm-dock { position: absolute; left: 14px; right: 14px; bottom: 26px; display: flex; justify-content: space-around; padding: 14px 10px; border-radius: 34px; background: rgba(255,255,255,.22); backdrop-filter: blur(18px); }

@media (prefers-reduced-motion: reduce) { .dm * { transition: none !important; animation: none !important; } }
/* The two designs Claude offers before finishing: small previews side by side, chosen in the chat without opening. */
.dm-designs { display: flex; gap: 14px; margin-top: 10px; }
.dm-design { display: flex; flex-direction: column; align-items: center; gap: 7px; transition: opacity .3s; }
.dm-shot { position: relative; width: 132px; height: 269px; border-radius: 16px; overflow: hidden; border: 1px solid #E3E1DD; box-shadow: 0 6px 16px -10px rgba(0,0,0,.35); transition: box-shadow .25s; }
.dm-shot-screen { position: absolute; left: 0; top: 0; width: 390px; height: 794px; transform-origin: 0 0; transform: scale(.3385); }
.dm-design-name { font-size: 13px; color: #3b3a37; }
.dm-choose { padding: 5px 14px; border-radius: 999px; border: 1px solid #D9D6D0; background: #fff; color: #3b3a37; font-size: 13px; font-weight: 500; }
.dm-choose { position: relative; transition: transform .15s, background .2s, color .2s, border-color .2s; }
.dm-choose.tapped { transform: scale(.92); }
.dm-choose.tapped::after { content: ""; position: absolute; inset: -6px; border-radius: inherit; border: 2px solid #3555E5; animation: dm-ring .45s ease-out both; }
.dm-design-b:has(.dm-picked.on) .dm-choose { border-color: #3555E5; background: #3555E5; color: #fff; }
.dm-picked { position: absolute; right: 8px; top: 8px; display: grid !important; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #3555E5; color: #fff; font-size: 16px; opacity: 0; transform: scale(.4); transition: opacity .2s, transform .3s cubic-bezier(.3,1.6,.5,1); }
.dm-thread .dm-picked.on { opacity: 1; transform: none; animation: none; }
.dm-design-b:has(.dm-picked.on) .dm-shot { box-shadow: 0 0 0 3px #3555E5, 0 6px 16px -10px rgba(0,0,0,.35); }
.dm-designs:has(.dm-picked.on) .dm-design-a { opacity: .45; }
/* Design B: the same Pickup, dark. */
.dm-pickup.dark { background: #201D18; color: #F4EFE6; }
.dm-pickup.dark .dm-pk-brand { color: #E9B65A; }
.dm-pickup.dark .dm-pk-upd, .dm-pickup.dark .dm-pk-list span { color: #B3A895; }
.dm-pickup.dark .dm-pk-stats div, .dm-pickup.dark .dm-pk-list li { background: #2B2721; border-color: #3B352D; color: #D9CFBF; }
.dm-pickup.dark .dm-pk-stats b { color: #F4EFE6; }
.dm-pickup.dark .g { --c: #74B892; }
.dm-pickup.dark .a { --c: #E2AA55; }
.dm-pickup.dark .r { --c: #DB8564; }
.dm-pickup.dark .dm-pk-list em { background: color-mix(in srgb, var(--c) 18%, #201D18); }
.dm-pickup.dark .dm-pk-tabs { background: #1A1713; border-color: #3B352D; color: #8F8574; }
.dm-pickup.dark .dm-pk-tabs .on { color: #F4EFE6; }
.dm-layer-app.dark { background: #201D18; }
.dm-screen:has(.dm-from-icon.dark.on) .dm-status { color: #F4EFE6; }
.dm-screen:has(.dm-from-icon.dark.on) .dm-home-bar { background: #F4EFE6; }
.dm-open { white-space: nowrap; }

:root{--paper:#f4f0e6;--ink:#332a23;--k-muted:#665c51;--rust:#ac3823;--rule:#c9c0b2;--soil:#352a23;--moss:#4f5c3b;--serif:Instrument,Georgia,serif;--mono:JetBrains,'Courier New',monospace;--sans:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;z-index:30;pointer-events:none;opacity:.16;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%238b795f' opacity='.22' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
::selection{background:var(--rust);color:var(--paper)}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:4px}
button,input{font:inherit}
button,a,input{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
button:disabled{cursor:wait;opacity:.65}
:focus-visible{outline:2px solid var(--rust);outline-offset:5px}
input:focus-visible{outline-offset:-3px}
img,svg{max-width:100%;vertical-align:middle}
h1,h2,h3,h4,p,figure{margin:0}
h1,h2,h3,h4{font-weight:400}
h1,h2,h3,h4,em{font-family:var(--serif)}
h1,h2,h3{line-height:1;letter-spacing:-.025em}
em{font-weight:400}
ul,ol{list-style:none;margin:0;padding:0}
[hidden]{display:none!important}
.wrap{width:calc(100% - 112px);max-width:1328px;margin-inline:auto}
.mono,.folio,.eyebrow{font-family:var(--mono);font-size:10px;line-height:1.6;letter-spacing:.055em}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:16px;padding:12px 20px;background:var(--paper);z-index:50;transform:translateY(-150%)}
.skip-link:focus{transform:none}
.masthead{height:103px;display:flex;gap:34px;align-items:center;border-bottom:1px solid var(--ink)}
.brand{font-family:var(--serif);font-size:64px;line-height:1;letter-spacing:-5px;text-decoration:none}
.brand span{color:var(--rust)}
.masthead-note{margin:12px auto 0 18px;font-size:9px;letter-spacing:.09em}
.masthead nav{display:flex;gap:25px;align-items:center;margin-top:10px}
.masthead nav a,.sign-in{font-size:12px;text-decoration:none}
.masthead a:hover{color:var(--rust)}
.sign-in{margin-top:10px;padding-left:25px;border-left:1px solid var(--rule);white-space:nowrap}
.sign-in span{padding-left:12px;color:var(--rust);font-size:17px}
.folio{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:16px 0;color:var(--k-muted);text-transform:uppercase}
.folio-dash{padding:0 16px;color:var(--rust)}
.alpha{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;color:var(--rust);text-transform:none;font-size:11px}
.alpha i,.live-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block}
.hero-grid{display:grid;grid-template-columns:1.7fr 1fr;gap:50px;padding:36px 0 35px}
.hero h1{font-size:clamp(76px,7.7vw,115px);line-height:.96;letter-spacing:-.025em}
.hero h1 em{color:var(--rust)}
.hero-aside{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;max-width:380px;padding:3px 0 6px}
.hero-stamp{color:var(--rust);align-self:flex-start;display:flex;align-items:center;gap:16px;margin-bottom:23px}
.hero-stamp svg{width:65px;height:65px;transform:rotate(-8deg)}
.hero-stamp span{font-size:9px;letter-spacing:.12em;border-top:1px solid var(--rust);border-bottom:1px solid var(--rust);padding-block:4px}
.hero-lede{font-size:18px;line-height:1.65;max-width:355px}
.waitlist{width:100%;display:flex;flex-direction:column;margin-top:26px}
.waitlist input{min-width:0;width:100%;border:0;border-bottom:1px solid var(--ink);border-radius:0;background:transparent;color:var(--ink);padding:13px 0;font-size:14px;height:49px}
.waitlist input::placeholder{color:var(--k-muted);opacity:1}
.waitlist button,.cta{border:0;border-radius:0;background:var(--rust);color:var(--paper);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:15px 19px;text-decoration:none;font-size:13px;line-height:1.6;transition:background .2s}
.waitlist button{margin-top:12px;width:100%}
.waitlist button span,.cta span{font-size:21px;line-height:1}
.waitlist button:hover,.cta:hover{background:#8b2d1c}
.form-note{font-size:10px;line-height:1.7;color:var(--k-muted);margin-top:12px;max-width:290px;min-height:34px}
.nx-note-done{font-size:14px;color:var(--moss);padding-block:20px}
.surface-caption{display:flex;justify-content:space-between;align-items:center;color:var(--k-muted);font-size:8px;letter-spacing:.08em;padding-top:15px}
.surface-caption span:first-child{color:var(--rust)}
.surface-caption span:first-child span{padding:0 8px}
.etching{margin-top:-3px;height:230px;overflow:hidden}
.etching svg{width:100%;height:100%;display:block}
.underground{background:var(--soil);color:var(--paper);position:relative;margin-top:-6px;padding:45px 0 0}
.soil-edge{position:absolute;top:-6px;left:0;right:0;height:7px;background:var(--soil);clip-path:polygon(0 45%,5% 15%,12% 52%,18% 20%,25% 60%,35% 20%,42% 65%,51% 20%,60% 60%,68% 32%,74% 65%,85% 15%,93% 55%,100% 20%,100% 100%,0 100%)}
.underground::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#b6a08655 .65px,transparent .65px);background-size:13px 17px;opacity:.32}
.underground-grid{position:relative;display:grid;grid-template-columns:260px minmax(0,1fr);gap:65px;padding-bottom:36px}
.underground-aside{padding-top:4px}
.ground-label{font-size:9px;letter-spacing:.08em;color:#c4b29b}
.underground h2{font-size:47px;line-height:1.05;margin-top:24px}
.underground h2 em{color:#e2b795}
.underground-aside>p:not(.ground-label){color:#c4b9ab;font-size:13px;line-height:1.7;margin-top:17px}
.agent-log{margin-top:32px;font-family:var(--mono);font-size:10px}
.log-heading{display:flex;align-items:center;gap:7px;padding-bottom:12px;border-bottom:1px solid #6b5b4a;color:#dbc3aa;font-size:8px;letter-spacing:.03em}
.log-heading>span:last-child{font-size:7px;margin-left:auto;color:#baaa96}
.log-heading .live-dot{width:4px;height:4px;color:#b7bc82}
.agent-log li{display:flex;align-items:flex-start;gap:13px;padding:13px 0;border-bottom:1px solid #574739;color:#baaa96;transition:color .5s}
.agent-log time{font-size:9px;padding-top:1px}
.agent-log li>span{font-size:9px;line-height:1.7}
.agent-log b{font-size:8px;font-weight:400;color:#baaa96}
.agent-log i{font-style:normal;margin-left:auto;font-size:17px;line-height:1}
.agent-log li.is-current{color:#fff0dc}
.agent-log li.is-current b{color:#edc397}
.demo-figure{min-width:0}
.demo-heading{display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:.06em;margin-bottom:24px;color:#d6c8b7}
.demo-heading>span:last-child{font-family:var(--sans);font-size:24px}
.dm{--dm-max-h:555px;--dm-caption:#d0c1ae}
.underground-bottom{position:relative;display:flex;justify-content:space-between;gap:20px;color:#c6b6a2;font-size:8px;letter-spacing:.07em;padding-block:17px}
.agents{background:#e9e1d3;padding-block:32px 26px}
.agents-intro{display:grid;grid-template-columns:1fr auto;gap:8px 35px;align-items:center}
.agents h2{font-size:30px;letter-spacing:-.015em}
.agents-intro>p{max-width:320px;font-size:12px;line-height:1.7;color:var(--k-muted)}
.marquee-shell{display:flex;gap:18px;align-items:center;margin-top:22px}
.marquee{overflow:hidden;flex:1;min-width:0;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.marquee-track{display:flex;width:max-content;animation:agent-drift 38s linear infinite;animation-play-state:paused}
.marquee.is-visible:not(.is-paused) .marquee-track{animation-play-state:running}
.agent-list{display:flex;align-items:center;gap:62px;padding-right:62px;flex:none}
.agent-list li{display:flex;gap:13px;align-items:center;white-space:nowrap;font-size:20px;font-weight:500;line-height:1.25}
.agent-list img{flex:none;width:31px;height:31px}
.agent-list small{display:block;font:8px/1.5 var(--mono);letter-spacing:.03em;color:var(--k-muted);margin-top:4px}
@keyframes agent-drift{to{transform:translateX(-50%)}}
.motion-toggle{border:1px solid var(--rule);background:transparent;border-radius:50%;color:var(--ink);font-size:15px;width:34px;height:34px;padding:0;flex:none;line-height:1}
.motion-toggle:hover{border-color:var(--ink);background:#e9e2d5}
.agent-disclaimer{text-align:right;font-size:7px;color:var(--k-muted);margin-top:16px;letter-spacing:.06em}
.section-space{padding-block:88px}
.section-space>.folio,.section-space>.wrap>.folio{padding:0;border:0}
.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-block:30px 32px}
.section-heading h2{font-size:var(--section-title);line-height:1.02}
.section-heading h2 em{color:var(--rust)}
.margin-note{font-family:var(--serif);font-style:italic;font-size:24px;line-height:1.3;color:var(--k-muted);max-width:230px;padding-bottom:12px}
.margin-note span{display:block;font:48px/1 var(--serif);color:var(--rust);margin-top:8px}
.eyebrow{font-size:9px;letter-spacing:.07em;color:var(--rust);line-height:1.7}
.eyebrow>span{padding-right:12px}
.business-use{display:grid;grid-template-columns:1fr 1.34fr;gap:48px}
.use-copy h3,.use-copy h2{font-size:calc(var(--section-title) * .5);line-height:1.03;margin-top:23px;margin-bottom:22px}
.use-copy h3 em,.use-copy h2 em{color:var(--rust)}
.use-copy>p:not(.eyebrow){font-size:16px;line-height:1.8;max-width:380px;color:var(--k-muted)}
.use-examples{margin-top:24px}
.use-examples li{display:flex;align-items:center;justify-content:space-between;gap:15px;font-family:var(--mono);font-size:9px;padding:11px 0;color:var(--k-muted)}
.use-examples span{font:16px/1 var(--sans);color:var(--rust)}
.studio-illustration{position:relative;min-width:0;min-height:500px;background:#dce0cf;display:flex;align-items:center;justify-content:center;padding:45px 35px 85px;overflow:hidden}
.studio-orbit{position:absolute;top:-70px;right:-70px;width:330px;height:330px;color:#87916c}
.studio-orbit svg{fill:none;stroke:currentColor;stroke-width:.8}
.studio-app{position:relative;max-width:430px;width:100%;background:#fbf8f0;transform:rotate(-3deg);box-shadow:1px 6px 0 #4f5c3b1a,0 13px 20px #3b45331a;border:1px solid #a9af98}
.studio-brand{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;color:#35432a;border-bottom:1px solid #d8dccc}
.studio-brand>span{font:36px/.8 var(--serif);letter-spacing:-1px}
.studio-star{display:inline-block;font:22px/1 var(--serif);margin-left:4px}
.studio-brand small{font:7px/1 var(--mono);letter-spacing:.07em}
.studio-cover{padding:26px 22px 29px;background:#4f5c3b;color:#f4f0e6;position:relative;overflow:hidden}
.studio-cover>.mono{font-size:7px;letter-spacing:.09em}
.studio-cover h4,.studio-cover .studio-title{font-size:57px;line-height:.96;margin-top:15px;position:relative;z-index:1}
.studio-flower{position:absolute;right:-18px;bottom:-59px;font:197px/1 var(--serif);color:#a3af85;opacity:.5}
.studio-classes{padding:18px 20px 20px}
.studio-day{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:1px solid #cdd1c0}
.studio-day strong{font:20px/1.2 var(--serif)}
.studio-day>span{font:7px/1 var(--mono)}
.studio-class{display:flex;gap:13px;align-items:center;padding:14px 0 10px;font-size:10px}
.studio-class time{font:9px/1 var(--mono);color:var(--k-muted)}
.studio-class>span:not(.book-label){flex:1}
.studio-class strong{font-weight:500;font-size:11px}
.studio-class small{display:block;font-size:8px;color:var(--k-muted);margin-top:3px}
.studio-class>b{font-size:10px;font-weight:500}
.book-label{background:#e2e6d7;color:#35432a;font-size:8px;padding:6px 8px;white-space:nowrap}
.booking-slip{position:absolute;right:20px;bottom:53px;width:326px;max-width:calc(100% - 40px);padding:14px 17px;background:#f5efe1;border:1px solid #c9c1af;box-shadow:0 5px 0 #42483115;transform:rotate(2.5deg)}
.booking-slip>.mono{font-size:6px;letter-spacing:.08em;color:var(--k-muted)}
.booking-slip>div{display:flex;gap:11px;align-items:center;margin-top:10px}
.booking-check{display:grid;place-items:center;border:1px solid var(--moss);color:var(--moss);width:29px;height:29px;border-radius:50%;font-size:14px}
.booking-slip p{font-size:11px;line-height:1.5;flex:1}
.booking-slip p strong{font-weight:500}
.booking-slip p span{display:block;font-size:9px;color:var(--k-muted)}
.booking-slip b{font:27px/1 var(--serif)}
.booking-slip b small{display:block;font:6px/1.7 var(--mono);text-align:center;color:var(--moss)}
.studio-illustration figcaption{position:absolute;bottom:14px;left:20px;font-size:7px;color:#4f5c3b}
.secondary-uses{display:grid;grid-template-columns:1.6fr 1fr;gap:40px;margin-top:40px}
.family-use{min-width:0}
.family-layout{display:grid;grid-template-columns:1fr .9fr;gap:25px;margin-top:20px;align-items:start}
.family-layout .use-copy h3,.family-layout .use-copy h2{font-size:calc(var(--section-title) * .44);margin-top:0;margin-bottom:18px}
.family-layout .use-copy>p{font-size:13px;line-height:1.8}
.biscuit-example{background:#e9dfcd;padding:18px 16px 12px;transform:rotate(2deg);border:1px solid #cabea9;align-self:center}
.biscuit-top{display:flex;gap:10px;align-items:center;justify-content:space-between;border-bottom:1px solid #c8bba6;padding-bottom:11px}
.biscuit-top strong{font:26px/1 var(--serif);max-width:80px}
.biscuit-top svg{width:63px;height:63px}
.walk-row{display:flex;gap:9px;align-items:center;padding:13px 0;border-bottom:1px solid #c8bba6;font-size:9px}
.walk-row time{font:8px/1 var(--mono)}
.walk-row>span{flex:1;font-size:9px;line-height:1.6}
.walk-row strong{font-weight:500}
.walk-row small{display:block;color:#61574b;font-size:7px}
.walk-row>b{font:6px/1.5 var(--mono);color:#4f5c3b;white-space:nowrap}
.biscuit-example figcaption{font-size:6px;color:var(--k-muted);margin-top:12px}
.family-use>.use-examples{display:flex;gap:22px;border-top:0;margin-top:20px}
.family-use>.use-examples li{font-size:8px}
.friends-use{min-width:0;position:relative}
.friends-use h3,.friends-use h2{font-size:calc(var(--section-title) * .44);line-height:1.05;margin:20px 0 18px}
.friends-use h3 em,.friends-use h2 em{color:var(--rust)}
.friends-use>p:not(.eyebrow){font-size:13px;line-height:1.8;max-width:345px;color:var(--k-muted)}
.friends-use .use-examples{display:flex;gap:22px;border:0;margin-top:19px}
.friends-use .use-examples li{font-size:8px}
.friends-symbol{position:absolute;top:48px;right:0;color:var(--rust);font:45px/1 var(--serif);transform:rotate(-10deg)}
.friends-symbol span{display:inline-block;transform:translate(-3px,10px)}
.bottleneck{background:#e9e1d3}
.problem-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:100px;margin:48px 0}
.problem-grid h2{font-size:clamp(60px,6vw,88px);line-height:.99}
.problem-grid h2 em{color:var(--rust)}
.problem-copy{align-self:center;max-width:330px}
.problem-copy p{font-size:16px;line-height:1.8;color:var(--k-muted)}
.editorial-asterisk{display:block;font:90px/.9 var(--serif);color:var(--rust);margin-bottom:30px}
.work-comparison{padding:0}
.comparison-row{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:center;margin-bottom:24px}
.comparison-title{font:25px/1 var(--serif)}
.idle-track{display:flex;height:62px;align-items:stretch;gap:5px}
.idle-track i{width:26px;flex:none;display:grid;place-items:center;background:#746654;color:#f4f0e6;font:7px/1 var(--mono);writing-mode:vertical-rl}
.idle-track>span{flex:1;display:grid;place-items:center;background:repeating-linear-gradient(-45deg,transparent,transparent 4px,#b7aa9424 4px,#b7aa9424 5px);border:1px solid #c6bba9;font:9px/1.6 var(--mono);text-align:center;color:#746754;padding:7px}
.continuous-track{display:flex;justify-content:space-between;align-items:center;padding:15px 19px;background:var(--moss);color:var(--paper);font:10px/1 var(--mono);border:1px solid #3f4d2e}
.continuous-track>span:last-child{font:26px/1 var(--sans)}
.comparison-notes{display:flex;justify-content:space-between;gap:20px;padding-left:170px;color:#596140;font-size:8px}
.work-comparison figcaption{font-size:7px;color:var(--k-muted);margin:23px 0 0 170px}
.powers .section-heading h2{font-size:var(--section-title);line-height:1.1}
.power-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;background:#fbf8f0;padding:28px}
.power-list article{min-width:0}
.power-drawing{height:200px;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:18px;padding-bottom:18px}
.nonstop-drawing>svg{width:290px;height:145px;fill:none;stroke:var(--rust);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.nonstop-drawing .drawing-detail{stroke-width:1}
.drawing-label{position:absolute;bottom:15px;left:0;right:0;text-align:center;color:var(--k-muted);font-size:6px}
.power-number{font-size:8px;color:var(--rust);letter-spacing:.04em}
.power-list h3{font-size:calc(var(--section-title) * .5);line-height:1.05;margin:17px 0 23px}
.power-list h3 em{color:var(--rust)}
.power-list article>p:last-child{font-size:13px;line-height:1.9;color:var(--k-muted)}
.notification-ticket{width:260px;max-width:100%;background:#eee8dc;border:1px solid #c7bdad;padding:14px 15px;transform:rotate(-3deg)}
.notification-ticket-heading{display:flex;gap:7px;align-items:center;font-size:9px}
.notification-ticket-heading>span{font:19px/.8 var(--serif);background:var(--ink);color:var(--paper);padding:3px 5px 5px}
.notification-ticket-heading strong{font-size:9px;font-weight:500}
.notification-ticket-heading small{font:7px/1 var(--mono);margin-left:auto;color:var(--k-muted)}
.notification-ticket>p{font-size:11px;margin-top:10px}
.notification-answer{font-size:11px;background:var(--moss);color:var(--paper);margin:12px -24px -12px 24px;padding:8px 12px;display:flex;justify-content:space-between}
.team-agents{display:flex;justify-content:space-between;width:100%;gap:10px;padding-inline:8px}
.team-agents>span{display:flex;align-items:center;gap:7px;font-size:9px}
.team-agents img{width:23px;height:23px}
.team-drawing>svg{width:100%;height:55px;stroke:var(--rust);stroke-width:1;fill:none}
.shared-files{font-size:7px;background:#e7e0d2;border:1px solid var(--rule);padding:10px 14px}
.day{background:#e5e6d9}

.day-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:100px;margin-top:48px}
.day-intro{position:sticky;top:35px;align-self:start}
.day-intro h2{font-size:80px;line-height:1.01;margin-top:25px}
.day-intro h2 em{color:var(--moss)}
.day-intro>p:not(.eyebrow){font:29px/1.4 var(--serif);color:#60664e;margin-top:30px}
.day-seal{margin-top:60px;display:flex;align-items:flex-end;gap:20px;color:var(--moss)}
.day-seal>span{font:9px/1.6 var(--mono);letter-spacing:.06em;transform:rotate(-8deg);border-block:1px solid var(--moss);padding-block:7px}
.day-seal>svg{width:150px;height:70px;fill:none;stroke:var(--moss);stroke-width:1}
.day-timeline{border-left:1px solid #929d7a}
.day-timeline>li{position:relative;padding:22px 30px 24px 34px;border-bottom:1px solid #bcc1aa;display:grid;grid-template-columns:57px 1fr;gap:22px}
.day-timeline>li:first-child{padding-top:0}
.day-timeline>li::before{content:"";position:absolute;width:5px;height:5px;background:#66734b;border:3px solid #e5e6d9;box-sizing:content-box;left:-6px;top:28px;border-radius:50%}
.day-timeline>li:first-child::before{top:7px}
.day-timeline time{font:10px/1.5 var(--mono);color:var(--moss);padding-top:4px}
.day-timeline h3{font-size:31px;line-height:1.1;letter-spacing:-.01em}
.day-timeline p{font-size:12px;line-height:1.8;color:#5f6650;margin-top:9px}
.day-tag{display:block;font-size:7px;color:#57643d;margin-bottom:9px}
.day-mark{position:absolute;right:2px;top:12px;color:var(--moss);font:29px/1 var(--serif)}
.night-entry{background:var(--soil);color:var(--paper);margin-left:-1px;margin-right:-20px;padding-right:50px!important}
.day-timeline .night-entry::before{border-color:var(--soil);background:#c0c78d}
.night-entry time,.night-entry .day-tag{color:#c2c99e}
.day-timeline .night-entry p{color:#cfbfad}
.moon{position:absolute;top:21px;right:19px;font:36px/1 var(--serif);color:#d9c2a0}
.steps h2{font-size:var(--section-title);margin-top:40px}
.steps h2 em{color:var(--rust)}
.step-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:55px;margin-top:48px}
.step-number{display:flex;align-items:center;justify-content:space-between;font:55px/1 var(--serif);color:var(--rust);padding-bottom:0}
.step-number>span{font-size:28px}
.step-list h3{font-size:calc(var(--section-title) * .45);line-height:1.1;letter-spacing:-.01em;margin:23px 0 12px}
.step-list p{font-size:13px;line-height:1.8;max-width:280px;color:var(--k-muted)}
.pricing{background:#e8dfcf}

.pricing-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:100px;margin-top:50px}
.pricing-intro h2{font-size:128px;line-height:.87;margin-top:32px}
.pricing-intro h2 em{color:var(--rust)}
.pricing-intro>p:not(.eyebrow){font:29px/1.35 var(--serif);color:var(--k-muted);margin-top:28px}
.price-flower{display:block;font:125px/1 var(--serif);color:var(--rust);margin-top:32px}
.price-sheet{background:var(--paper);padding:35px 39px 30px;position:relative;box-shadow:6px 6px 0 #c8bba64d}
.price-line{display:flex;justify-content:space-between;align-items:center;gap:15px}
.price{white-space:nowrap;line-height:1}
.price strong{font:80px/1 var(--serif);letter-spacing:-.04em}
.price>span{font:12px/1 var(--sans);color:var(--k-muted)}
.price-label{font-size:7px;color:var(--rust);line-height:1.8;transform:rotate(5deg)}
.price-alt{font-size:12px;color:var(--k-muted);margin-top:8px}
.trial{font-size:13px;line-height:1.8;margin-top:25px;padding:0}
.includes{padding:18px 0 20px}
.includes li{position:relative;padding:7px 0 7px 25px;font-size:12px}
.includes li>.sketch-icon{position:absolute;left:0;top:9px;color:var(--rust);width:15px;height:15px}
.fine-print{font-size:10px;line-height:1.8;color:var(--k-muted);margin-top:17px}
.fine-print a{color:var(--ink)}
.closing{position:relative;padding-top:90px;padding-bottom:110px}
.closing .eyebrow{text-align:center}
.closing h2{text-align:center;font-size:clamp(80px,10vw,144px);line-height:.9;margin-top:35px}
.closing h2 em{color:var(--rust)}
.closing-bottom{display:flex;align-items:center;justify-content:space-between;max-width:690px;margin:40px auto 0;gap:50px}
.closing-bottom>p{font-size:14px;line-height:1.8;max-width:365px;color:var(--k-muted)}
.closing-bottom .cta{min-width:225px}
.faq-link{text-align:center;font-size:11px;color:var(--k-muted);margin-top:29px}
.closing-rule{position:absolute;bottom:28px;left:10%;right:10%;height:45px;overflow:hidden;color:var(--k-muted);opacity:.4}
.closing-rule svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:.65}
.footer{background:var(--soil);color:var(--paper);padding-block:38px 20px}
.footer-top{display:flex;align-items:center;gap:55px;padding-bottom:34px}
.footer .brand{font-size:80px}
.footer .brand span{color:#dda887}
.footer-top>p{font:31px/1.1 var(--serif);color:#e5d7c6}
.footer-top>p em{color:#c3b29e}
.back-top{margin-left:auto;color:#d2b89d;text-decoration:none;font-size:8px;letter-spacing:.08em}
.footer-bottom{display:flex;justify-content:space-between;gap:25px;align-items:center;padding-top:20px}
.footer-bottom p,.footer-bottom>span{font-size:7px;color:#c4b4a0}
.footer nav{display:flex;flex-wrap:wrap;gap:20px}
.footer nav a{font-size:10px;color:#e3d5c3;text-decoration:none}
.footer nav a:hover,.back-top:hover{text-decoration:underline}
@media(min-width:1600px){.hero-grid{padding-top:47px;padding-bottom:42px}.hero h1{font-size:120px}.hero-aside{max-width:395px}.hero-lede{font-size:19px}.etching{height:245px}}
@media(max-width:1199px){.wrap{width:calc(100% - 80px)}.masthead{gap:23px}.masthead-note{margin-left:0;font-size:8px}.masthead nav{gap:18px}.masthead nav a{font-size:10px}.hero-grid{gap:35px;grid-template-columns:1.65fr 1fr}.hero h1{font-size:8vw}.hero-lede{font-size:16px}.hero-stamp{margin-bottom:13px}.hero-stamp svg{width:48px;height:48px}.underground-grid{grid-template-columns:215px minmax(0,1fr);gap:40px}.underground h2{font-size:41px}.agent-log{margin-top:26px}.etching{height:200px}.business-use{gap:40px}.use-copy h3,.use-copy h2{font-size:calc(var(--section-title) * .5)}.studio-illustration{min-height:465px;padding-inline:26px}.studio-cover h4,.studio-cover .studio-title{font-size:48px}.secondary-uses{grid-template-columns:1.4fr 1fr}.family-layout{grid-template-columns:1fr;gap:20px}.family-layout .use-copy h3,.family-layout .use-copy h2{font-size:calc(var(--section-title) * .44)}.biscuit-example{max-width:290px;transform:rotate(-1deg);margin-top:0}.biscuit-top strong{max-width:none}.friends-use h3,.friends-use h2{font-size:calc(var(--section-title) * .44)}.problem-grid{gap:60px}.power-list{gap:26px}.power-list h3{font-size:calc(var(--section-title) * .5)}.team-agents{flex-wrap:wrap;justify-content:center;gap:12px}.day-grid{gap:60px}.day-intro h2{font-size:67px}.day-timeline>li{padding-left:25px;gap:15px;grid-template-columns:47px 1fr}.pricing-grid{gap:60px;grid-template-columns:1fr 1.35fr}.pricing-intro h2{font-size:108px}.price-sheet{padding:30px}.price strong{font-size:72px}.price-label{display:none}.step-list{gap:35px}}
@media(max-width:959px){.masthead{height:88px}.masthead nav{display:none}.masthead-note{margin-right:auto}.hero-grid{grid-template-columns:1.45fr 1fr;gap:28px;padding-top:32px}.hero h1{font-size:8.1vw}.hero-lede{font-size:14px}.hero-stamp{display:none}.hero-aside{padding-top:0}.waitlist{margin-top:15px}.waitlist input{font-size:12px}.waitlist button{font-size:12px;padding:12px 14px}.form-note{font-size:8px;margin-top:10px}.hero .folio{font-size:8px}.surface-caption{font-size:6px}.etching{height:175px}.underground-grid{grid-template-columns:180px minmax(0,1fr);gap:40px}.underground h2{font-size:35px}.underground-aside>p:not(.ground-label){font-size:11px}.ground-label{font-size:7px}.log-heading{font-size:7px}.log-heading>span:last-child{font-size:5px}.agent-log li{gap:9px}.agent-log li>span{font-size:8px}.agent-log b{font-size:7px}.agent-log time{font-size:7px}.demo-heading{font-size:6px}.dm{--dm-max-h:460px}.agents h2{font-size:31px}.agents-intro>p{max-width:270px;font-size:11px}.section-space{padding-block:68px}.folio{font-size:8px}.folio-dash{padding-inline:10px}.section-heading h2{font-size:var(--section-title)}.margin-note{font-size:20px;max-width:170px}.business-use{gap:30px;grid-template-columns:1fr 1.15fr}.use-copy h3,.use-copy h2{font-size:calc(var(--section-title) * .5)}.use-copy>p:not(.eyebrow){font-size:14px}.studio-illustration{min-height:440px;padding:30px 20px 78px}.studio-brand{padding-inline:14px}.studio-brand small{font-size:5px}.studio-cover{padding:23px 16px}.studio-cover h4,.studio-cover .studio-title{font-size:44px}.studio-cover>.mono{font-size:6px}.studio-classes{padding-inline:13px}.studio-class{gap:8px}.studio-day strong{font-size:18px}.studio-day>span{font-size:6px}.studio-class time{font-size:7px}.studio-class strong{font-size:9px}.studio-class small{font-size:6px}.studio-class>b{font-size:8px}.book-label{font-size:6px;padding:5px 6px}.booking-slip{right:13px;max-width:calc(100% - 26px);bottom:45px;padding:10px 12px}.booking-slip>.mono{font-size:5px}.studio-illustration figcaption{font-size:6px;left:14px}.secondary-uses{margin-top:40px}.family-use{padding-right:28px}.friends-use{padding-left:28px}.family-layout .use-copy h3,.friends-use h3,.family-layout .use-copy h2,.friends-use h2{font-size:calc(var(--section-title) * .44)}.problem-grid{gap:50px}.problem-grid h2{font-size:66px}.problem-copy p{font-size:13px}.editorial-asterisk{font-size:68px;margin-bottom:20px}.comparison-row{grid-template-columns:110px 1fr;gap:15px}.comparison-title{font-size:22px}.idle-track>span{font-size:7px;padding:4px}.idle-track i{width:16px;font-size:6px}.comparison-notes{padding-left:125px;font-size:6px;gap:12px}.work-comparison figcaption{margin-left:125px;font-size:6px}.powers .section-heading h2{font-size:var(--section-title)}.power-list{gap:20px}.power-list h3{font-size:calc(var(--section-title) * .5)}.power-list article>p:last-child{font-size:11px;line-height:1.9}.power-number{font-size:6px}.power-drawing{height:180px}.notification-ticket{padding:12px 10px}.notification-ticket-heading strong{font-size:8px}.notification-ticket>p{font-size:10px}.notification-answer{margin-right:-13px;margin-left:4px;font-size:9px}.drawing-label{font-size:5px}.team-agents>span{font-size:8px}.shared-files{font-size:5px;padding:10px}.day-grid{gap:40px;grid-template-columns:1fr 1.3fr}.day-intro h2{font-size:59px}.day-intro>p:not(.eyebrow){font-size:25px}.day-timeline h3{font-size:27px}.day-timeline p{font-size:11px}.day-timeline>li{padding-left:20px;padding-right:14px;gap:10px;grid-template-columns:40px 1fr}.day-timeline time{font-size:8px}.day-tag{font-size:6px}.day-intro .eyebrow{font-size:7px}.night-entry{margin-right:-12px}.day-mark{display:none}.steps h2{font-size:var(--section-title)}.step-list{gap:25px}.step-list h3{font-size:calc(var(--section-title) * .45)}.step-list p{font-size:12px}.pricing-grid{gap:40px}.pricing-intro h2{font-size:94px}.pricing-intro>.eyebrow{font-size:8px}.price-sheet{padding:27px 24px}.price strong{font-size:65px}.price-alt{font-size:10px}.trial{font-size:12px}.includes li{font-size:11px}.fine-print{font-size:9px}.closing-bottom{max-width:630px;gap:35px}.footer-bottom>span{display:none}.footer-top{gap:35px}.footer nav{gap:15px}}
@media(max-width:699px){.wrap{width:calc(100% - 40px)}.masthead{height:80px;gap:16px}.brand{font-size:55px;letter-spacing:-4px}.masthead-note{font-size:6px;letter-spacing:.03em;margin-top:9px;margin-left:5px}.sign-in{font-size:10px;padding-left:14px}.sign-in span{padding-left:4px;font-size:14px}.folio{font-size:7px;gap:15px;padding-block:15px}.folio>span:last-child:not(.alpha){display:none}.folio-dash{padding-inline:9px}.hero .folio{font-size:7px}.alpha{font-size:8px;gap:6px}.alpha i{width:5px;height:5px}.hero-grid{display:block;padding-top:22px;padding-bottom:22px}.hero h1{font-size:clamp(50px,15.1vw,94px);line-height:.98;letter-spacing:-.028em}.hero-aside{margin-top:25px;max-width:100%;padding:0}.hero-lede{font-size:14px;line-height:1.8;max-width:460px}.waitlist{margin-top:20px;flex-direction:row;gap:10px;align-items:stretch}.waitlist input{height:48px;font-size:11px;flex:1;width:0;border-bottom:1px solid var(--ink);padding-inline:0}.waitlist button{width:auto;flex:none;font-size:10px;padding:13px 12px;margin:0;gap:13px}.waitlist button span{font-size:17px}.form-note{font-size:8px;max-width:none;margin-top:9px;min-height:14px}.surface-caption{padding-top:17px;font-size:6px}.surface-caption>span:last-child{display:none}.etching{height:148px;margin-top:10px;margin-inline:-20px}.etching svg{width:790px;max-width:none;position:relative;left:50%;transform:translateX(-50%)}.underground{padding-top:30px}.underground-grid{display:flex;flex-direction:column;gap:25px;padding-bottom:24px}.underground-aside{display:grid;grid-template-columns:1fr 1fr;gap:0 25px}.ground-label{font-size:6px;grid-column:1/-1}.underground h2{font-size:40px;margin-top:15px;grid-column:1;align-self:start}.underground-aside>p:not(.ground-label){font-size:10px;line-height:1.7;margin-top:13px;grid-column:1}.agent-log{grid-column:2;grid-row:2/4;margin-top:12px;align-self:start}.log-heading{font-size:6px;gap:5px;padding-bottom:6px}.log-heading>span:last-child{display:none}.agent-log li{padding:7px 0;gap:8px;line-height:1.3}.agent-log li>span{font-size:6px;line-height:1.5}.agent-log b{font-size:5px}.agent-log time{font-size:6px}.agent-log i{font-size:12px}.demo-heading{font-size:6px;margin-bottom:15px;gap:12px}.demo-heading>span:last-child{font-size:20px}.dm{--dm-max-h:480px;max-width:500px;margin-inline:auto}.underground-bottom{padding-block:15px;font-size:5px;gap:12px;letter-spacing:.025em}.underground-bottom>span:last-child{display:none}.agents{padding-block:26px 22px}.agents-intro{grid-template-columns:1fr;gap:8px}.agents h2{font-size:31px}.agents-intro>p{max-width:300px;font-size:11px;margin-top:10px}.marquee-shell{gap:10px;margin-top:23px}.agent-list{gap:35px;padding-right:35px}.agent-list li{font-size:17px;gap:10px}.agent-list img{width:26px;height:26px}.agent-list small{font-size:7px}.motion-toggle{width:28px;height:28px;font-size:12px}.agent-disclaimer{font-size:5px;text-align:left;margin-top:17px;letter-spacing:.025em}.section-space{padding-block:56px}.section-heading{margin:26px 0 28px;display:block}.section-heading h2{font-size:var(--section-title);line-height:1.04}.margin-note{font-size:19px;max-width:none;margin-top:22px;display:flex;align-items:center;justify-content:space-between;padding-bottom:0}.margin-note span{font-size:37px;margin:0 20px 0 10px}.business-use{display:flex;flex-direction:column;gap:24px}.eyebrow{font-size:7px}.use-copy h3,.use-copy h2{font-size:calc(var(--section-title) * .5);margin-top:20px;margin-bottom:18px}.use-copy>p:not(.eyebrow){font-size:13px;line-height:1.9;max-width:420px}.use-examples{margin-top:20px}.use-examples li{font-size:8px;padding-block:10px}.studio-illustration{min-height:440px;padding:35px 30px 78px}.studio-app{max-width:365px}.studio-brand{padding:14px 16px}.studio-brand small{font-size:6px}.studio-cover{padding:23px 18px 25px}.studio-cover h4,.studio-cover .studio-title{font-size:48px}.studio-cover>.mono{font-size:6px}.studio-classes{padding:16px}.studio-class{gap:10px;padding-block:13px 8px}.studio-class time{font-size:8px}.studio-class strong{font-size:10px}.studio-class small{font-size:7px}.studio-class>b{font-size:9px}.studio-day strong{font-size:20px}.studio-day>span{font-size:7px}.book-label{font-size:7px}.booking-slip{width:285px;bottom:48px;right:17px;padding:12px 14px}.booking-slip>.mono{font-size:5px}.studio-illustration figcaption{font-size:6px}.secondary-uses{display:block;margin-top:35px}.family-use{padding:0}.family-layout{grid-template-columns:1fr;gap:22px;margin-top:20px}.family-layout .use-copy h3,.family-layout .use-copy h2{font-size:calc(var(--section-title) * .44);line-height:1.02}.family-layout .use-copy>p{font-size:12px}.biscuit-example{width:85%;max-width:330px;margin:0 auto;padding:18px 20px 14px;transform:rotate(2deg)}.biscuit-top strong{font-size:29px;max-width:none}.biscuit-top svg{width:60px}.walk-row{padding-block:15px;gap:15px}.walk-row time{font-size:9px}.walk-row>span{font-size:11px}.walk-row small{font-size:8px}.walk-row>b{font-size:7px}.biscuit-example figcaption{font-size:6px}.family-use>.use-examples{gap:25px;margin-top:26px}.friends-use{padding:32px 0 0}.friends-use h3,.friends-use h2{font-size:calc(var(--section-title) * .44);margin:16px 0 17px}.friends-use>p:not(.eyebrow){font-size:12px;max-width:420px}.friends-symbol{top:48px;right:5px;font-size:37px}.friends-use .use-examples{margin-top:19px;gap:25px}.problem-grid{display:block;margin:30px 0}.problem-grid h2{font-size:clamp(54px,14.2vw,75px)}.problem-copy{max-width:none;margin-top:28px;display:flex;align-items:flex-start;gap:20px}.editorial-asterisk{font-size:56px;line-height:1;flex:none;margin:0}.problem-copy p{font-size:12px;line-height:1.9}.work-comparison{padding-top:25px}.comparison-row{display:block;margin-bottom:23px}.comparison-title{display:block;font-size:23px;margin-bottom:12px}.idle-track{height:75px;gap:3px}.idle-track i{width:11px;font-size:5px}.idle-track>span{font-size:6px;line-height:1.8;padding:4px}.continuous-track{padding:10px 13px;font-size:8px}.continuous-track>span:last-child{font-size:23px}.comparison-notes{padding-left:0;font-size:6px;gap:15px;line-height:1.8}.work-comparison figcaption{margin:20px 0 0;font-size:5px}.powers .section-heading h2{font-size:var(--section-title);line-height:1.09}.power-list{display:block}.power-list article{padding-bottom:32px}.power-list article+article{padding-top:0}.power-drawing{height:185px;max-width:330px;margin:0 auto 24px;border-bottom:0;padding-bottom:28px}.nonstop-drawing>svg{width:270px;height:135px}.drawing-label{font-size:6px;bottom:10px}.power-number{font-size:7px}.power-list h3{font-size:calc(var(--section-title) * .5);margin:15px 0 17px}.power-list article>p:last-child{font-size:12px;line-height:1.9}.power-list article:last-child{padding-bottom:0}.notification-ticket{max-width:260px;padding:14px 16px}.notification-ticket-heading strong{font-size:10px}.notification-ticket>p{font-size:11px}.notification-answer{font-size:11px;margin-left:20px;margin-right:-25px}.team-agents{flex-wrap:nowrap;justify-content:space-between}.team-agents>span{font-size:10px}.team-drawing>svg{max-width:300px}.shared-files{font-size:7px;padding:10px 18px}.day-grid{display:block;margin-top:29px}.day-intro{position:static}.day-intro .eyebrow{font-size:6px}.day-intro h2{font-size:65px;line-height:1;margin-top:20px}.day-intro>p:not(.eyebrow){font-size:24px;margin-top:22px}.day-intro>p:not(.eyebrow) br{display:none}.day-seal{display:none}.day-timeline{margin:32px 0 0 5px}.day-timeline>li{padding:22px 13px 24px 20px;gap:14px;grid-template-columns:42px minmax(0,1fr)}.day-timeline time{font-size:8px}.day-timeline h3{font-size:29px}.day-timeline p{font-size:11px;line-height:1.9}.day-tag{font-size:6px;margin-bottom:8px}.day-timeline>li:first-child{padding-top:7px}.day-timeline>li:first-child::before{top:14px}.night-entry{margin-right:-10px;padding-right:32px!important}.moon{right:8px;font-size:27px}.steps h2{font-size:var(--section-title);line-height:1.06;margin-top:27px;max-width:340px}.step-list{display:block;margin-top:28px}.step-list>li{display:grid;grid-template-columns:45px 1fr;gap:0 22px;padding:20px 0}.step-number{grid-column:1;grid-row:1/3;font-size:38px;padding:0;border:0;display:block}.step-number>span{display:block;font-size:20px;margin-top:8px}.step-list h3{font-size:calc(var(--section-title) * .45);line-height:1.1;margin:0 0 10px}.step-list p{font-size:12px;line-height:1.8;grid-column:2;max-width:350px}.pricing-grid{display:block;margin-top:28px}.pricing-intro{position:relative}.pricing-intro h2{font-size:95px;line-height:.9;margin-top:22px}.pricing-intro>p:not(.eyebrow){font-size:23px;line-height:1.35;margin-top:21px}.price-flower{position:absolute;right:2px;bottom:10px;font-size:96px;margin:0}.price-sheet{margin-top:30px;padding:25px 22px 24px;box-shadow:4px 4px 0 #c8bba64d}.price strong{font-size:73px}.price>span{font-size:11px}.price-alt{font-size:10px;line-height:1.8;margin-top:8px}.trial{font-size:12px;line-height:1.8;margin-top:20px;padding:0}.includes{padding-block:14px 17px}.includes li{font-size:11px;line-height:1.7;padding-left:22px}.fine-print{font-size:9px;line-height:1.9}.cta{font-size:12px;padding:14px 16px}.closing{padding-top:54px;padding-bottom:100px}.closing .eyebrow{font-size:6px}.closing h2{font-size:clamp(65px,17vw,105px);line-height:.94;margin-top:27px}.closing-bottom{flex-direction:column;align-items:stretch;gap:23px;margin-top:27px;max-width:350px}.closing-bottom>p{font-size:12px;text-align:center;max-width:none;line-height:1.9}.closing-bottom .cta{min-width:0}.faq-link{font-size:10px;margin-top:22px}.closing-rule{height:35px;bottom:24px}.footer{padding-top:28px}.footer-top{flex-wrap:wrap;gap:22px;padding-bottom:24px}.footer .brand{font-size:68px}.footer-top>p{font-size:26px}.back-top{flex-basis:100%;margin-top:2px;font-size:7px}.footer-bottom{display:block;padding-top:17px}.footer-bottom p{font-size:7px}.footer nav{gap:13px 20px;margin-top:15px}.footer nav a{font-size:9px}}
@media(max-width:359px){.wrap{width:calc(100% - 36px)}.masthead-note{display:none}.masthead .sign-in{margin-left:auto}.hero h1{font-size:49px}.hero .folio{font-size:6px}.folio-dash{padding-inline:6px}.alpha{font-size:7px}.hero-lede{font-size:13px}.waitlist{gap:8px}.waitlist button{font-size:9px;gap:8px;padding-inline:10px}.waitlist input{font-size:10px}.etching{margin-inline:-18px}.underground h2{font-size:34px}.underground-aside{gap:0 17px}.underground-aside>p:not(.ground-label){font-size:9px}.agent-log li{gap:6px}.agent-log li>span{font-size:6px}.agent-log b{font-size:5px}.agent-log time{font-size:5px}.demo-heading{font-size:5px}.agents h2{font-size:27px}.agents-intro>p{font-size:10px}.section-heading h2{font-size:var(--section-title)}.margin-note{font-size:17px}.use-copy h3,.use-copy h2{font-size:calc(var(--section-title) * .5)}.studio-illustration{min-height:410px;padding:29px 23px 77px}.studio-brand small{font-size:5px}.studio-cover h4,.studio-cover .studio-title{font-size:42px}.studio-cover>.mono{font-size:5px}.studio-classes{padding:12px}.studio-class{gap:7px}.studio-day strong{font-size:18px}.studio-day>span{font-size:5px}.studio-class time{font-size:7px}.studio-class strong{font-size:9px}.book-label{font-size:6px;padding:5px}.booking-slip{right:12px;bottom:43px;width:260px;padding:10px 12px}.booking-slip p{font-size:10px}.booking-slip p span{font-size:8px}.booking-slip>.mono{font-size:4.5px}.studio-illustration figcaption{font-size:5px;left:12px}.biscuit-example{width:93%}.friends-use h3,.friends-use h2{font-size:calc(var(--section-title) * .44)}.friends-symbol{font-size:30px;top:54px}.problem-grid h2{font-size:49px}.problem-copy{gap:14px}.editorial-asterisk{font-size:44px}.problem-copy p{font-size:11px}.powers .section-heading h2{font-size:var(--section-title)}.day-intro h2{font-size:58px}.day-timeline>li{grid-template-columns:34px 1fr;gap:9px;padding-left:16px}.day-timeline h3{font-size:27px}.day-tag{font-size:5px}.steps h2{font-size:var(--section-title)}.step-list>li{gap:0 18px}.step-list h3{font-size:calc(var(--section-title) * .45)}.price-sheet{padding-inline:18px}.price strong{font-size:66px}.price-alt{font-size:9px}.includes li{font-size:10px}.closing h2{font-size:57px}.footer-top{gap:18px}.footer-top>p{font-size:23px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.marquee-track{transform:none!important}.agent-list[aria-hidden]{display:none}.motion-toggle{display:none}.dm .dm-spin{animation:none!important}}
@media(prefers-reduced-motion:reduce){.marquee{mask-image:none;overflow:visible}.marquee-track{width:100%}.agent-list{width:100%;flex-wrap:wrap;gap:22px 32px;padding:0}.agent-list li{font-size:17px}.marquee-shell{align-items:flex-start}}
@media(max-width:699px){.day .folio>span:last-child{display:inline;font-size:6px;white-space:nowrap}.log-heading>span:last-child{display:inline;font-size:5px;letter-spacing:0}.surface-caption::after{content:'ILLUSTRATION';color:var(--k-muted);font-size:5px;letter-spacing:.04em}}
html.is-hidden .marquee-track{animation-play-state:paused!important}
.dm:not(.is-visible) *,.dm:not(.is-visible) *::before,.dm:not(.is-visible) *::after{animation-play-state:paused!important}
.dm:not(.is-visible) .dm-thread .on{animation:none!important}

/* Small pen drawings replace font symbols, including the motion control's two states. */
.sketch-icon{display:inline-block;width:1.1em;height:1.1em;max-width:none;vertical-align:-.16em;flex:none}
.arrow-up{transform:rotate(-45deg)}
.arrow-down{transform:rotate(135deg)}
.arrow-down-right{transform:rotate(90deg)}
.arrow-down-left{transform:rotate(180deg)}
.sketch-playback{width:17px;height:17px;vertical-align:middle}
.play-line{display:none}
.motion-toggle[aria-pressed="true"] .play-line{display:inline}
.motion-toggle[aria-pressed="true"] .pause-lines{display:none}
.studio-star .sketch-icon{width:19px;height:23px;vertical-align:-3px}
.studio-flower{width:165px;height:165px;bottom:-25px;right:-19px;transform:rotate(16deg)}
.studio-flower .sketch-icon{width:100%;height:100%;stroke-width:.65}
.studio-day .sketch-icon,.book-label .sketch-icon{width:9px;height:9px}
.editorial-asterisk .sketch-icon{width:.72em;height:.85em;stroke-width:.65}
.price-flower .sketch-icon{width:.8em;height:.85em;stroke-width:.6}
.booking-check .sketch-icon{width:18px;height:18px}
.comparison-notes .sketch-icon{width:12px;height:12px;margin-right:3px}
.shared-files .sketch-icon{width:12px;height:12px}

/* A few field sketches carry the above-ground / below-ground story through the page. */
.underground-mole{display:block;width:120px;height:56px;margin-top:15px;color:#e2b795}
.underground-mole+.agent-log{margin-top:18px}
.day-landscape{max-width:300px;margin-top:30px}
.day-landscape img{display:block;width:100%;height:auto}
.day-seal{margin-top:25px}
.closing-scene{width:176px;margin:0 auto 24px}
.closing-scene img{display:block;width:100%;height:auto}
@media(max-width:699px){
  .underground-mole{grid-column:1;grid-row:4;width:98px;height:auto;margin-top:8px}
  .underground-mole+.agent-log{grid-row:2/5;margin-top:12px}
  .day-landscape{width:240px;max-width:100%;margin-top:22px}
  .closing-scene{width:150px;margin-bottom:22px}
}

.power-etching{display:block;width:290px;max-width:100%;height:145px;object-fit:contain}
.reply-etching{position:absolute;top:10px;left:0;width:300px;max-width:100%;height:150px;object-fit:contain;object-position:left center}
.notification-drawing .notification-ticket{position:absolute;top:40px;right:0;width:calc(100% - 66px);max-width:238px;padding:12px 10px}
.notification-drawing .notification-answer{margin:10px -8px -5px 4px;padding:7px 9px}
.team-etching{display:block;width:240px;max-width:100%;height:108px;object-fit:contain}
.team-drawing .shared-files{padding:6px 10px}
@media(max-width:959px) and (min-width:700px){
  .notification-ticket-heading{gap:4px}
  .notification-ticket-heading>span{font-size:15px;padding:3px 4px}
  .notification-ticket-heading small{font-size:6px}
  .notification-drawing .notification-ticket{width:calc(100% - 48px);padding:10px 8px;top:34px}
  .notification-drawing .notification-answer{padding:6px}
  .team-etching{height:96px}
}
@media(max-width:699px){
  .power-etching{width:270px;height:135px}
  .reply-etching{left:5px;top:0}
  .notification-drawing .notification-ticket{width:calc(100% - 75px);top:28px}
}

/* v11: paper bands establish sections; shared panels and scale establish their items. */
.uses,.powers,.steps,.closing{background:var(--paper)}
.uses{--section-title:clamp(50px,5.2vw,74px)}
.powers{--section-title:clamp(44px,4.3vw,62px)}
.steps{--section-title:66px}
.use-group{background:#fbf8f0;padding:28px}
.agents-intro>.agents-eyebrow{grid-column:1/-1;max-width:none;margin:0;font:9px/1.7 var(--mono);letter-spacing:.07em;color:var(--rust)}
.use-copy h3,.use-copy h2{margin-top:16px;margin-bottom:18px}
.business-use .use-examples li+li{border-top:1px solid var(--rule)}
.day-timeline>li:last-child{border-bottom:0}
.closing .eyebrow{font:10px/1.6 var(--mono);letter-spacing:.055em}
@media(max-width:1199px) and (min-width:960px){
  .uses{--section-title:64px}
  .powers{--section-title:52px}
  .steps{--section-title:60px}
}
@media(max-width:959px) and (min-width:700px){
  .uses{--section-title:56px}
  .powers{--section-title:44px}
  .steps{--section-title:54px}
  .use-group,.power-list{padding:22px}
  .business-use{gap:28px}
  .secondary-uses{gap:26px}
  .family-use,.friends-use,.power-list article+article{padding:0}
}
@media(max-width:699px){
  .uses{--section-title:clamp(44px,10.8vw,65px)}
  .powers{--section-title:clamp(40px,7.5vw,52px)}
  .steps{--section-title:47px}
  .use-group,.power-list{padding:20px}
  .agents h2{font-size:27px}
  .agents-intro>.agents-eyebrow{font-size:7px}
  .agents-intro>p:not(.agents-eyebrow){margin:0}
  .studio-illustration{width:calc(100% + 40px);margin-inline:-20px}
  .power-list h3{margin:14px 0 16px}
  .step-list{margin-top:24px}
  .step-list>li+li{border-top:1px solid var(--rule)}
  .closing .eyebrow{font-size:7px}
}
@media(max-width:359px){
  .steps{--section-title:42px}
  .pricing-intro h2{font-size:90px}
  .use-group,.power-list{padding:16px}
  .studio-illustration{width:calc(100% + 32px);margin-inline:-16px}
}

/* "Why do you need Krot?": a sage band between the sand "Works with" strip and the paper "Things worth building". */
.why{background:#e5e6d9;--section-title:clamp(50px,5.2vw,74px)}
.why-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;background:#fbf8f0;padding:28px}
.why-list article{min-width:0}
.why-drawing{height:200px;position:relative;display:flex;justify-content:center;align-items:center;margin-bottom:18px;padding-bottom:18px}
.why-drawing img{display:block;width:290px;max-width:100%;height:145px;object-fit:contain}
.why-drawing .drawing-label{font-size:10px;letter-spacing:.055em;bottom:2px}
.why-list .eyebrow{font-size:10px;letter-spacing:.07em}
.why-list h3{font-size:calc(var(--section-title) * .5);line-height:1.05;margin:16px 0 18px}
.why-list h3 em{color:var(--rust)}
.why-list article>p:last-child{font-size:14px;line-height:1.8;color:var(--k-muted);max-width:420px}
@media(max-width:1199px) and (min-width:960px){.why{--section-title:64px}.why-list{gap:26px}}
@media(max-width:959px) and (min-width:700px){
  .why{--section-title:56px}
  .why-list{gap:20px;padding:22px}
  .why-drawing{height:170px}
  .why-list article>p:last-child{font-size:13px}
}
@media(max-width:699px){
  .why{--section-title:clamp(44px,10.8vw,65px)}
  .why-list{display:block;padding:20px}
  .why-list article+article{margin-top:40px}
  .why-drawing{height:180px;max-width:330px;margin:0 auto 16px}
  .why-list h3{margin:14px 0 14px}
  .why-list article>p:last-child{font-size:13px;line-height:1.9}
}
@media(max-width:359px){.why-list{padding:16px}}

/* No. 05 trimmed to one point (the rest now lives in "Why do you need Krot?"): copy left, the reply drawing right. */
.power-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center;background:#fbf8f0;padding:36px 40px}
.power-feature-copy .eyebrow{font-size:10px;letter-spacing:.07em}
.power-feature-copy p:last-child{font-size:16px;line-height:1.8;color:var(--k-muted);max-width:460px;margin-top:16px}
.power-feature .power-drawing{width:100%;max-width:340px;justify-self:center;margin:0}
.power-feature .drawing-label{font-size:10px;letter-spacing:.055em;bottom:0}
@media(max-width:699px){
  .power-feature{display:block;padding:20px}
  .power-feature .power-drawing{margin:28px auto 0;max-width:330px}
  .power-feature-copy p:last-child{font-size:13px;line-height:1.9}
}

/* The menu: "Use cases" opens a small sheet of the three kinds of app (their own page); the rest jump down this page.
   Below 960px the links fold into a "Menu" button that opens a paper panel under the masthead. */
.masthead{position:relative;--gutter:56px}
.menu-toggle{display:none}
.masthead .site-nav{display:block;margin-top:10px}
.nav-list,.nav-sub{list-style:none;margin:0;padding:0}
.nav-list{display:flex;gap:25px;align-items:center}
.nav-list>li>a,.nav-sub-toggle{font:400 12px/1.6 var(--sans);color:var(--ink);text-decoration:none}
.nav-sub-toggle{display:inline-flex;align-items:center;gap:4px;padding:0;border:0;background:none;cursor:pointer}
.nav-sub-toggle:hover,.nav-sub a:hover{color:var(--rust)}
.nav-sub-toggle .sketch-icon{width:15px;height:15px;color:var(--rust);transition:transform .2s}
.nav-sub-toggle[aria-expanded="true"] .sketch-icon{transform:rotate(180deg)}
.nav-has-sub{position:relative}
.nav-sub{display:none;position:absolute;z-index:40;top:calc(100% + 16px);left:-20px;width:270px;padding:6px 20px;background:#fbf8f0;border:1px solid var(--ink);box-shadow:5px 5px 0 #c8bba64d}
.nav-sub::before{content:"";position:absolute;left:0;right:0;top:-17px;height:17px}
.nav-has-sub:hover .nav-sub,.nav-sub-toggle[aria-expanded="true"]+.nav-sub{display:block}
.nav-sub li+li{border-top:1px solid var(--rule)}
.nav-sub a{display:flex;align-items:baseline;gap:12px;padding:12px 0;font-size:15px;line-height:1.3;color:var(--ink);text-decoration:none}
.nav-sub a .mono{font-size:10px;letter-spacing:.07em;color:var(--rust)}
.nav-sub .nav-sub-all{align-items:center;font-size:10px;letter-spacing:.07em;color:var(--rust)}
.nav-sub-all .sketch-icon{width:14px;height:14px}
.section-heading .uses-h1{font-size:var(--section-title);line-height:1.02}
.uses-h1 em{color:var(--rust)}
.closing-sand{background:#e9e1d3}
@media(max-width:1199px){.masthead{--gutter:40px}.nav-list{gap:18px}.nav-list>li>a,.nav-sub-toggle{font-size:10px}}
@media(max-width:959px){
  .menu-toggle{display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:8px 0;border:0;background:none;color:var(--ink);font:500 10px/1 var(--mono);letter-spacing:.07em;cursor:pointer}
  .menu-toggle .sketch-icon{width:22px;height:22px;color:var(--rust)}
  .menu-label-close,.sketch-close,.menu-toggle[aria-expanded="true"] .menu-label-open,.menu-toggle[aria-expanded="true"] .sketch-menu{display:none}
  .menu-toggle[aria-expanded="true"] .menu-label-close,.menu-toggle[aria-expanded="true"] .sketch-close{display:inline}
  .masthead .site-nav{display:none}
  .masthead .site-nav.is-open{display:block;position:absolute;z-index:40;top:100%;left:calc(var(--gutter) * -1);right:calc(var(--gutter) * -1);margin:0;padding:4px var(--gutter) 24px;background:var(--paper);border-bottom:1px solid var(--ink);box-shadow:0 24px 30px -26px #332a2366}
  .site-nav.is-open .nav-list{display:block}
  .site-nav.is-open .nav-list>li{border-bottom:1px solid var(--rule)}
  .site-nav.is-open .nav-list>li>a,.site-nav.is-open .nav-sub-toggle{display:block;width:100%;padding:16px 0;text-align:left;font-size:26px;line-height:1.1;font-weight:600;font-stretch:80%;letter-spacing:-.012em;cursor:default}
  .site-nav.is-open .nav-sub-toggle .sketch-icon{display:none}
  .site-nav.is-open .nav-sub{display:block;position:static;width:auto;margin:-6px 0 12px;padding:0;border:0;background:none;box-shadow:none}
  .site-nav.is-open .nav-sub::before{display:none}
  .site-nav.is-open .nav-sub li+li{border:0}
  .site-nav.is-open .nav-sub a{padding:9px 0;font-size:16px}
  .site-nav.is-open .nav-sub .nav-sub-all{font-size:10px}
}
@media(max-width:699px){.masthead{--gutter:20px}.menu-toggle{margin-top:6px}}
@media(max-width:359px){.masthead{--gutter:18px}.menu-toggle .menu-label-open,.menu-toggle .menu-label-close{display:none!important}}
@media(max-width:479px){.masthead-note{display:none}.masthead .menu-toggle{margin-left:auto}}

/* "Apps for the people around you": a group trip planner card, a paper sibling of the dog-walk schedule. */
.trip-example{max-width:300px;margin:26px 0 4px 6px;padding:18px 18px 12px;background:#efe6d6;border:1px solid #cabea9;transform:rotate(-2deg)}
.trip-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:10px;border-bottom:1px solid #c8bba6}
.trip-top strong{display:block;font:600 30px/1 var(--serif);font-stretch:80%;letter-spacing:-.012em}
.trip-top small{display:block;margin-top:7px;font-size:10px;letter-spacing:.05em;color:#61574b}
.trip-top svg{flex:none;width:78px;height:62px}
.trip-vote{padding:12px 0 10px;border-bottom:1px solid #c8bba6}
.trip-label{margin-bottom:6px;font-size:10px;letter-spacing:.06em;color:var(--rust)}
.trip-option{display:grid;grid-template-columns:1fr auto;align-items:center;gap:5px 10px;padding:5px 0;font-size:13px}
.trip-option span{display:inline-flex;align-items:center;gap:6px}
.trip-option .sketch-icon{width:15px;height:15px;color:var(--moss)}
.trip-option b{font:500 10px/1 var(--mono);letter-spacing:.04em;color:#61574b}
.trip-option i{grid-column:1/-1;position:relative;height:5px;background:#ddd1bd}
.trip-option i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);background:#a99d8a}
.trip-lead b{color:var(--moss)}
.trip-lead i::after{background:var(--moss)}
.trip-split{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0 2px;font-size:13px}
.trip-split strong{font-weight:500}
.trip-split small{display:block;font-size:11px;color:#61574b}
.trip-split b{font:500 10px/1.5 var(--mono);letter-spacing:.04em;color:var(--rust);text-align:right}
.trip-example figcaption{margin-top:12px;font-size:10px;letter-spacing:.04em;color:var(--k-muted)}
@media(max-width:699px){.trip-example{width:88%;max-width:330px;margin:28px auto 6px}}

/* With "A day as a super builder" gone, Get started takes the sage band so it doesn't sit paper against paper. */
.steps{background:#e5e6d9}
/* FAQ: the title on the left, the questions as a list of rows that open in place (a drawn plus turns to a cross). */
.faq{background:var(--paper);--section-title:clamp(50px,5.2vw,74px)}
.faq-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:64px;margin-top:30px;align-items:start}
.faq-intro{position:sticky;top:35px}
.faq-intro h2{font-size:var(--section-title);line-height:1.02}
.faq-intro h2 em{color:var(--rust)}
.faq-intro p{margin-top:24px;max-width:300px;font-size:14px;line-height:1.8;color:var(--k-muted)}
.faq-intro a,.faq-item a{color:inherit;text-decoration-color:var(--rust);text-underline-offset:3px}
.faq-list{background:#fbf8f0;padding:6px 28px}
.faq-item+.faq-item{border-top:1px solid var(--rule)}
.faq-item summary{display:grid;grid-template-columns:34px minmax(0,1fr) 24px;gap:12px;align-items:baseline;padding:20px 0;cursor:pointer;list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-number{font-size:10px;letter-spacing:.07em;color:var(--rust)}
.faq-item h3{font-size:24px;line-height:1.15}
.faq-item summary:hover h3{color:var(--rust)}
.faq-icon{align-self:center;color:var(--rust)}
.faq-icon .sketch-icon{display:block;width:20px;height:20px;transition:transform .25s}
.faq-item[open] .faq-icon .sketch-icon{transform:rotate(45deg)}
.faq-item>p{margin:-6px 36px 22px 46px;font-size:15px;line-height:1.8;color:var(--k-muted)}
@media(max-width:959px){.faq-grid{grid-template-columns:1fr;gap:28px}.faq-intro{position:static}.faq{--section-title:56px}}
@media(max-width:699px){
  .faq{--section-title:clamp(44px,10.8vw,65px)}
  .faq-grid{margin-top:26px}
  .faq-intro p{font-size:13px;margin-top:18px}
  .faq-list{padding:2px 20px}
  .faq-item summary{grid-template-columns:28px minmax(0,1fr) 20px;gap:8px;padding:17px 0}
  .faq-item h3{font-size:20px}
  .faq-item>p{margin:-4px 0 18px 36px;font-size:13px;line-height:1.85}
}
@media(prefers-reduced-motion:reduce){.faq-icon .sketch-icon{transition:none}}

/* Get started has four steps now; the third is optional and says so with a small rust label above its title. */
.step-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:40px}
.step-optional{position:absolute;margin-top:5px;font-size:10px;line-height:1.6;letter-spacing:.07em;color:var(--rust)}
@media(max-width:1199px){.step-list{gap:28px}}
@media(max-width:959px) and (min-width:700px){.step-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 40px}}
@media(max-width:699px){
  .step-list>li .step-number{grid-row:1/4}
  .step-optional{position:static;display:block;grid-column:2;margin:0 0 8px}
}

/* Pricing (Founder plan): the live deadline leads; the promise, list and planned bigger box stay together,
   with the button last in the card and the small print underneath. */
.pricing .folio,.pricing-intro>.eyebrow{font-size:10px}
.pricing-intro>.eyebrow{text-transform:uppercase}
.pricing-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
.pricing-intro h2{margin-top:16px;font-size:inherit;line-height:1}
.fp-plan{display:block;font-size:clamp(42px,4.45vw,64px);line-height:1.02}
.fp-countdown{display:flex;align-items:flex-end;gap:18px;margin-top:28px;color:var(--rust)}
.fp-count{font-size:clamp(148px,17vw,248px);line-height:.8;font-variant-numeric:lining-nums tabular-nums}
.fp-count-unit{font-size:clamp(52px,5.7vw,82px);line-height:.92}
.fp-until{margin-top:32px}
.fp-until .mono{display:block;margin-bottom:8px;font-size:10px;letter-spacing:.07em;color:var(--k-muted)}
.fp-until strong{display:block;font:600 clamp(30px,2.8vw,40px)/1.08 var(--serif);font-stretch:80%;letter-spacing:-.012em}
.fp-until-note{display:block;margin-top:12px;max-width:290px;font-size:15px;line-height:1.6;color:var(--k-muted)}
.pricing-intro>.fp-lede{margin-top:28px;font-size:23px;line-height:1.35}
.fp-sheet{padding:36px 40px 36px}
.fp-promise{margin-top:26px;padding-top:24px;border-top:1px solid var(--rule)}
.fp-promise h3{font-size:32px;line-height:1.08}
.fp-promise h3 em{color:var(--rust)}
.fp-promise p{margin-top:8px;font-size:14px;line-height:1.7;color:var(--k-muted)}
.fp-sheet .includes{padding:16px 0 22px}
.fp-sheet .includes li{font-size:14px;line-height:1.5;padding-block:8px}
.fp-sheet .includes li small{display:block;margin-top:2px;font-size:12px;color:var(--k-muted)}
.fp-later{padding:16px 18px;background:#efe8db}
.fp-label{font-size:10px;letter-spacing:.07em;color:var(--rust)}
.fp-later p:last-child{margin-top:6px;font-size:13px;line-height:1.7;color:var(--k-muted)}
.fp-action{margin-top:28px;padding-top:24px;border-top:1px solid var(--rule)}
.fp-action .trial{margin:0 0 14px;font-size:14px}
.fp-join-by{display:block;margin-bottom:4px;color:var(--rust);font-weight:600}
.fp-col .fine-print{margin-top:22px;max-width:620px}
@media(max-width:1199px){.pricing-grid{gap:60px;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)}}
@media(max-width:959px){
  .pricing-grid{gap:32px;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
  .fp-plan{font-size:42px}
  .fp-countdown{gap:12px;margin-top:24px}
  .fp-count{font-size:clamp(126px,17vw,164px)}
  .fp-count-unit{font-size:clamp(44px,5.7vw,54px)}
  .fp-until{margin-top:26px}
  .fp-until strong{font-size:30px}
  .fp-sheet{padding:28px 26px}
  .fp-promise h3{font-size:28px}
}
@media(max-width:699px){
  .pricing{padding-block:44px}
  .pricing-intro h2{margin-top:14px}
  .fp-plan{font-size:46px}
  .fp-countdown{gap:14px;margin-top:24px}
  .fp-count{font-size:clamp(136px,41vw,224px)}
  .fp-count-unit{font-size:clamp(48px,14vw,72px)}
  .fp-until{margin-top:26px}
  .fp-until strong{font-size:32px}
  .pricing-intro>.fp-lede{font-size:21px;margin-top:22px}
  .fp-sheet{padding:24px 20px}
  .fp-promise h3{font-size:26px}
  .fp-sheet .includes li{font-size:13px}
  .fp-later{padding:14px}
}

/* The notification ticket shows the Krot app icon (Open Burrow) instead of the old "k." badge. */
.notification-ticket-heading>.nt-icon{display:block;width:20px;height:20px;padding:0;background:none}
.nt-icon svg{display:block;width:100%;height:100%}

/* How it works: the same bands, folios and groups as the main page; a spec sheet, a three-step flow and item grids. */
.hw-intro{background:var(--paper)}
.hw-tools{background:#e9e1d3}
.hw-path{background:#e5e6d9}
.hw-handoff{background:var(--paper)}
.hw-apps{background:#e9e1d3}
.hw-trust{background:#e5e6d9}
.hw-intro,.hw-tools,.hw-path,.hw-handoff,.hw-apps,.hw-trust{--section-title:clamp(46px,4.8vw,68px)}
.hw-intro-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:72px;margin-top:34px;align-items:start}
.hw-h1{font-size:clamp(58px,6.4vw,96px);line-height:.98}
.hw-h1 em{color:var(--rust)}
.hw-lede{max-width:520px;margin-top:26px;font-size:18px;line-height:1.65;color:var(--k-muted)}
.hw-etching{margin-top:34px;max-width:320px}
.hw-etching img{display:block;width:100%;height:auto}
.hw-etching figcaption,.hw-flow figcaption{margin-top:10px;font-size:10px;letter-spacing:.05em;color:var(--k-muted)}
.hw-spec{margin:0;background:#fbf8f0;padding:28px 30px;box-shadow:6px 6px 0 #c8bba64d}
.hw-spec-title{font-size:10px;letter-spacing:.07em;color:var(--rust);margin-bottom:8px}
.hw-spec-row{display:grid;grid-template-columns:110px minmax(0,1fr);gap:16px;padding:13px 0;border-top:1px solid var(--rule)}
.hw-spec-row dt{font-size:10px;letter-spacing:.07em;color:var(--k-muted);padding-top:3px}
.hw-spec-row dd{margin:0;font-size:15px;line-height:1.5}
.section-heading h2 em{color:var(--rust)}
.hw-group{display:grid;gap:32px;background:#fbf8f0;padding:28px}
.hw-items-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.hw-items-2{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 48px}
.hw-item .eyebrow{font-size:10px;letter-spacing:.07em}
.hw-item h3{margin:12px 0 12px;font-size:calc(var(--section-title) * .42);line-height:1.08}
.hw-item p:last-child{font-size:14px;line-height:1.8;color:var(--k-muted)}
.hw-flow{display:grid;grid-template-columns:minmax(0,1fr) 92px minmax(0,1fr) 92px minmax(0,1fr);align-items:stretch;margin:0 0 24px}
.hw-node{display:flex;flex-direction:column;gap:6px;padding:22px 22px 24px;background:#fbf8f0;border:1px solid var(--ink)}
.hw-node .mono{font-size:10px;letter-spacing:.07em;color:var(--rust)}
.hw-node strong{font:600 24px/1.1 var(--serif);font-stretch:80%;letter-spacing:-.012em}
.hw-node span{font-size:14px;line-height:1.6;color:var(--k-muted)}
.hw-node-box{background:var(--soil);color:var(--paper);border-color:var(--soil)}
.hw-node-box .mono{color:#e2b795}
.hw-node-box span{color:#d8ccbb}
.hw-link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--rust)}
.hw-link .mono{font-size:10px;letter-spacing:.06em;text-align:center}
.hw-link .sketch-icon{width:30px;height:30px;transform:rotate(45deg)}
.hw-flow figcaption{grid-column:1/-1}
.hw-list{list-style:none;margin:0;padding:8px 28px;background:#fbf8f0;columns:2;column-gap:56px}
.hw-list li{position:relative;break-inside:avoid;padding:16px 0 16px 28px;border-bottom:1px solid var(--rule);font-size:15px;line-height:1.7;color:var(--k-muted)}
.hw-list li>.sketch-icon{position:absolute;left:0;top:19px;width:16px;height:16px;color:var(--rust)}
.hw-list strong{color:var(--ink);font-weight:600}
.main-more{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:22px}
.main-more a{display:inline-flex;align-items:center;gap:8px;font:500 10px/1.6 var(--mono);letter-spacing:.07em;color:var(--rust);text-decoration:none}
.main-more a:hover{text-decoration:underline}
.main-more .sketch-icon{width:14px;height:14px}
@media(max-width:959px){
  .hw-intro-grid{grid-template-columns:1fr;gap:40px}
  .hw-items-3{grid-template-columns:1fr 1fr}
  .hw-flow{grid-template-columns:1fr;gap:0}
  .hw-link{flex-direction:row;padding:10px 0}
  .hw-link .sketch-icon{transform:rotate(135deg)}
  .hw-list{columns:1}
}
@media(max-width:699px){
  .hw-lede{font-size:16px}
  .hw-spec{padding:22px 20px}
  .hw-spec-row{grid-template-columns:86px minmax(0,1fr);gap:12px}
  .hw-spec-row dd{font-size:14px}
  .hw-group{display:block;padding:20px}
  .hw-group .hw-item+.hw-item{margin-top:30px}
  .hw-item h3{font-size:26px}
  .hw-item p:last-child{font-size:13px}
  .hw-node strong{font-size:22px}
  .hw-list{padding:4px 20px}
  .hw-list li{font-size:14px}
}

/* Labels shown in capitals are written normally in the page ("Krot", never "KROT"); the capitals come from here. */
.underground-bottom,.main-more a,.hw-spec-title,.hw-node .mono{text-transform:uppercase}
.hw-spec-note{display:block;margin-top:4px;font-size:13px;color:var(--k-muted)}

/* No "Illustration" captions, no "Krot means mole" line: the strip under the demo keeps one line, on phones too. */
.underground-bottom{justify-content:flex-end}
@media(max-width:699px){.underground-bottom>span:last-child{display:inline}.underground-bottom{justify-content:flex-start}}
.why-drawing{padding-bottom:0;height:170px}
.log-heading>.live-dot{margin-left:0!important}
.nav-list>li>a[aria-current="page"],.nav-sub-toggle[aria-current="page"]{color:var(--rust)}

.studio-cover .studio-title{font-family:var(--serif);font-weight:600;font-stretch:80%;letter-spacing:-.012em}
/* The Founder plan countdown sits under the heading, not inside it. */
.fp-countdown-row{margin:0}
.hw-spec-list{margin:0}

/* The Founder plan, limited by count: the big number is the Founder Krot Boxes left, then the same number drawn as
   small burrows, one for each box. page.js reads the live number from /api/founder-boxes. */
.fpc-count{display:flex;align-items:flex-end;gap:18px;margin-top:22px;color:var(--rust)}
.fpc-count strong{color:var(--rust);font:600 clamp(148px,17vw,248px)/.8 var(--serif);font-stretch:80%;letter-spacing:-.02em;font-variant-numeric:lining-nums}
.fpc-count span{font:600 clamp(34px,3.4vw,50px)/.98 var(--serif);font-stretch:80%;letter-spacing:-.012em;color:var(--ink);padding-bottom:4px}
.fpc-count em{color:var(--rust)}
.fpc-boxes{display:grid;grid-template-columns:repeat(11,22px);gap:9px 8px;margin-top:30px;color:var(--rust)}
.fpc-boxes i{display:block;width:22px;height:16px}
.fpc-boxes svg{display:block;width:100%;height:100%;fill:currentColor}
@media(max-width:959px){.fpc-count span{font-size:34px}.fpc-boxes{grid-template-columns:repeat(9,20px);gap:8px 7px}.fpc-boxes i{width:20px;height:15px}}
@media(max-width:699px){
  .fpc-count{gap:14px}
  .fpc-count strong{font-size:clamp(136px,41vw,224px)}
  .fpc-count span{font-size:clamp(30px,9vw,44px)}
  .fpc-boxes{grid-template-columns:repeat(11,minmax(0,1fr));gap:9px 6px;max-width:340px}
  .fpc-boxes i{width:100%;height:auto;aspect-ratio:176/128}
}
/* The button label (data-cta, switched by page.js) keeps the button's own size; only the arrow beside it is larger. */
.cta [data-cta],.waitlist button [data-cta]{font-size:inherit;line-height:inherit}

/* The hero's sign-up link, shown instead of the waitlist form while Founder Krot Boxes are left. */
.hero-start{margin-top:6px}
.hero-start[hidden]{display:none}
/* The email field: focus shows as its underline turning rust and thicker, not an outline over the text; 16px type on
   touch screens, so phones never zoom in when it is tapped. */
.waitlist input:focus,.waitlist input:focus-visible{outline:none;border-bottom-color:var(--rust);box-shadow:inset 0 -2px 0 var(--rust)}
@media(max-width:959px){.waitlist input{font-size:16px}}

/* Design A, font versions: shared changes. The real Krot logo (mark + wordmark, inline SVG) replaces the typed
   "krot.", and the italic emphasis becomes upright, keeping its rust colour. Loaded after style.css. */
em { font-style: normal; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-size: 0; letter-spacing: 0; color: var(--ink); }
.brand svg:first-child { width: 44px; height: 44px; }
.brand svg:last-child { height: 34px; width: auto; }
.footer .brand { font-size: 0; color: #f4f0e6; }
.footer .brand svg:first-child { width: 58px; height: 58px; }
.footer .brand svg:last-child { height: 44px; }
/* The mark (Open Burrow) is rust on paper and paper on the soil footer; sized to the wordmark's height. */
.brand .nx-mark { width: auto; height: 34px; }
.footer .brand .nx-mark { height: 44px; }
.footer .brand .nx-mark path { fill: #f4f0e6; }
@media (max-width: 699px) { .brand svg:first-child { width: auto; height: 28px; } .brand svg:last-child { height: 28px; } .footer .brand { font-size: 0; } }

/* Design A, font set 2: Archivo set semi-condensed (a sharp, Swiss-leaning grotesque) for headings and text,
   Spline Sans Mono for labels. The width axis keeps headings near Instrument Serif's measure. */
@font-face { font-family: "Archivo W"; src: url(fonts/archivo-wdth.woff2) format("woff2"); font-weight: 100 900; font-stretch: 62% 125%; font-display: swap; }
@font-face { font-family: "Spline Sans Mono"; src: url(fonts/spline-sans-mono.woff2) format("woff2"); font-weight: 300 700; font-display: swap; }
:root { --serif: "Archivo W", "Helvetica Neue", Arial, sans-serif; --mono: "Spline Sans Mono", ui-monospace, monospace; --sans: "Archivo W", "Helvetica Neue", Arial, sans-serif; }
h1, h2, h3, h4, em { font-weight: 600; font-stretch: 80%; letter-spacing: -0.012em; }
.hero h1 { letter-spacing: -0.018em; line-height: .95; }
.margin-note { font-style: normal; font-weight: 500; font-stretch: 85%; letter-spacing: -0.01em; }
body { font-stretch: 100%; }