main{counter-reset:section}.eyebrow{counter-increment:section}.section-eyebrow-link{color:inherit;-webkit-text-decoration:underline dashed;text-decoration:underline dashed;-webkit-text-decoration-color:color-mix(in oklch, currentColor 35%, transparent);text-decoration-color:color-mix(in oklch, currentColor 35%, transparent);text-underline-offset:3px;text-decoration-thickness:1px;transition:color .2s cubic-bezier(.25,1,.5,1),text-decoration-color .2s cubic-bezier(.25,1,.5,1)}.section-eyebrow-link:hover,.section-eyebrow-link:focus-visible{color:var(--accent);-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent)}[data-mode=creator] .section-eyebrow-link{text-underline-offset:4px;text-decoration-style:wavy;text-decoration-thickness:.5px}@media (prefers-reduced-motion:reduce){.section-eyebrow-link{transition-duration:0s}}[data-mode=dev] .eyebrow{font-family:var(--font-mono);letter-spacing:0;text-transform:none;color:var(--color-fg);font-weight:500}[data-mode=creator] .section-eyebrow [data-mode-only=creator]{font-family:var(--font-pixel), var(--font-mono)}.section-eyebrow-icon{color:var(--accent);vertical-align:middle;align-items:center;margin-right:.4em;line-height:0;display:inline-flex}.section-eyebrow-icon>*{align-items:center;display:inline-flex}[data-mode-only]{display:none}[data-mode=dev] [data-mode-only=dev],[data-mode=designer] [data-mode-only=designer],[data-mode=creator] [data-mode-only=creator]{display:inline}.section-card .section-eyebrow{min-height:var(--eyebrow-height);background:0 0;align-items:center;padding:0;display:flex;position:relative}.section-eyebrow-tab{--section-tab-radius:var(--section-frame-radius);border-radius:var(--section-tab-radius) var(--section-tab-radius) 0 0;transition:background-color .2s var(--ease-out-quart), border-color .2s var(--ease-out-quart);background:0 0;border:1px solid #0000;border-bottom:none;align-self:stretch;align-items:center;padding:0 .75rem 0 .625rem;display:inline-flex;position:relative}[data-mode=dev] .section-eyebrow-tab{--section-tab-radius:calc(var(--section-frame-radius) + 2px);background:var(--dev-section-surface-top,var(--color-surface));border-color:var(--color-line);box-shadow:inset 0 1px 0 var(--dev-section-edge-top,transparent)}@media (prefers-reduced-motion:reduce){.section-eyebrow-tab{transition-duration:0s}}[data-mode=designer] .eyebrow:before{content:"[ ";font-family:var(--font-mono);letter-spacing:0;text-transform:none;opacity:.55;font-weight:500;position:absolute;inset-block-start:50%;inset-inline-start:.125rem;transform:translateY(-50%)}[data-mode=designer] .section-eyebrow-tab:after{content:"] · " counter(section, decimal-leading-zero);font-family:var(--font-mono);letter-spacing:.04em;text-transform:none;white-space:nowrap;opacity:.55;font-weight:500;position:absolute;inset-block-start:50%;inset-inline-start:calc(100% - .375rem);transform:translateY(-50%)}[data-mode=creator] .section-card:before{content:"";inset:0;top:var(--eyebrow-height);z-index:-1;pointer-events:none;background:var(--color-surface);-webkit-backdrop-filter:none;backdrop-filter:none;border:2px solid var(--color-fg);border-radius:var(--section-frame-radius);transition:border-color .2s ease-out;position:absolute;box-shadow:inset 1px 1px #ffffff52;box-shadow:inset 1px 1px lab(100% 0 0/.32)}[data-mode=creator] .section-card:after{content:"";inset:0;top:var(--eyebrow-height);z-index:-2;pointer-events:none;background:color-mix(in oklch, var(--accent) 18%, var(--color-surface));border:2px solid var(--color-fg);border-radius:var(--section-frame-radius);transform-origin:100% 100%;box-shadow:2px 2px 0 color-mix(in oklch, var(--color-fg) 25%, transparent);transition:transform .2s ease-out;position:absolute;transform:translate(5px,-6px)rotate(-1.5deg)}[data-mode=creator] .section-card .section-eyebrow{transition:color .2s ease-out}@media (hover:hover) and (pointer:fine){[data-mode=creator] .section-card:hover:after{transform:translate(9px,-10px)rotate(-2.6deg)}[data-mode=creator] .section-card:active:after{transition-duration:.12s;transform:translate(2px,-2px)rotate(-.8deg)}}[data-mode=creator] .section-card:focus-visible:after{transform:translate(9px,-10px)rotate(-2.6deg)}@media (prefers-reduced-motion:reduce){[data-mode=creator] .section-card:before,[data-mode=creator] .section-card:after,[data-mode=creator] .section-card .section-eyebrow{transition:none}}[data-theme=dark][data-mode=creator] .section-card:before{border-color:color-mix(in oklch, var(--color-fg) 55%, transparent);box-shadow:inset 1px 1px #ffffff14;box-shadow:inset 1px 1px lab(100% 0 0/.08)}[data-theme=dark][data-mode=creator] .section-card:after{background:color-mix(in oklch, var(--accent) 32%, var(--color-surface));border-color:color-mix(in oklch, var(--color-fg) 55%, transparent);box-shadow:2px 2px 0 color-mix(in oklch, var(--accent) 45%, transparent), 0 6px 20px color-mix(in oklch, var(--accent) 18%, transparent)}[data-mode=creator] .section-card .section-eyebrow:after{content:"STAGE " counter(section, decimal-leading-zero);font-family:var(--font-pixel), var(--font-mono);letter-spacing:.14em;color:var(--accent-fg,#fff);background:var(--accent);pointer-events:none;padding:4px 8px;font-size:8px;font-weight:400;line-height:1;position:absolute;inset-block-start:50%;inset-inline-end:.625rem;transform:translateY(-50%);box-shadow:inset 1px 1px #ffffff47,inset -1px -1px #00000047}.section-card{isolation:isolate;border-radius:var(--section-frame-radius);--eyebrow-height:calc(2 * .5rem + 1.125rem);--section-content-inset:.5rem;--section-inner-radius:var(--radius-card);--section-frame-radius:calc(var(--section-inner-radius) + var(--section-content-inset));transition:background-color .2s var(--ease-out-quart), border-color .2s var(--ease-out-quart);background:0 0;border:1px solid #0000;position:relative}[data-mode=designer] .section-card{--section-frame-radius:var(--radius-card)}@media (min-width:768px){.section-card{--eyebrow-height:calc(2 * .55rem + 1.125rem);--section-content-inset:.625rem}}[data-mode=dev] .section-card{--dev-section-surface-top:color-mix(in oklch, var(--color-surface) 99%, #fff);--dev-section-surface-middle:var(--color-surface);--dev-section-surface-bottom:color-mix(in oklch, var(--color-surface) 97%, #000);--dev-section-edge-top:#ffffffb8}@supports (color:lab(0% 0 0)){[data-mode=dev] .section-card{--dev-section-surface-top:color-mix(in oklch, var(--color-surface) 99%, lab(100% 0 0));--dev-section-surface-bottom:color-mix(in oklch, var(--color-surface) 97%, lab(0% 0 0));--dev-section-edge-top:lab(100% 0 0/.72)}}[data-mode=dev] .section-card:before{content:"";inset:0;top:calc(var(--eyebrow-height) - 1px);z-index:-1;pointer-events:none;background:linear-gradient(to bottom, var(--dev-section-surface-top) 0%, var(--dev-section-surface-middle) 46%, var(--dev-section-surface-bottom) 100%);border:1px solid var(--color-line);border-radius:0 var(--section-frame-radius) var(--section-frame-radius) var(--section-frame-radius);transition:background-color .2s var(--ease-out-quart), border-color .2s var(--ease-out-quart), box-shadow .2s var(--ease-out-quart);position:absolute;box-shadow:inset 0 -1px #00000012,0 1px 2px #0000000a,0 10px 24px #0000000b;box-shadow:inset 0 -1px lab(0% 0 0/.07),0 1px 2px lab(0% 0 0/.04),0 10px 24px lab(0% 0 0/.045)}[data-theme=dark][data-mode=dev] .section-card{--dev-section-surface-top:color-mix(in oklch, var(--color-surface) 99%, #fff);--dev-section-surface-bottom:color-mix(in oklch, var(--color-surface) 90%, #000);--dev-section-edge-top:#ffffff12}@supports (color:lab(0% 0 0)){[data-theme=dark][data-mode=dev] .section-card{--dev-section-surface-top:color-mix(in oklch, var(--color-surface) 99%, lab(100% 0 0));--dev-section-surface-bottom:color-mix(in oklch, var(--color-surface) 90%, lab(0% 0 0));--dev-section-edge-top:lab(100% 0 0/.07)}}[data-theme=dark][data-mode=dev] .section-card:before{box-shadow:inset 0 -1px #00000047,0 1px 2px #00000029,0 12px 28px #0000002e;box-shadow:inset 0 -1px lab(0% 0 0/.28),0 1px 2px lab(0% 0 0/.16),0 12px 28px lab(0% 0 0/.18)}[data-mode=dev] .section-content>ul,[data-mode=dev] .section-content>ol{background:var(--color-bg);border-radius:var(--section-inner-radius);transition:background-color .2s var(--ease-out-quart)}[data-mode=designer] .section-card:before{content:"";inset:0;top:var(--eyebrow-height);z-index:-1;pointer-events:none;background:var(--color-surface);border:1px solid var(--color-line-strong);border-radius:var(--section-frame-radius);transition:top .2s var(--ease-out-quart), background-color .2s var(--ease-out-quart), border-color .2s var(--ease-out-quart);position:absolute}[data-mode=dev] .section-card h3{font-family:var(--font-mono);letter-spacing:-.02em}[data-theme=dark][data-mode=designer] .section-card:before{background:#fff;border-color:#00000029}[data-theme=dark][data-mode=designer] .section-card>:not(.section-eyebrow){--color-fg:#0a0a0a;--color-surface:#fff;--color-surface-2:#f4f4f3;--color-bg:#fbfbfa;--color-faint:#6e7080;--muted-foreground:#5b5d68;--color-line:#00000014;--color-line-strong:#00000029;color:#0a0a0a}[data-mode=designer] .section-card[data-selected=true]:before{box-shadow:0 0 0 2px var(--accent);border-color:var(--accent)}[data-mode=designer] .section-card[data-selected=true]>.section-eyebrow{color:var(--accent)}.section-card:focus-visible{outline:none}[data-mode=dev] .section-card:focus-visible:before,[data-mode=dev] .section-card:focus-visible .section-eyebrow-tab{border-color:var(--accent)}[data-mode=dev] .section-card:focus-visible .section-eyebrow{color:var(--accent)}[data-mode=designer] .section-card:focus-visible:before{box-shadow:0 0 0 2px var(--accent);border-color:var(--accent)}[data-mode=designer] .section-card:focus-visible>.section-eyebrow{color:var(--accent)}[data-mode=creator] .section-card:focus-visible:before{border-color:var(--accent)}[data-mode=creator] .section-card:focus-visible .section-eyebrow{color:var(--accent)}
