:root{--ink: #141414;--ink-soft: #262626;--accent: #0066ff;--on-primary: #ffffff;--canvas: #ffffff;--canvas-soft: #f3f3f3;--field: #f0f0f0;--hairline-soft: #f0f0f0;--hairline: #e0e0e0;--muted: #707070;--faint: #adadad;--font: "Inter", "Inter Variable", -apple-system, "Helvetica Neue", Arial, sans-serif;--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;--w-heading: 650;--w-link: 600;--w-body: 450;--w-light: 300;--t-mark: 44px;--t-h1: 32px;--t-h2: 24px;--t-h3: 20px;--t-h4: 17px;--t-title: 15px;--t-body-lg: 17px;--t-body: 15px;--t-body-sm: 13px;--t-label: 11px;--s-xxs: 4px;--s-xs: 8px;--s-sm: 12px;--s-md: 16px;--s-lg: 24px;--s-xl: 32px;--s-xxl: 48px;--s-section: 80px;--pad-card: 20px;--r-sm: 16px;--r-md: 24px;--r-full: 9999px;--r-squircle: 30%;--cta-bg: #141414;--cta-fg: #ffffff;--footer-bg: #141414;--footer-fg: #ffffff;--pill-h: 36px;--cta-h: 44px;--nav-h: 56px;--chip: 40px;--tile-h: 64px;font-family:var(--font);color:var(--ink);background:var(--canvas);font-synthesis:none;text-rendering:optimizeLegibility;color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{margin:0;min-width:320px;min-height:100vh;background:var(--canvas);color:var(--ink);font-size:var(--t-body);font-weight:var(--w-body);line-height:1.4;-webkit-font-smoothing:antialiased}h1,h2,h3,h4{font-weight:var(--w-heading);letter-spacing:0;line-height:1.15;text-wrap:balance;margin:0}h1{line-height:1.05}button,input,select{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:var(--r-sm)}::selection{background:var(--ink);color:var(--on-primary)}.app-shell{min-height:100vh;background:var(--canvas)}.pill-button,.dark-pill,.wide-secondary,.compile-button,.download-button,.contract-toolbar button,.palette-actions button,.utility-actions button,.output-tabs button,.input-tabs button,.contract-index button{border-radius:var(--r-full);font-weight:var(--w-link);font-size:var(--t-body-sm);transition:background-color .18s ease,color .18s ease,border-color .18s ease}.dark-pill,.compile-button,.download-button,.contract-toolbar .download-button{background:var(--cta-bg);color:var(--cta-fg);border:1px solid var(--cta-bg)}.dark-pill:hover,.compile-button:hover,.download-button:hover{filter:brightness(1.35) contrast(1.1)}.pill-button,.wide-secondary,.contract-toolbar button{background:var(--canvas);color:var(--ink);border:1px solid var(--hairline)}.pill-button:hover,.wide-secondary:hover,.contract-toolbar button:hover{background:var(--canvas-soft)}.palette-actions button,.utility-actions button{background:var(--canvas-soft);color:var(--ink);border:0}.palette-actions button:hover,.utility-actions button:hover{background:var(--hairline)}.sidebar .palette-actions button,.sidebar .wide-secondary{background:var(--canvas)}.sidebar .palette-actions button:hover,.sidebar .wide-secondary:hover{background:#fff9}.topbar{position:sticky;top:var(--s-sm);z-index:40;margin:var(--s-sm) auto var(--s-lg);width:max-content;max-width:calc(100% - var(--s-lg));height:var(--nav-h);display:flex;align-items:center;gap:var(--s-md);padding:0 var(--s-xs) 0 var(--s-md);background:var(--canvas-soft);border-radius:var(--r-full);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.wordmark{display:inline-flex;align-items:center;gap:var(--s-xs);text-decoration:none;color:var(--ink);font-size:var(--t-h4);font-weight:var(--w-heading)}.logo-mark{width:28px;height:28px;display:grid;place-items:center;border-radius:var(--r-squircle);background:var(--ink);color:var(--on-primary)}.logo-mark svg{width:16px;height:16px}.main-nav{display:flex;align-items:center;gap:2px}.main-nav button{display:grid;place-items:center;height:32px;padding:0 var(--s-sm);border-radius:var(--r-full);color:var(--muted);text-decoration:none;font-size:var(--t-body-sm);font-weight:var(--w-link);transition:background-color .18s ease,color .18s ease}.main-nav button:hover,.main-nav button.active{color:var(--ink);background:var(--canvas)}.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:var(--s-xs)}.topbar button:not(.dark-pill):not(.pill-button){border:0;background:transparent}.text-button{font-size:var(--t-body-sm);font-weight:var(--w-link);color:var(--muted);padding:0 var(--s-xs);text-decoration:none;line-height:var(--pill-h)}.text-button:hover{color:var(--ink)}.icon-button{width:32px;height:32px;border-radius:var(--r-full);display:grid;place-items:center;font-size:15px;color:var(--muted)}.icon-button:hover{background:var(--canvas);color:var(--ink)}.pill-button,.dark-pill{height:var(--pill-h);padding:0 var(--s-sm);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.badge-popular{background:var(--accent);color:var(--on-primary);font-size:10px;font-weight:var(--w-link);line-height:1.4;padding:2px 6px;border-radius:var(--r-full)}.mobile-export{display:none}.app-grid{width:min(1440px,calc(100% - var(--s-xl)));margin:0 auto;display:grid;grid-template-columns:360px minmax(0,1fr);gap:var(--s-md);align-items:start}.sidebar{position:sticky;top:calc(var(--nav-h) + var(--s-lg));background:var(--canvas-soft);border:0;border-radius:var(--r-md);padding:var(--pad-card);max-height:calc(100vh - var(--nav-h) - var(--s-xl));overflow:auto}.sidebar>h2{font-size:var(--t-h3);line-height:1.2}.sidebar-sub{margin:var(--s-xxs) 0 var(--s-md);color:var(--muted);font-size:var(--t-body-sm);font-weight:var(--w-light);line-height:1.45}.input-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:#1414140d;border-radius:var(--r-full);padding:3px;margin-bottom:var(--s-md)}.input-tabs button{height:32px;border:0;background:transparent;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;gap:5px}.input-tabs button svg{width:15px;height:15px}.input-tabs button.active{background:var(--canvas);color:var(--ink);box-shadow:0 1px 2px #1414140f}.image-drop{width:100%;aspect-ratio:4 / 3;box-shadow:inset 0 0 0 1px #1414140d;border:0;padding:0;border-radius:var(--r-sm);overflow:hidden;position:relative;background:var(--canvas-soft);display:block}.image-drop img{width:100%;height:100%;display:block;object-fit:cover}.image-overlay{position:absolute;left:50%;bottom:var(--s-sm);transform:translate(-50%);display:inline-flex;align-items:center;gap:6px;background:#7373738f;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--on-primary);padding:6px var(--s-sm);border-radius:var(--r-full);font-size:var(--t-label);font-weight:var(--w-link);opacity:0;transition:opacity .18s ease;white-space:nowrap}.image-overlay svg{width:14px;height:14px}.image-drop:hover .image-overlay,.image-drop:focus-visible .image-overlay{opacity:1}.wide-secondary{width:100%;height:var(--pill-h);margin-top:var(--s-xs);display:flex;align-items:center;justify-content:center;gap:6px}.wide-secondary svg{width:15px;height:15px}.single-color-mode,.palette-mode{padding-top:var(--s-xxs)}.mode-label,.palette-mode h3{display:block;font-size:var(--t-h4);font-weight:var(--w-heading);line-height:1.25;margin:0 0 var(--s-xxs)}.single-color-mode p,.palette-mode p{color:var(--muted);font-size:var(--t-body-sm);line-height:1.45;margin:0}.big-color-field{display:flex;align-items:center;gap:var(--s-xs);background:var(--canvas);border-radius:var(--r-sm);height:56px;padding:6px;margin-top:var(--s-md)}.big-color-field input[type=color]{width:44px;height:44px;padding:0;border:0;background:transparent;border-radius:var(--r-squircle)}.big-color-field input:last-child{flex:1;min-width:0;border:0;background:transparent;padding:0 var(--s-xs);font-size:var(--t-h4);font-weight:var(--w-heading);font-family:var(--font-mono);text-transform:uppercase}.big-color-field input:last-child:focus{outline:none}.big-color-field:focus-within{box-shadow:inset 0 0 0 2px var(--ink)}.suggestion-row{display:flex;gap:var(--s-xs);margin-top:var(--s-sm)}.suggestion-row button{width:36px;height:36px;border-radius:var(--r-squircle);border:0;box-shadow:inset 0 0 0 1px #1414140f;transition:transform .18s cubic-bezier(.16,1,.3,1)}.suggestion-row button:hover{transform:scale(1.08)}.palette-mode{overflow:auto}.palette-editor-list{display:grid;margin:var(--s-sm) 0}.palette-editor-list label{min-height:44px;display:grid;grid-template-columns:28px 88px 1fr;align-items:center;gap:var(--s-xs);border-bottom:1px solid var(--hairline-soft)}.palette-editor-list input[type=color]{width:28px;height:28px;border:0;padding:0;background:transparent;border-radius:var(--r-squircle)}.palette-editor-list span{font-family:var(--font-mono);font-size:var(--t-body-sm)}.palette-editor-list small{color:var(--muted);font-size:var(--t-body-sm)}.extracted-section{border-top:1px solid var(--hairline-soft);padding-top:var(--s-md);margin-top:var(--s-md)}.section-heading{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:var(--s-xs)}.section-heading h3{font-size:var(--t-body-sm);font-weight:var(--w-heading)}.section-heading span{color:var(--muted);font-size:var(--t-label)}.extracted-swatches{display:flex;flex-wrap:wrap;gap:6px;min-height:var(--chip)}.extracted-swatch{width:var(--chip);height:var(--chip);position:relative;flex:0 0 var(--chip)}.swatch-color{width:100%;height:100%;border-radius:var(--r-squircle);border:0;display:flex;align-items:flex-end;justify-content:flex-end;padding:3px;color:var(--ink);box-shadow:inset 0 0 0 1px #1414140f;transition:transform .18s cubic-bezier(.16,1,.3,1)}.swatch-color:hover{transform:scale(1.08)}.swatch-color svg{width:11px;height:11px;background:#ffffffd9;border-radius:var(--r-full);padding:2px}.remove-color{width:18px;height:18px;border:1px solid var(--hairline);background:var(--canvas);border-radius:var(--r-full);position:absolute;top:-5px;right:-5px;display:grid;place-items:center;opacity:0}.extracted-swatch:hover .remove-color,.remove-color:focus-visible{opacity:1}.palette-actions{display:flex;gap:6px;margin-top:var(--s-sm)}.palette-actions button{height:30px;padding:0 var(--s-sm);display:inline-flex;align-items:center;gap:5px;font-size:var(--t-label)}.palette-actions button svg{width:14px;height:14px}.brand-color-row{border-top:1px solid var(--hairline-soft);margin-top:var(--s-md);padding-top:var(--s-md)}.brand-color-row label{display:block;font-size:var(--t-body-sm);font-weight:var(--w-link);margin-bottom:6px}.compact-color-field{width:100%;height:44px;display:flex;align-items:center;background:var(--canvas);border-radius:var(--r-sm);padding:6px;gap:6px}.compact-color-field:focus-within{box-shadow:inset 0 0 0 2px var(--ink)}.compact-color-field input[type=color]{width:32px;height:32px;border:0;padding:0;background:transparent;border-radius:var(--r-squircle)}.compact-color-field input:last-child{flex:1;min-width:0;border:0;background:transparent;font-family:var(--font-mono);font-size:var(--t-body-sm);text-transform:uppercase}.compact-color-field input:last-child:focus{outline:none}.compile-button{width:100%;height:var(--cta-h);border:0;margin-top:var(--s-md);display:flex;align-items:center;justify-content:center;gap:6px;font-size:var(--t-body)}.compile-button svg{width:16px;height:16px}.generated-date{display:block;text-align:center;color:var(--faint);font-size:var(--t-label);margin-top:var(--s-xs)}.workspace{min-width:0;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-lg)}.workspace-header{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-lg);flex-wrap:wrap;padding:var(--s-xs) var(--s-xxs) 0}.workspace-header h1{font-size:var(--t-h3);line-height:1.2}.workspace-sub{margin:var(--s-xs) 0 0;font-size:var(--t-body);font-weight:var(--w-light);line-height:1.45;color:var(--muted)}.utility-actions{display:flex;gap:6px;flex-wrap:wrap}.utility-actions button{height:32px;padding:0 var(--s-sm)}.semantic-palette{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--s-sm);padding:var(--s-xxs) var(--s-xxs) 0}.semantic-palette>div{min-width:0}.semantic-palette span{display:block;font-size:var(--t-label);font-weight:var(--w-link);color:var(--muted);margin-bottom:var(--s-xs)}.semantic-swatch{width:100%;height:var(--tile-h);border-radius:var(--r-sm);border:0;display:block;box-shadow:inset 0 0 0 1px #1414140f;transition:transform .18s cubic-bezier(.16,1,.3,1)}.semantic-swatch:hover{transform:translateY(-2px)}.semantic-palette code{display:block;font-family:var(--font-mono);font-size:10px;color:var(--faint);margin-top:var(--s-xs)}.output-panel{margin-top:var(--s-lg);background:var(--canvas);border:1px solid var(--hairline-soft);border-radius:var(--r-md);overflow:clip}.output-tabs{display:flex;gap:4px;overflow-x:auto;padding:var(--s-sm);border-bottom:1px solid var(--hairline-soft);scrollbar-width:none}.output-tabs::-webkit-scrollbar{display:none}.output-tabs button{height:32px;flex:0 0 auto;padding:0 var(--s-sm);background:transparent;border:0;color:var(--muted);white-space:nowrap}.output-tabs button:hover{background:var(--canvas-soft);color:var(--ink)}.output-tabs button.active{background:var(--ink);color:var(--on-primary)}.output-content{min-width:0}.output-panel .contract-document{border:0;border-radius:0}.output-panel .contract-layout{gap:0}.output-panel .contract-index{border-right:1px solid var(--hairline-soft);padding:var(--s-lg) var(--s-sm);gap:2px}.contract-layout{display:grid;grid-template-columns:176px minmax(0,1fr);gap:var(--s-md);align-items:start}.contract-index{display:grid;gap:2px;position:sticky;top:calc(var(--nav-h) + var(--s-lg))}.contract-index button{width:100%;min-height:34px;border:0;background:transparent;text-align:left;padding:0 var(--s-sm);color:var(--muted)}.contract-index button:hover,.contract-index button.active{background:var(--canvas-soft);color:var(--ink)}.contract-document{background:var(--canvas);border:1px solid var(--hairline-soft);border-radius:var(--r-md);padding:var(--s-lg) var(--s-xl) var(--s-xl)}.contract-toolbar{display:flex;align-items:center;justify-content:flex-end;gap:6px;margin-bottom:var(--s-lg);flex-wrap:wrap}.contract-toolbar>span{display:flex;align-items:center;gap:6px;margin-right:auto;font-size:var(--t-body-sm);color:var(--muted)}.contract-toolbar>span svg{width:16px;height:16px;color:var(--ink)}.contract-toolbar button{height:32px;padding:0 var(--s-sm);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.contract-toolbar button svg{width:15px;height:15px}.contract-document>h1{font-size:var(--t-h2);line-height:1.15;margin-bottom:var(--s-xs)}.lede{font-size:var(--t-body);font-weight:var(--w-light);line-height:1.55;color:var(--muted);max-width:70ch;margin:0}.contract-document hr{border:0;border-top:1px solid var(--hairline-soft);margin:var(--s-xl) 0 var(--s-lg)}.contract-document h2{font-size:var(--t-h4);line-height:1.25;margin-bottom:var(--s-sm)}.token-table{width:100%;font-size:var(--t-body-sm)}.token-row{display:grid;grid-template-columns:88px 148px 148px minmax(200px,1fr);align-items:center;min-height:48px;border-bottom:1px solid var(--canvas-soft);gap:var(--s-sm)}.token-row:last-child{border-bottom:0}.token-head{min-height:30px;font-size:var(--t-label);font-weight:var(--w-link);color:var(--muted);border-bottom:1px solid var(--hairline)}.token-row strong{font-weight:var(--w-link)}.token-row>span:last-child{color:var(--muted)}.token-row code{font-family:var(--font-mono);font-size:var(--t-label);color:var(--muted)}.token-preview{display:flex;align-items:center;gap:var(--s-xs);font-family:var(--font-mono);font-size:var(--t-label)}.token-preview i{width:24px;height:24px;border-radius:var(--r-squircle);display:inline-block;box-shadow:inset 0 0 0 1px #1414140f}.rules-title{margin-top:var(--s-xl)!important}.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-md)}.rule{background:var(--canvas-soft);border-radius:var(--r-sm);padding:var(--s-md)}.rule h3{font-size:var(--t-body-sm);font-weight:var(--w-link);margin-bottom:var(--s-sm);display:flex;align-items:center;gap:6px}.rule h3 svg{width:15px;height:15px}.rule.good h3,.rule.bad h3{color:var(--ink)}.rule>div{display:grid;gap:var(--s-sm)}.rule button{height:var(--pill-h);border:0;border-radius:var(--r-full);font-weight:var(--w-link);font-size:var(--t-body-sm);justify-self:start;padding:0 var(--s-md)}.rule p{font-size:var(--t-body-sm);line-height:1.45;margin:0;color:var(--muted)}.document-date{color:var(--faint);font-size:var(--t-label);display:block;margin-top:var(--s-lg)}.sheet{padding:var(--s-lg) var(--s-xl) var(--s-xl)}.sheet-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-md);flex-wrap:wrap;margin-bottom:var(--s-lg)}.sheet-head h2{font-size:var(--t-h3);line-height:1.2}.sheet-head p{margin:6px 0 0;color:var(--muted);font-size:var(--t-body);font-weight:var(--w-light);max-width:62ch}.specimen-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-md)}.specimen{grid-column:span 2;border:1px solid var(--hairline-soft);border-radius:var(--r-sm);overflow:hidden}.specimen.span-4{grid-column:span 4}.specimen-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-xs);padding:var(--s-sm) var(--s-md);border-bottom:1px solid var(--hairline-soft)}.specimen-head span{font-size:var(--t-label);font-weight:var(--w-link)}.specimen-head small{font-size:var(--t-label);color:var(--faint)}.specimen-body{padding:var(--s-md)}.specimen-note{margin:var(--s-sm) 0 0;font-size:var(--t-body-sm);color:var(--muted);line-height:1.45}.stat-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-md);margin-bottom:var(--s-md)}.stat-row div{background:var(--canvas-soft);border-radius:var(--r-sm);padding:var(--s-md)}.stat-row small{display:block;font-size:var(--t-label);font-weight:var(--w-link);color:var(--muted)}.stat-row strong{display:block;margin-top:var(--s-xs);font-size:var(--t-h3);font-weight:var(--w-heading)}.proportion-bar{display:flex;height:56px;border-radius:var(--r-sm);overflow:hidden}.proportion-bar span{flex:1 1 0}.role-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-xs)}.role-list li{display:grid;grid-template-columns:16px 68px minmax(0,1fr);align-items:center;gap:var(--s-xs);font-size:var(--t-body-sm)}.role-list i{width:16px;height:16px;border-radius:var(--r-squircle)}.role-list strong{font-weight:var(--w-link)}.role-list span{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.jump-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s-xs);margin-top:var(--s-md)}.jump-card{display:grid;gap:4px;align-content:start;text-align:left;background:var(--canvas-soft);border:0;border-radius:var(--r-sm);padding:var(--s-md);transition:background-color .18s ease}.jump-card:hover{background:var(--hairline)}.jump-card strong{font-size:var(--t-body-sm);font-weight:var(--w-link)}.jump-card span{font-size:var(--t-label);color:var(--muted);line-height:1.4}.jump-card svg{margin-top:var(--s-xs);color:var(--muted)}.device-frame{border:1px solid var(--hairline-soft);border-radius:var(--r-sm);overflow:hidden;background:var(--canvas)}.device-frame.dash{display:grid;grid-template-columns:180px minmax(0,1fr)}.site-nav{height:52px;display:flex;align-items:center;gap:var(--s-md);padding:0 var(--s-md);border-bottom:1px solid var(--hairline-soft);font-size:var(--t-body-sm);color:var(--muted)}.site-nav strong{font-size:var(--t-body);font-weight:var(--w-heading);margin-right:auto;color:var(--ink)}.site-nav button,.site-hero button,.dash-head button{border:0;border-radius:var(--r-full);padding:0 var(--s-md);height:var(--pill-h);font-weight:var(--w-link);font-size:var(--t-body-sm)}.site-hero{display:grid;grid-template-columns:1fr 1fr;padding:var(--s-xl);align-items:center;gap:var(--s-xl)}.site-hero small{font-size:var(--t-label);font-weight:var(--w-link);opacity:.72}.site-hero h3{font-size:var(--t-h2);line-height:1.05;margin:var(--s-xs) 0 var(--s-sm)}.site-hero p{max-width:44ch;line-height:1.5;font-weight:var(--w-light);font-size:var(--t-body);margin:0 0 var(--s-md);opacity:.8}.site-cta-row{display:flex;gap:var(--s-xs);flex-wrap:wrap}.site-cta-row .ghost{background:transparent;border:1px solid currentColor}.site-hero img{width:100%;height:260px;object-fit:cover;border-radius:var(--r-sm)}.site-features{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-md);padding:var(--s-lg) var(--s-xl) var(--s-xl);border-top:1px solid var(--hairline-soft)}.site-features div{display:grid;gap:6px;align-content:start}.site-features i{width:28px;height:28px;border-radius:var(--r-squircle)}.site-features strong{font-size:var(--t-body-sm);font-weight:var(--w-link)}.site-features span{font-size:var(--t-label);color:var(--muted);line-height:1.45}.device-frame.dash aside{padding:var(--s-md) var(--s-xs);border-right:1px solid var(--hairline-soft);display:flex;flex-direction:column;gap:2px}.device-frame.dash aside strong{margin:0 var(--s-xs) var(--s-sm);font-weight:var(--w-heading);font-size:var(--t-body-sm)}.device-frame.dash aside button{display:flex;align-items:center;gap:var(--s-xs);border:0;background:transparent;text-align:left;padding:0 var(--s-sm);height:32px;border-radius:var(--r-full);color:var(--muted);font-size:var(--t-body-sm)}.device-frame.dash aside button i{width:6px;height:6px;border-radius:var(--r-full)}.device-frame.dash aside button.active{background:var(--canvas-soft);color:var(--ink);font-weight:var(--w-link)}.device-frame.dash section{padding:var(--s-md);min-width:0}.dash-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-md);margin-bottom:var(--s-md)}.dash-head h3{font-size:var(--t-h4)}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-xs);margin-bottom:var(--s-md)}.metrics div{background:var(--canvas-soft);border-radius:var(--r-sm);padding:var(--s-sm) var(--s-md)}.metrics small{display:block;color:var(--muted);font-size:var(--t-label);font-weight:var(--w-link)}.metrics strong{display:block;margin:4px 0 2px;font-size:var(--t-h4);font-weight:var(--w-heading)}.metrics span{font-size:var(--t-label);font-weight:var(--w-link)}.chart-panel{border:1px solid var(--hairline-soft);border-radius:var(--r-sm);padding:var(--s-md)}.chart-panel h4{font-size:var(--t-body-sm);font-weight:var(--w-link);margin-bottom:var(--s-sm)}.bars{height:168px;display:flex;align-items:end;gap:5%}.bars.tall{height:208px}.bars span{flex:1;border-radius:6px 6px 3px 3px}.bar-axis{display:flex;gap:5%;margin-top:var(--s-xs)}.bar-axis span{flex:1;text-align:center;font-size:10px;color:var(--faint)}.lockup-row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-xs)}.lockup{display:flex;align-items:center;gap:var(--s-xs);padding:var(--s-md);border-radius:var(--r-sm);min-height:76px}.lockup-mark{width:28px;height:28px;display:grid;place-items:center;border-radius:var(--r-squircle);flex:0 0 28px}.lockup strong{font-size:var(--t-body-sm);font-weight:var(--w-heading)}.icon-row{display:flex;gap:var(--s-xs);flex-wrap:wrap}.icon-row span{width:48px;height:48px;display:grid;place-items:center;border-radius:var(--r-squircle)}.type-specimen{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-lg);align-items:center}.type-specimen>div{font-size:64px;font-weight:var(--w-heading);line-height:1}.type-specimen ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:var(--t-body-sm);color:var(--muted)}.type-specimen strong{font-family:var(--font-mono);font-size:var(--t-label);color:var(--ink);margin-right:var(--s-xs)}.accent-demo{display:flex;align-items:center;justify-content:space-between;gap:var(--s-md);padding:var(--s-md);border-radius:var(--r-sm);min-height:76px}.accent-demo span{font-size:var(--t-body-sm);font-weight:var(--w-link)}.accent-demo button{border:0;border-radius:var(--r-full);height:var(--pill-h);padding:0 var(--s-md);font-size:var(--t-body-sm);font-weight:var(--w-link)}.parts-row{display:flex;align-items:center;gap:var(--s-xs);flex-wrap:wrap}.parts-stack{display:grid;gap:var(--s-xs)}.parts-stack input,.parts-stack select{height:var(--cta-h);padding:0 var(--s-md);border-radius:var(--r-sm);border:0;background:var(--field);color:var(--ink);font-size:var(--t-body-sm)}.parts-stack input::placeholder{color:var(--faint)}.demo-btn{height:var(--cta-h);padding:0 var(--s-md);border:0;border-radius:var(--r-full);font-weight:var(--w-link);font-size:var(--t-body-sm)}.demo-btn.outline{background:transparent;border:1px solid currentColor}.demo-badge{display:inline-flex;align-items:center;gap:6px;padding:6px var(--s-sm);border-radius:var(--r-full);font-size:var(--t-label);font-weight:var(--w-link)}.demo-badge i{width:7px;height:7px;border-radius:var(--r-full)}.demo-card{display:grid;gap:6px;justify-items:start;border:1px solid var(--hairline-soft);border-radius:var(--r-sm);padding:var(--s-md)}.demo-card-top{width:100%;height:48px;border-radius:var(--r-sm)}.demo-card strong{font-size:var(--t-body);font-weight:var(--w-heading);margin-top:var(--s-xs)}.demo-card>span:not(.demo-card-top){font-size:var(--t-body-sm);color:var(--muted);line-height:1.45}.demo-card .demo-btn{margin-top:var(--s-xs)}.chart-flex{display:flex;align-items:center;gap:var(--s-lg);flex-wrap:wrap}.donut{width:156px;height:156px;border-radius:50%;position:relative;flex:0 0 156px}.donut:after{content:"";position:absolute;top:38px;right:38px;bottom:38px;left:38px;border-radius:50%;background:var(--canvas)}.chart-legend{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:var(--t-body-sm)}.chart-legend li{display:flex;align-items:center;gap:var(--s-xs)}.chart-legend i{width:12px;height:12px;border-radius:var(--r-squircle)}.ramp{display:flex;gap:4px}.ramp span{flex:1;height:48px;border-radius:6px}.gradient-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--s-sm)}.gradient-tile{height:120px;border:0;border-radius:var(--r-sm);display:flex;align-items:flex-end;padding:var(--s-sm);transition:transform .18s cubic-bezier(.16,1,.3,1)}.gradient-tile:hover{transform:translateY(-2px)}.gradient-meta{font-family:var(--font-mono);font-size:10px;font-weight:var(--w-link);padding:4px var(--s-xs);border-radius:var(--r-full)}.variable-list{list-style:none;margin:0;padding:0}.variable-list li{display:grid;grid-template-columns:24px minmax(0,200px) 92px minmax(0,1fr);align-items:center;gap:var(--s-sm);min-height:48px;border-bottom:1px solid var(--canvas-soft);font-size:var(--t-body-sm)}.variable-list li:last-child{border-bottom:0}.variable-list i{width:24px;height:24px;border-radius:var(--r-squircle)}.variable-list code{font-family:var(--font-mono);font-size:var(--t-label)}.variable-list span{font-family:var(--font-mono);font-size:var(--t-label);color:var(--muted)}.variable-list small{color:var(--faint);font-size:var(--t-label)}.contract-copy{font-size:var(--t-body-sm);color:var(--muted);line-height:1.55;max-width:70ch;margin:0 0 var(--s-md)}.site-footer{margin-top:var(--s-section);background:var(--footer-bg);color:var(--footer-fg);border-radius:var(--r-md) var(--r-md) 0 0;padding:var(--s-xxl) var(--s-xl) var(--s-lg)}.footer-inner{width:min(1440px,100%);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:var(--s-xl);align-items:start}.footer-mark{font-size:var(--t-mark);font-weight:var(--w-heading);line-height:1}.footer-tagline{color:var(--faint);font-size:var(--t-body);font-weight:var(--w-light);margin:var(--s-sm) 0 0;max-width:38ch}.footer-col{display:grid;gap:var(--s-xs);min-width:128px}.footer-col strong{font-size:var(--t-label);font-weight:var(--w-link);color:var(--footer-fg)}.footer-col button,.footer-col a{background:none;border:0;padding:0;text-align:left;color:var(--faint);text-decoration:none;font-size:var(--t-body-sm);transition:color .18s ease}.footer-col button:hover,.footer-col a:hover{color:var(--footer-fg)}.footer-base a{color:var(--faint);text-decoration:none}.footer-base a:hover{color:var(--footer-fg)}.footer-base{width:min(1440px,100%);margin:var(--s-xxl) auto 0;display:flex;justify-content:space-between;gap:var(--s-md);flex-wrap:wrap;color:var(--faint);font-size:var(--t-label)}.toast{position:fixed;left:50%;bottom:var(--s-lg);transform:translate(-50%);display:flex;align-items:center;gap:6px;background:var(--ink);color:var(--on-primary);border-radius:var(--r-full);padding:var(--s-xs) var(--s-md);font-size:var(--t-body-sm);font-weight:var(--w-link);z-index:60}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#1414146b;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:grid;place-items:center;z-index:70;padding:var(--s-lg)}.contrast-modal{width:min(760px,96vw);max-height:90vh;overflow:auto;background:var(--canvas);border-radius:var(--r-md);padding:var(--s-lg)}.modal-title{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-md);margin-bottom:var(--s-md)}.modal-title h2{font-size:var(--t-h3);line-height:1.2;margin-bottom:4px}.modal-title p{margin:0;color:var(--muted);font-size:var(--t-body-sm)}.modal-title button{width:32px;height:32px;flex:0 0 32px;border:1px solid var(--hairline);background:var(--canvas);border-radius:var(--r-full);display:grid;place-items:center}.modal-title button svg{width:16px;height:16px}.modal-title button:hover{background:var(--canvas-soft)}.matrix-toolbar{display:flex;align-items:center;justify-content:space-between;gap:var(--s-md);flex-wrap:wrap;margin-bottom:var(--s-md)}.grade-counts{display:flex;gap:var(--s-xs);flex-wrap:wrap}.grade-counts span{background:var(--canvas-soft);border-radius:var(--r-full);padding:5px var(--s-sm);font-size:var(--t-label);color:var(--muted)}.grade-counts b{font-family:var(--font-mono);color:var(--ink);font-weight:var(--w-link)}.matrix-filter{margin:0;max-width:240px;flex:0 0 240px}.matrix-filter button{height:28px;font-size:var(--t-label)}.matrix-scroll{overflow:auto;border-radius:var(--r-sm);max-height:58vh}.matrix-table{border-collapse:separate;border-spacing:0;width:100%}.matrix-table th{font-size:var(--t-label);font-weight:var(--w-link);color:var(--muted);padding:var(--s-xs) 6px;text-align:center;white-space:nowrap;background:var(--canvas)}.matrix-table thead th{position:sticky;top:0;z-index:2}.matrix-table tbody th{position:sticky;left:0;z-index:1;text-align:left}.matrix-table th code{display:block;font-family:var(--font-mono);font-size:10px;color:var(--faint);margin-top:3px}.matrix-corner{color:var(--faint);font-family:var(--font-mono);font-size:10px}.matrix-key{display:inline-block;width:14px;height:14px;vertical-align:-2px;margin-right:5px;border-radius:var(--r-squircle);box-shadow:inset 0 0 0 1px #14141414}.matrix-cell{width:84px;height:68px;padding:0;text-align:center;vertical-align:middle}.matrix-cell.is-same{opacity:.5}.matrix-cell.is-dimmed{opacity:.18}.matrix-cell{transition:opacity .2s ease}.matrix-same{font-size:var(--t-body);opacity:.6}.matrix-sample{display:block;font-size:var(--t-h4);font-weight:var(--w-heading);line-height:1.1}.matrix-verdict{display:inline-block;margin-top:5px;padding:2px 6px;border-radius:var(--r-full);font-family:var(--font-mono);font-size:9px;font-weight:var(--w-link);letter-spacing:0;white-space:nowrap}.matrix-verdict b{font-weight:var(--w-heading)}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.modal-note{display:flex;align-items:center;gap:6px;margin-top:var(--s-sm);background:var(--canvas-soft);border-radius:var(--r-full);padding:var(--s-xs) var(--s-sm);color:var(--muted);font-size:var(--t-body-sm)}.modal-note svg{width:15px;height:15px}.dialog{width:min(440px,96vw);max-height:90vh;overflow:auto;background:var(--canvas);border-radius:var(--r-md);padding:var(--s-lg)}.dialog.is-wide{width:min(720px,96vw)}.billing-toggle{max-width:240px;margin:0 auto var(--s-sm)}.savings-note{text-align:center;margin:0 0 var(--s-md);font-size:var(--t-label);font-weight:var(--w-link);color:var(--accent)}.plan-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-sm)}.plan-card{border:1px solid var(--hairline-soft);border-radius:var(--r-md);padding:var(--s-md);display:grid;align-content:start;gap:var(--s-xs)}.plan-card.is-featured{background:var(--canvas-soft);border-color:transparent}.plan-head{display:flex;align-items:center;gap:var(--s-xs)}.plan-head h3{font-size:var(--t-h4)}.plan-price{display:flex;align-items:baseline;gap:6px}.plan-price strong{font-size:var(--t-h2);font-weight:var(--w-heading)}.plan-price small{color:var(--muted);font-size:var(--t-label)}.plan-note{margin:0;color:var(--muted);font-size:var(--t-body-sm)}.plan-card ul{list-style:none;margin:var(--s-xs) 0 var(--s-sm);padding:0;display:grid;gap:6px}.plan-card li{display:flex;align-items:center;gap:6px;font-size:var(--t-body-sm);color:var(--muted)}.plan-card li svg{flex:0 0 14px;color:var(--ink)}.plan-card .compile-button,.plan-card .wide-secondary{margin-top:auto}.auth-form{display:grid;gap:var(--s-sm)}.auth-form label{font-size:var(--t-body-sm);font-weight:var(--w-link)}.auth-form input{height:var(--cta-h);padding:0 var(--s-md);border:0;border-radius:var(--r-sm);background:var(--field);color:var(--ink)}.auth-form input::placeholder{color:var(--faint)}.auth-form input:focus{outline:none;box-shadow:inset 0 0 0 2px var(--ink)}.auth-form .wide-secondary,.auth-form .compile-button{margin:0}.auth-form small{color:var(--faint);font-size:var(--t-label);text-align:center;line-height:1.45}.auth-divider{display:flex;align-items:center;gap:var(--s-sm);color:var(--faint);font-size:var(--t-label)}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:var(--hairline-soft)}:root[data-theme=dark]{--ink: #f2f2f2;--ink-soft: #d8d8d8;--canvas: #0f0f0f;--canvas-soft: #1a1a1a;--field: #1f1f1f;--hairline-soft: #232323;--hairline: #303030;--muted: #a0a0a0;--faint: #6d6d6d;--accent: #4d94ff;--cta-bg: #f2f2f2;--cta-fg: #141414;--footer-bg: #161616;--footer-fg: #f2f2f2;color-scheme:dark}:root[data-theme=dark] .swatch-color,:root[data-theme=dark] .semantic-swatch,:root[data-theme=dark] .matrix-key,:root[data-theme=dark] .suggestion-row button{box-shadow:inset 0 0 0 1px #ffffff1f}:root[data-theme=dark] .input-tabs{background:#ffffff0f}:root[data-theme=dark] .image-drop{box-shadow:inset 0 0 0 1px #ffffff14}:root[data-theme=dark] ::selection{background:var(--ink);color:var(--canvas)}@media(max-width:1280px){.app-grid{grid-template-columns:330px minmax(0,1fr)}.semantic-palette{grid-template-columns:repeat(4,1fr)}.contract-layout{grid-template-columns:150px minmax(0,1fr)}.main-nav button:not(.active){display:none}.text-button{display:none}}@media(max-width:1024px){.stat-row{grid-template-columns:repeat(2,1fr)}.jump-grid{grid-template-columns:repeat(3,1fr)}.site-features{grid-template-columns:1fr}.token-row{grid-template-columns:84px 132px 136px minmax(170px,1fr)}.footer-inner{grid-template-columns:1fr 1fr}}@media(max-width:840px){.topbar{width:calc(100% - var(--s-lg));padding:0 var(--s-xs) 0 var(--s-sm);gap:var(--s-xs)}.main-nav,.dark-pill,.icon-button{display:none!important}.mobile-export{display:grid!important;place-items:center;width:36px;height:36px;border-radius:var(--r-full);background:var(--ink);color:var(--on-primary)}.app-grid{width:calc(100% - var(--s-lg));grid-template-columns:minmax(0,1fr)}.sidebar{position:static;max-height:none}.contract-layout{grid-template-columns:1fr}.contract-index{position:static;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}.contract-index button{width:auto;flex:0 0 auto}.contract-toolbar>span{width:100%;margin-bottom:var(--s-xxs)}.token-table{overflow-x:auto;display:block}.token-row{min-width:660px}.rules-grid{grid-template-columns:1fr}.site-hero,.site-features{grid-template-columns:1fr;padding:var(--s-md)}.device-frame.dash{grid-template-columns:1fr}.device-frame.dash aside{display:none}.specimen-grid{grid-template-columns:1fr}.specimen,.specimen.span-4{grid-column:auto}.stat-row,.jump-grid{grid-template-columns:repeat(2,1fr)}.plan-grid{grid-template-columns:1fr}.matrix-filter{flex:1 1 auto;max-width:none}.type-specimen{grid-template-columns:1fr;gap:var(--s-md)}.lockup-row{grid-template-columns:1fr}.variable-list li{grid-template-columns:24px minmax(0,1fr) 84px}.variable-list li small{display:none}.site-footer{padding:var(--s-xl) var(--s-lg) var(--s-md)}.footer-base{margin-top:var(--s-lg)}}@media(max-width:640px){.sidebar,.contract-document,.sheet{padding:var(--s-md)}.semantic-palette{grid-template-columns:repeat(3,1fr);padding:var(--s-md)}.workspace-header h1{font-size:var(--t-h4)}.contract-toolbar button{flex:1;justify-content:center}.site-hero h3{font-size:var(--t-h3)}.stat-row,.jump-grid{grid-template-columns:1fr}.footer-inner{grid-template-columns:1fr;gap:var(--s-md)}.footer-mark{font-size:var(--t-h2)}.contrast-modal{padding:var(--s-md)}.matrix-cell{width:68px;height:60px}.matrix-sample{font-size:var(--t-body)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
