:root{--palette-brand-dark: #183c34;--palette-brand-accent: #2f9e7a;--palette-secondary: #5d7a74;--palette-background: #f3f5f2;--palette-white: #ffffff;--palette-muted: #6e7c77;--palette-neutral: #d9e1dd;--palette-success: #1f9d55;--palette-warning: #f2b544;--palette-danger: #d95c4f;--color-background: var(--palette-background);--color-surface: var(--palette-white);--color-surface-subtle: #eaf0eb;--color-text: var(--palette-brand-dark);--color-text-secondary: #506b64;--color-text-muted: #596b64;--color-border: var(--palette-neutral);--color-border-control: #84968e;--color-primary: var(--palette-brand-dark);--color-primary-hover: #245448;--color-primary-active: #102c25;--color-on-primary: var(--palette-white);--color-accent: var(--palette-brand-accent);--color-accent-text: #23785d;--color-focus: #23785d;--color-disabled: #e3e9e5;--color-on-disabled: #596b64;--color-success: var(--palette-success);--color-success-text: #176b3b;--color-success-surface: #e5f3e9;--color-warning: var(--palette-warning);--color-warning-text: #805008;--color-warning-surface: #fff2d9;--color-error: var(--palette-danger);--color-error-text: #a3362c;--color-error-surface: #fcebe8;--color-danger-action: #b43d32;--color-danger-hover: #983329;--color-selection: #cce8dc;--color-phrase-mint-surface: #eef8f4;--color-phrase-mint-border: #c6e5da;--color-phrase-mint-text: #245b4e;--color-phrase-lilac-surface: #f4f0fb;--color-phrase-lilac-border: #dfd2f2;--color-phrase-lilac-text: #63458b;--color-phrase-sky-surface: #edf5fa;--color-phrase-sky-border: #cbdfea;--color-phrase-sky-text: #315d76;--color-phrase-sand-surface: #fcf6e9;--color-phrase-sand-border: #ecddbc;--color-phrase-sand-text: #796027;--color-phrase-rose-surface: #fbf0f1;--color-phrase-rose-border: #edcfd5;--color-phrase-rose-text: #824957;--color-group-rudiments: #a6462c;--color-group-rudiments-surface: #ffebe2;--color-group-technique: #25696c;--color-group-technique-surface: #def1ef;--color-group-rhythms: #805008;--color-group-rhythms-surface: #fff2d9;--color-chart-active: #259e80;--color-chart-rest: #eb7062;--color-chart-fill: #e2f2ec;--color-chart-grid: #eaf0ed;--color-highlight-surface: #fff7ef;--color-highlight-text: #b95510;--color-hit-normal: var(--color-primary-hover);--color-hit-normal-surface: var(--color-success-surface);--color-hit-normal-text: var(--color-primary);--color-hit-accent: #e36945;--color-hit-accent-surface: #fff0e9;--color-hit-accent-text: #963b22;--color-hit-ghost: #7184e5;--color-hit-ghost-surface: #edf0ff;--color-hit-ghost-text: #3d4f9d;--color-hit-playhead: #d4eee3;--color-pulse: #ffc49e;--color-pulse-accent: #f39455;--color-pulse-active: #9b430f;--color-on-pulse: #71340f;--shadow-play: 0 0 0 4px var(--color-selection), 0 6px 28px rgb(47 158 122 / 30%);--font-size-tempo: clamp(3.5rem, 8vw, 6rem);--font-family-note: "Segoe Print", "Bradley Hand", cursive;--color-overlay: rgb(16 44 37 / 40%);--color-header-surface: rgb(243 245 242 / 96%);--color-photo-shade: rgb(16 44 37 / 88%);--color-photo-soft: rgb(16 44 37 / 35%);--color-inverse-muted: #dce7df;--color-inverse-accent: #b9ddc8;--font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-md: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.5rem;--font-size-2xl: 2rem;--font-size-display: clamp(2rem, 3.8vw, 3.25rem);--font-size-hero: clamp(3.2rem, 6.8vw, 6.5rem);--font-size-feature: clamp(2.25rem, 4vw, 3.75rem);--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.1;--line-height-heading: 1.25;--line-height-body: 1.6;--letter-spacing-heading: -.045em;--letter-spacing-eyebrow: .2em;--space-0: 0;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--space-32: 8rem;--radius-sm: .375rem;--radius-md: .75rem;--radius-lg: 1.25rem;--radius-xl: 2rem;--radius-full: 999px;--border-width: 1px;--focus-width: 3px;--focus-offset: 3px;--shadow-card: 0 8px 32px rgb(24 60 52 / 5%);--shadow-inset: inset 0 2px 8px rgb(24 60 52 / 10%);--shadow-brand: 0 24px 60px rgb(24 60 52 / 16%);--duration-fast: .12s;--duration-normal: .2s;--duration-slow: .4s;--duration-reveal: 1s;--ease-reveal: cubic-bezier(.45, 0, .55, 1);--ease-standard: cubic-bezier(.2, 0, 0, 1);--z-base: 0;--z-sticky: 10;--z-overlay: 100;--z-toast: 200;--container-width: 72rem;--page-gutter: clamp(1.25rem, 4vw, 3rem);--control-height: 3rem}@media(prefers-reduced-motion:reduce){:root{--duration-fast: 0ms;--duration-normal: 0ms;--duration-slow: 0ms}}@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/inter-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/inter-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}*,*:before,*:after{box-sizing:border-box}body{margin:0;background:var(--color-background);color:var(--color-text);font-family:var(--font-family);font-size:var(--font-size-md);line-height:var(--line-height-body)}button,input,select,textarea{font:inherit}img,svg{max-inline-size:100%;vertical-align:middle}a{color:var(--color-accent-text);text-underline-offset:.2em}:focus-visible{outline:var(--focus-width) solid var(--color-focus);outline-offset:var(--focus-offset)}::selection{background:var(--color-selection);color:var(--color-text)}.container{inline-size:min(100% - var(--page-gutter) * 2,var(--container-width));margin-inline:auto}.eyebrow{margin:0;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:var(--letter-spacing-eyebrow);text-transform:uppercase;color:var(--color-text-secondary)}.heading{margin:0;line-height:var(--line-height-heading);letter-spacing:var(--letter-spacing-heading);font-weight:var(--font-weight-semibold)}.heading--display{font-size:var(--font-size-display);line-height:var(--line-height-tight)}.heading--section{font-size:var(--font-size-xl)}.text-muted{color:var(--color-text-muted)}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);min-block-size:var(--control-height);padding:var(--space-3) var(--space-5);border:var(--border-width) solid transparent;border-radius:var(--radius-md);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);line-height:var(--line-height-heading);text-decoration:none;cursor:pointer;transition:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}.button--primary{color:var(--color-on-primary);background:var(--color-primary)}.button--primary:hover:not(:disabled){background:var(--color-primary-hover)}.button--primary:active:not(:disabled){background:var(--color-primary-active)}.button--inverse{color:var(--color-primary);background:var(--color-on-primary)}.button--inverse:hover:not(:disabled){background:var(--color-selection)}.button--secondary{color:var(--color-text);background:var(--color-surface);border-color:var(--color-border-control)}.button--secondary:hover:not(:disabled){background:var(--color-surface-subtle)}.button--ghost{color:inherit;background:transparent;border-color:transparent}.button--ghost:hover:not(:disabled){color:var(--color-text);background:var(--color-surface-subtle)}.button--nav{justify-content:start;gap:var(--space-3);padding:var(--space-2) var(--space-3);text-align:start;color:var(--color-text-secondary);background:transparent;border-color:transparent;font-weight:var(--font-weight-medium)}.button--nav:hover:not(:disabled){color:var(--color-text);background:var(--color-surface-subtle)}.button--nav[aria-pressed=true]{color:var(--color-primary);background:var(--color-surface-subtle);font-weight:var(--font-weight-bold)}.button--nav[aria-pressed=true]:hover:not(:disabled){background:var(--color-selection)}.button--nav .badge{margin-inline-start:auto;font-variant-numeric:tabular-nums}.button--nav[aria-pressed=true] .badge{color:var(--color-on-primary);background:var(--color-primary)}.button--toggle{color:var(--color-text);background:var(--color-surface-subtle);border-color:var(--color-border-control)}.button--toggle:hover:not(:disabled){background:var(--color-selection)}.button--toggle[aria-pressed=true]:not(:disabled){color:var(--color-on-primary);background:var(--color-primary);border-color:var(--color-on-primary);box-shadow:inset 0 0 0 var(--border-width) var(--color-on-primary)}.button--toggle[aria-pressed=true]:hover:not(:disabled){background:var(--color-primary-hover)}.hit-tone{--hit-color: var(--color-hit-normal);--hit-surface: var(--color-hit-normal-surface);--hit-text: var(--color-hit-normal-text)}.hit-tone[data-hit="^"]{--hit-color: var(--color-hit-accent);--hit-surface: var(--color-hit-accent-surface);--hit-text: var(--color-hit-accent-text)}.hit-tone[data-hit=g],.hit-tone[data-hit=q]{--hit-color: var(--color-hit-ghost);--hit-surface: var(--color-hit-ghost-surface);--hit-text: var(--color-hit-ghost-text)}.button--dynamic{background:var(--hit-surface);color:var(--hit-text);border-color:var(--hit-color);gap:var(--space-2)}.button--dynamic:hover:not(:disabled){box-shadow:inset 0 0 0 var(--border-width) var(--hit-color)}.button--dynamic[aria-pressed=true]:not(:disabled){box-shadow:inset 0 0 0 var(--border-width) var(--hit-color);text-decoration:underline;text-underline-offset:var(--space-1)}.button--dynamic[data-hit="-"][aria-pressed=true]:not(:disabled){background:var(--color-primary);color:var(--color-on-primary)}.button__dynamic-dot{display:grid;place-items:center;flex-shrink:0;inline-size:var(--space-4);block-size:var(--space-4);border-radius:var(--radius-full);background:var(--hit-color);color:var(--color-on-primary);line-height:1}.button--dynamic[data-hit="-"][aria-pressed=true] .button__dynamic-dot{background:var(--color-inverse-accent)}.button--danger{color:var(--color-on-primary);background:var(--color-danger-action)}.button--danger:hover:not(:disabled){background:var(--color-danger-hover)}.button--danger-soft{color:var(--color-error-text);background:var(--color-error-surface)}.button--danger-soft:hover:not(:disabled){color:var(--color-on-primary);background:var(--color-danger-action)}.button--dashed{color:var(--color-primary);background:var(--color-surface);border:var(--border-width) dashed var(--color-border-control)}.button--dashed:hover:not(:disabled){background:var(--color-success-surface);border-color:var(--color-primary)}.button:disabled{color:var(--color-on-disabled);background:var(--color-disabled);border-color:var(--color-border);cursor:not-allowed}.button--icon{inline-size:var(--space-16);block-size:var(--space-16);padding:0;border-radius:var(--radius-full);flex-shrink:0}.button--chip{border-radius:var(--radius-full);padding-inline:var(--space-4);gap:var(--space-2)}.button--badge{min-block-size:var(--space-6);padding:var(--space-1) var(--space-2);gap:var(--space-1);border-radius:var(--radius-full);font-size:var(--font-size-xs)}.button--badge app-action-icon{inline-size:var(--space-3);block-size:var(--space-3)}.button--choice{position:relative;color:var(--color-text);background:var(--color-surface);border-color:var(--color-border-control)}.button--choice:hover{background:var(--color-surface-subtle)}.button--choice:has(:checked){color:var(--color-on-primary);background:var(--color-primary);border-color:var(--color-primary)}.button--choice:has(:checked):hover{background:var(--color-primary-hover)}.button--choice:has(:focus-visible){outline:var(--focus-width) solid var(--color-focus);outline-offset:var(--focus-offset)}.button__choice-input{position:absolute;inset:0;inline-size:100%;block-size:100%;margin:0;opacity:0;cursor:pointer}.button--icon-compact{inline-size:var(--control-height);block-size:var(--control-height)}.button--icon-small{inline-size:var(--space-8);block-size:var(--space-8);min-block-size:var(--space-8)}.button--tile{border-radius:var(--radius-md)}.button--mint:not(:disabled){background:var(--color-success-surface);color:var(--color-primary);border-color:var(--color-selection)}.button--mint:hover:not(:disabled){background:var(--color-selection)}.button--play{inline-size:var(--space-20);block-size:var(--space-20);border-width:var(--focus-width)}.button--play:not(:disabled){background:linear-gradient(135deg,var(--color-primary-hover),var(--color-primary));border-color:var(--color-on-primary);box-shadow:var(--shadow-play)}.button--play:hover:not(:disabled){background:var(--color-primary-hover)}.button--play .button__icon{inline-size:var(--space-8);block-size:var(--space-8)}.control-heading{display:flex;align-items:start;gap:var(--space-3)}.control-heading__icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;inline-size:var(--space-6);block-size:var(--space-6);border-radius:var(--radius-full);background:var(--color-warning-surface);color:var(--color-pulse-active)}.control-heading__icon svg{inline-size:var(--space-4);block-size:var(--space-4)}.control-heading__title{display:block;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);line-height:var(--line-height-heading)}.control-heading__hint{display:block;margin-block-start:var(--space-1);color:var(--color-text-secondary);font-size:var(--font-size-xs)}.control-heading--panel .control-heading__icon{inline-size:var(--space-10);block-size:var(--space-10);border-radius:var(--radius-md)}.control-heading--panel .control-heading__icon--mint{color:var(--color-primary);background:var(--color-selection)}.control-heading--panel .control-heading__hint{margin-block-end:0}.button__icon{inline-size:var(--space-6);block-size:var(--space-6)}.button-row{display:flex;flex-wrap:wrap;gap:var(--space-3)}.button-row--compact{gap:var(--space-2)}.switch{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);inline-size:100%;min-block-size:var(--control-height);padding:0;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--color-text);font-size:var(--font-size-sm);text-align:start;cursor:pointer}.switch__track{display:flex;align-items:center;flex-shrink:0;inline-size:var(--space-12);block-size:var(--space-6);padding:var(--space-1);border-radius:var(--radius-full);background:var(--color-disabled);box-shadow:inset 0 0 0 var(--border-width) var(--color-border-control);transition:background var(--duration-fast) var(--ease-standard)}.switch__thumb{inline-size:var(--space-4);block-size:var(--space-4);border-radius:var(--radius-full);background:var(--color-on-primary);box-shadow:var(--shadow-card);transition:transform var(--duration-fast) var(--ease-standard)}.switch[aria-checked=true] .switch__track{background:var(--color-primary);box-shadow:none}.switch[aria-checked=true] .switch__thumb{transform:translate(var(--space-6))}.switch:hover:not(:disabled) .switch__track{box-shadow:inset 0 0 0 var(--border-width) var(--color-text-secondary)}.card{padding:var(--space-6);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-card)}.inset-panel{padding:var(--space-4);background:var(--color-surface-subtle);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-md)}.badge{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);background:var(--color-surface-subtle)}.badge--success{color:var(--color-success-text);background:var(--color-success-surface)}.alert{display:flex;align-items:baseline;gap:var(--space-3);padding:var(--space-4);border-radius:var(--radius-md);font-size:var(--font-size-sm);background:var(--color-surface-subtle);color:var(--color-text-secondary)}.alert--success{color:var(--color-success-text);background:var(--color-success-surface)}.alert--warning{color:var(--color-warning-text);background:var(--color-warning-surface)}.alert--error{color:var(--color-error-text);background:var(--color-error-surface)}.divider{border:0;border-block-start:var(--border-width) solid var(--color-border);margin-block:var(--space-6)}.dialog{inline-size:min(28rem,100% - var(--space-8));max-block-size:calc(100% - var(--space-8));padding:var(--space-6);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);color:var(--color-text);box-shadow:var(--shadow-brand)}.dialog::backdrop{background:var(--color-overlay)}.switch:disabled{color:var(--color-text-muted);cursor:not-allowed}.badge--category{color:var(--category-text, var(--color-text-secondary));background:var(--category-surface, var(--color-surface-subtle))}.badge--category[data-group=basic],.badge--category[data-group=latin]{--category-text: var(--color-success-text);--category-surface: var(--color-success-surface)}.badge--category[data-group=rock],.badge--category[data-group=rudiments]{--category-text: var(--color-group-rudiments);--category-surface: var(--color-group-rudiments-surface)}.badge--category[data-group=pop],.badge--category[data-group=technique]{--category-text: var(--color-group-technique);--category-surface: var(--color-group-technique-surface)}.badge--category[data-group=funk],.badge--category[data-group=rhythms]{--category-text: var(--color-warning-text);--category-surface: var(--color-warning-surface)}.badge--category[data-group=jazz],.badge--category[data-group=electronic]{--category-text: var(--color-hit-ghost-text);--category-surface: var(--color-hit-ghost-surface)}.badge--category[data-group=metal]{--category-text: var(--color-primary);--category-surface: var(--color-selection)}.button--toggle-surface:not([aria-pressed=true]){background:var(--color-surface);border-color:var(--color-border)}.button--toggle-surface:not([aria-pressed=true]):hover{background:var(--color-selection)}.button__letter-mark{display:grid;place-items:center;flex-shrink:0;inline-size:var(--space-5);block-size:var(--space-5);border-radius:var(--radius-full);background:var(--color-surface-subtle);color:var(--color-text-secondary);line-height:1}.button[aria-pressed=true] .button__letter-mark{background:transparent;color:inherit;box-shadow:inset 0 0 0 var(--border-width) currentColor}.button--dynamic-soft[data-hit="-"][aria-pressed=true]:not(:disabled){background:var(--hit-surface);color:var(--hit-text);text-decoration:none}.button--dynamic-soft[data-hit="-"][aria-pressed=true] .button__dynamic-dot{background:var(--hit-color)}.button--mix{inline-size:2.75rem;min-block-size:2.75rem;padding:0;border:0;border-radius:0;background:transparent;color:var(--color-text-secondary);touch-action:manipulation}.button__mix-mark{display:grid;place-items:center;inline-size:var(--space-6);block-size:var(--space-6);border-radius:var(--radius-full);background:var(--color-disabled)}.button--mix:hover .button__mix-mark{background:var(--color-selection)}.button--mix[aria-pressed=true] .button__mix-mark{background:var(--color-primary);color:var(--color-on-primary);box-shadow:inset 0 0 0 var(--border-width) var(--color-on-primary);text-decoration:underline}.button--mix:focus-visible{outline-offset:calc(-1 * var(--focus-width))}.page-heading{position:relative;isolation:isolate;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-4);padding-block:var(--space-3);margin-block-end:var(--space-6)}.page-heading__wave{position:absolute;z-index:-1;inset:0 0 0 auto;inline-size:45%;background:radial-gradient(ellipse at bottom right,var(--color-selection),transparent 70%);pointer-events:none}.page-heading__intro{margin:var(--space-2) 0 0;font-size:var(--font-size-sm)}.page-heading__motto{max-inline-size:9rem;font-family:var(--font-family-note);font-style:italic;color:var(--color-text-secondary);transform:rotate(-9deg);text-align:center}.page-heading__motto:after{content:"";display:block;inline-size:var(--space-8);block-size:var(--space-1);background:var(--color-pulse-accent);border-radius:var(--radius-full);margin:var(--space-3) auto 0}@media(max-width:64rem){.page-heading__motto{display:none}}@media(max-width:40rem){.page-heading>a{min-block-size:var(--control-height)}}[data-group-color=mint]{--phrase-surface: var(--color-phrase-mint-surface);--phrase-border: var(--color-phrase-mint-border);--phrase-text: var(--color-phrase-mint-text)}[data-group-color=lilac]{--phrase-surface: var(--color-phrase-lilac-surface);--phrase-border: var(--color-phrase-lilac-border);--phrase-text: var(--color-phrase-lilac-text)}[data-group-color=sky]{--phrase-surface: var(--color-phrase-sky-surface);--phrase-border: var(--color-phrase-sky-border);--phrase-text: var(--color-phrase-sky-text)}[data-group-color=sand]{--phrase-surface: var(--color-phrase-sand-surface);--phrase-border: var(--color-phrase-sand-border);--phrase-text: var(--color-phrase-sand-text)}[data-group-color=rose]{--phrase-surface: var(--color-phrase-rose-surface);--phrase-border: var(--color-phrase-rose-border);--phrase-text: var(--color-phrase-rose-text)}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:var(--space-5)}.field{display:grid;align-content:start;gap:var(--space-2);min-inline-size:0}.field__label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold)}.field__hint,.field__error{margin:0;font-size:var(--font-size-xs)}.field__hint{color:var(--color-text-muted)}.field__error{color:var(--color-error-text)}.control{inline-size:100%;min-block-size:var(--control-height);min-inline-size:0;padding:var(--space-3) var(--space-4);border:var(--border-width) solid var(--color-border-control);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);transition:border-color var(--duration-fast) var(--ease-standard)}.control::placeholder{color:var(--color-text-muted);opacity:1}.control--compact{min-block-size:var(--space-8);padding:var(--space-1) var(--space-2);font-size:var(--font-size-sm);border-radius:var(--radius-sm)}.control:hover:not(:disabled):not([readonly]):not([aria-invalid=true]){border-color:var(--color-text-secondary)}.control:focus-visible{border-color:var(--color-focus)}.control[aria-invalid=true]{border-color:var(--color-error-text)}.control:disabled{color:var(--color-on-disabled);background:var(--color-disabled);cursor:not-allowed}.control[readonly]{background:var(--color-surface-subtle)}.control--range{accent-color:var(--color-primary);padding-inline:0;cursor:pointer}textarea.control{min-block-size:8rem;resize:vertical}.check{display:flex;align-items:center;gap:var(--space-3);min-block-size:var(--control-height);font-size:var(--font-size-sm);cursor:pointer}.check:has(:disabled){color:var(--color-text-muted);cursor:not-allowed}.form-stack{display:grid;gap:var(--space-5)}.password-control{display:flex;gap:var(--space-2)}.password-control .control{flex:1}.password-control .button{flex-shrink:0}.control-with-icon{position:relative;display:block;min-inline-size:0}.control-with-icon>app-action-icon,.control-with-icon>app-note-value-icon{position:absolute;inset-inline-start:var(--space-3);inset-block-start:50%;transform:translateY(-50%);pointer-events:none;color:var(--color-primary)}.control-with-icon>.control{padding-inline-start:var(--space-10)}.auth-layout{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:var(--space-16);padding-block:var(--space-16);min-block-size:calc(100svh - 12rem)}.auth-layout__intro{max-inline-size:32rem}.auth-layout__intro h1{margin-top:var(--space-6)}.auth-layout__intro h1 span{color:var(--color-accent-text)}.auth-layout__description{font-size:var(--font-size-lg);color:var(--color-text-secondary);margin-block:var(--space-6) var(--space-10)}.auth-layout__signature{display:flex;align-items:center;gap:var(--space-5);color:var(--color-text-secondary);font-size:var(--font-size-sm);max-inline-size:24rem}.auth-layout__signature img{border-radius:var(--radius-lg);flex-shrink:0}.auth-layout__card{padding:clamp(1.5rem,4vw,3rem);inline-size:100%;max-inline-size:32rem;justify-self:end}.auth-layout__card h2{margin-top:var(--space-3)}.auth-layout__card form{margin-top:var(--space-8)}@media(max-width:48rem){.auth-layout{grid-template-columns:1fr;gap:var(--space-8);padding-block:var(--space-8)}.auth-layout__intro{max-inline-size:none}.auth-layout__signature{display:none}.auth-layout__description{margin-bottom:0}.auth-layout__card{justify-self:center;max-inline-size:none}}.auth-layout__switch{margin-top:var(--space-6);text-align:center;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.scroll-reveal{opacity:1;transition:opacity var(--duration-reveal) var(--ease-reveal)}.scroll-reveal.is-hidden{opacity:0}.scroll-reveal.is-hidden:focus-visible,.scroll-reveal.is-hidden:has(:focus-visible){opacity:1}@media(prefers-reduced-motion:reduce){.scroll-reveal{opacity:1;transition:none}.scroll-reveal.is-hidden{opacity:1}}@media print{.scroll-reveal.is-hidden{opacity:1}}