@import url("https://api.fontshare.com/v2/css?f[]=satoshi@400,500,700,900&display=swap");:root{--font-family-primary:"Satoshi",system-ui,"-apple-system","Segoe UI","Roboto","Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-size-base:16px;--font-weight-base:400;--line-height-base:24px;--font-size-xs:14px;--font-size-sm:16px;--font-size-md:18px;--font-size-lg:20px;--font-size-xl:21.4px;--font-size-2xl:22.8px;--font-size-3xl:36.8px;--font-size-4xl:50.8px;--font-weight-regular:400;--font-weight-medium:500;--font-weight-bold:700;--font-weight-black:900;--color-text-primary:#17211b;--color-surface-muted:#f6f8f6;--color-text-tertiary:#15803d;--color-text-inverse:#64748b;--color-surface-base:#fff;--color-surface-raised:#d8ffcb;--color-surface-strong:#16a34a;--color-bg-page:var(--color-surface-base);--color-bg-surface:var(--color-surface-muted);--color-bg-surface-raised:var(--color-surface-raised);--color-bg-accent:var(--color-surface-strong);--color-fg-default:var(--color-text-primary);--color-fg-muted:var(--color-text-inverse);--color-fg-accent:var(--color-text-tertiary);--color-fg-on-accent:#fff;--color-border-default:#dde5df;--color-border-strong:var(--color-surface-strong);--color-danger:#dc2626;--color-danger-surface:#fef2f2;--color-success:#16a34a;--color-success-surface:#ecfdf3;--color-focus-ring:#16a34a;--space-1:2px;--space-2:4px;--space-3:8px;--space-4:12px;--space-5:16px;--space-6:18px;--space-7:24px;--space-8:32px;--radius-xs:8px;--radius-sm:12px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px;--radius-2xl:48px;--radius-step7:50px;--shadow-1:hsla(0,0%,100%,.35) 0px 0px 32px 0px;--motion-duration-instant:100ms;--motion-duration-fast:200ms;--motion-duration-normal:300ms;--motion-ease-standard:cubic-bezier(0.4,0,0.2,1);--content-max-width:1280px;--container-padding-inline:var(--space-7);--header-height:84px}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{background-color:var(--color-bg-page);color:var(--color-fg-default);font-family:var(--font-family-primary);font-size:var(--font-size-base);font-weight:var(--font-weight-base);line-height:var(--line-height-base);-webkit-font-smoothing:antialiased;min-height:100dvh}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit;color:inherit}button{background:none;border:none;cursor:pointer}a{color:inherit;text-decoration:none}ol,ul{list-style:none}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}-------------------------------------------------------------:focus { outline:none; }:focus-visible { outline:2px solid var(--color-focus-ring); outline-offset:2px; border-radius:var(--radius-xs); } h1,.text-h1 { font-size:var(--font-size-4xl); font-weight:var(--font-weight-black); line-height:1.1; letter-spacing:-0.02em; color:var(--color-fg-default); } h2,.text-h2 { font-size:var(--font-size-3xl); font-weight:var(--font-weight-bold); line-height:1.15; letter-spacing:-0.01em; color:var(--color-fg-default); } h3,.text-h3 { font-size:var(--font-size-2xl); font-weight:var(--font-weight-bold); line-height:1.25; color:var(--color-fg-default); } h4,.text-h4 { font-size:var(--font-size-xl); font-weight:var(--font-weight-medium); line-height:1.3; color:var(--color-fg-default); } h5,.text-h5 { font-size:var(--font-size-lg); font-weight:var(--font-weight-medium); line-height:1.35; color:var(--color-fg-default); } h6,.text-h6,.text-eyebrow { font-size:var(--font-size-md); font-weight:var(--font-weight-medium); line-height:1.4; color:var(--color-fg-muted); text-transform:uppercase; letter-spacing:0.06em; } p,.text-body { font-size:var(--font-size-sm); font-weight:var(--font-weight-regular); line-height:var(--line-height-base); color:var(--color-fg-default); } .text-body-muted { font-size:var(--font-size-sm); line-height:var(--line-height-base); color:var(--color-fg-muted); } .text-caption,small { font-size:var(--font-size-xs); line-height:1.4; color:var(--color-fg-muted); } .text-accent { color:var(--color-fg-accent); } a,.text-link { color:var(--color-fg-default); text-decoration:underline; text-underline-offset:3px; transition:color var(--motion-duration-fast) var(--motion-ease-standard); } a:hover { color:var(--color-fg-muted); } a:focus-visible { outline:2px solid var(--color-focus-ring); outline-offset:2px; } .container { width:100%; max-width:var(--content-max-width); margin-inline:auto; padding-inline:var(--container-padding-inline); } .stack>*+* { margin-top:var(--space-5); } .surface { background-color:var(--color-bg-surface); border-radius:var(--radius-md); padding:var(--space-6); } .surface-raised { background-color:var(--color-bg-surface-raised); color:var(--color-fg-on-accent); border-radius:var(--radius-md); padding:var(--space-6); } .btn { display:inline-flex; align-items:center; justify-content:center; gap:var(--space-3); min-height:44px; padding:var(--space-4) var(--space-6); border-radius:var(--radius-sm); font-size:var(--font-size-sm); font-weight:var(--font-weight-medium); border:1px solid transparent; transition:background-color var(--motion-duration-fast) var(--motion-ease-standard),border-color var(--motion-duration-fast) var(--motion-ease-standard),transform var(--motion-duration-instant) var(--motion-ease-standard); user-select:none; touch-action:manipulation; } .btn-primary { background-color:var(--color-bg-accent); color:var(--color-fg-on-accent); } .btn-primary:hover { background-color:#3a9b1a; } .btn-primary:focus-visible { outline:2px solid var(--color-focus-ring); outline-offset:2px; } .btn-primary:active { background-color:#2f7d16; transform:scale(0.98); } .btn-primary:disabled,.btn-primary[aria-disabled="true"] { background-color:var(--color-surface-muted); color:var(--color-fg-muted); cursor:not-allowed; pointer-events:none; } .btn-primary[data-loading="true"] { color:transparent; position:relative; pointer-events:none; } .btn-primary[data-loading="true"]::after { content:""; position:absolute; width:16px; height:16px; border-radius:50%; border:2px solid var(--color-fg-on-accent); border-top-color:transparent; animation:btn-spin var(--motion-duration-normal) linear infinite; } .btn-secondary { background-color:transparent; border-color:var(--color-border-default); color:var(--color-fg-default); } .btn-secondary:hover { border-color:var(--color-fg-default); background-color:var(--color-surface-muted); } .btn-secondary:focus-visible { outline:2px solid var(--color-focus-ring); outline-offset:2px; } .btn-secondary:active { transform:scale(0.98); } .btn-secondary:disabled { border-color:var(--color-border-default); color:var(--color-fg-muted); cursor:not-allowed; opacity:0.5; pointer-events:none; } .btn-danger { background-color:var(--color-danger); color:#ffffff; } .btn-danger:hover { background-color:#e04545; } .btn-danger:focus-visible { outline:2px solid var(--color-focus-ring); outline-offset:2px; } @keyframes btn-spin { to { transform:rotate(360deg); } } .field { display:flex; flex-direction:column; gap:var(--space-2); } .field-label { font-size:var(--font-size-xs); font-weight:var(--font-weight-medium); color:var(--color-fg-default); } .input { min-height:44px; padding:var(--space-4) var(--space-5); background-color:var(--color-surface-muted); border:1px solid var(--color-border-default); border-radius:var(--radius-xs); color:var(--color-fg-default); font-size:var(--font-size-sm); transition:border-color var(--motion-duration-fast) var(--motion-ease-standard); } .input::placeholder { color:var(--color-fg-muted); } .input:hover { border-color:var(--color-fg-muted); } .input:focus-visible,.input:focus { outline:none; border-color:var(--color-focus-ring); box-shadow:0 0 0 2px var(--color-focus-ring); } .input:disabled { opacity:0.5; cursor:not-allowed; } .input[aria-invalid="true"],.input.input-error { border-color:var(--color-danger); } .field-error { font-size:var(--font-size-xs); color:var(--color-danger); } .card { background-color:var(--color-bg-surface); border:1px solid var(--color-border-default); border-radius:var(--radius-md); padding:var(--space-7); transition:box-shadow var(--motion-duration-fast) var(--motion-ease-standard),border-color var(--motion-duration-fast) var(--motion-ease-standard); } .card:hover { border-color:var(--color-border-strong); box-shadow:var(--shadow-1); } .card:focus-within { outline:2px solid var(--color-focus-ring); outline-offset:2px; } .card-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:var(--space-4); padding:var(--space-8); color:var(--color-fg-muted); border:1px dashed var(--color-border-default); border-radius:var(--radius-md); } .text-truncate { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .text-clamp-2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } .nav { display:flex; align-items:center; justify-content:space-between; gap:var(--space-7); padding-block:var(--space-5); } .nav-link { font-size:var(--font-size-sm); color:var(--color-fg-muted); text-decoration:none; padding:var(--space-3) var(--space-4); border-radius:var(--radius-xs); transition:color var(--motion-duration-fast) var(--motion-ease-standard); } .nav-link:hover { color:var(--color-fg-default); } .nav-link:focus-visible { outline:2px solid var(--color-focus-ring); outline-offset:2px; } .nav-link[aria-current="page"] { color:var(--color-fg-default); font-weight:var(--font-weight-medium); } @media (max-width:768px) {:root { --container-padding-inline:var(--space-5); } h1,.text-h1 { font-size:var(--font-size-3xl); } h2,.text-h2 { font-size:var(--font-size-2xl); } .nav { flex-wrap:wrap; gap:var(--space-4); } }