unit.gl 0.2.3 → 0.3.1

package/css/unit.gl.docs.min.css

@@ -0,0 +1,2 @@
+:root{--swiss-black:#000;--swiss-white:#fff;--swiss-red:red;--swiss-gray-50:#fafafa;--swiss-gray-100:#f5f5f5;--swiss-gray-200:#e8e8e8;--swiss-gray-300:#d4d4d4;--swiss-gray-400:#a3a3a3;--swiss-gray-500:#737373;--swiss-gray-600:#525252;--swiss-gray-700:#404040;--swiss-gray-800:#262626;--swiss-gray-900:#171717;--color-bg:var(--swiss-white);--color-bg-subtle:var(--swiss-gray-50);--color-bg-muted:var(--swiss-gray-100);--color-text:var(--swiss-black);--color-text-muted:var(--swiss-gray-600);--color-text-subtle:var(--swiss-gray-500);--color-border:var(--swiss-gray-200);--color-border-strong:var(--swiss-black);--color-accent:var(--swiss-red);--color-code-bg:var(--swiss-gray-900);--color-code-text:var(--swiss-gray-300);--color-code-comment:var(--swiss-gray-500);--font-sans:"Inter",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;--font-mono:"JetBrains Mono","SF Mono","Monaco","Inconsolata","Roboto Mono",monospace;--grid-unit:0.5rem;--max-width:75rem;--transition-fast:0.1s ease;--transition-base:0.2s ease;--transition-slow:0.3s ease;--shadow-sm:0 0.0625rem 0.125rem rgba(0,0,0,.05);--shadow-md:0 0.25rem 0.75rem rgba(0,0,0,.1);--shadow-lg:0 0.5rem 1.5rem rgba(0,0,0,.15);--dpr:1;--dpr-inverse:1;--grid-unit-density:calc(var(--grid-unit)*var(--dpr-inverse));--mm-to-px:4;--bp-us:240px;--bp-ss:360px;--bp-xs:540px;--bp-sm:720px;--bp-md:1440px;--bp-lg:2160px;--bp-xl:2880px;--bp-ul:4320px}[data-theme=dark]{--color-bg:#0a0a0a;--color-bg-subtle:#111;--color-bg-muted:#1a1a1a;--color-text:#fafafa;--color-text-muted:#a3a3a3;--color-text-subtle:#737373;--color-border:#2a2a2a;--color-border-strong:#fafafa;--color-accent:#f33;--color-code-bg:#111;--color-code-text:#e5e5e5;--color-code-comment:#6b7280;--shadow-sm:0 0.0625rem 0.125rem rgba(0,0,0,.3);--shadow-md:0 0.25rem 0.75rem rgba(0,0,0,.4);--shadow-lg:0 0.5rem 1.5rem rgba(0,0,0,.5)}*,:after,:before{box-sizing:border-box}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-sans);font-size:1rem;font-weight:400;line-height:1.5rem;margin:0;padding:0;transition:background-color var(--transition-base),color var(--transition-base)}body.nav-open{overflow:hidden}@media(min-width:48rem){body.nav-open{overflow:auto}}.skip-link{background:var(--color-text);color:var(--color-bg);font-size:.875rem;font-weight:600;left:1rem;padding:.75rem 1.5rem;position:absolute;text-decoration:none;top:-6.25rem;transition:top var(--transition-fast);z-index:10000}.skip-link:focus{outline:.125rem solid var(--color-accent);outline-offset:.125rem;top:1rem}.noscript-warning{background:var(--color-accent);color:var(--color-bg);font-size:.875rem;line-height:1.25rem;margin-bottom:1.5rem;padding:1rem 1.5rem}.noscript-warning strong{font-weight:600}:focus-visible{outline:.125rem solid var(--color-accent);outline-offset:.125rem}:focus:not(:focus-visible){outline:none}.is-active{color:var(--color-accent)!important;font-weight:600}.is-active:before{background:var(--color-accent);content:"";height:1rem;left:0;position:absolute;top:50%;transform:translateY(-50%);width:.1875rem}@media(prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}h1,h2,h3,h4,h5,h6{color:var(--color-text);font-weight:600;letter-spacing:-.02em;line-height:1.2;margin:0 0 calc(var(--grid-unit)*2)}h1{font-size:3.5rem;font-weight:700;letter-spacing:-.03em}h1,h2{margin-bottom:calc(var(--grid-unit)*3)}h2{border-bottom:.125rem solid var(--color-border-strong);font-size:1.75rem;margin-top:calc(var(--grid-unit)*6);padding-bottom:calc(var(--grid-unit)*2)}h3{color:var(--color-text-muted);font-size:1.125rem;font-weight:500;letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*2);margin-top:calc(var(--grid-unit)*4);text-transform:uppercase}p{margin:0 0 calc(var(--grid-unit)*2);max-width:65ch}.lead{color:var(--color-text-muted);font-size:1.25rem;font-weight:300;line-height:1.5;max-width:50ch}.eyebrow{color:var(--color-accent);font-size:.75rem;font-weight:600;letter-spacing:.1em;margin-bottom:calc(var(--grid-unit)*1);text-transform:uppercase}code{background:var(--color-bg-muted);font-family:var(--font-mono);font-size:.875em;padding:.125rem .375rem}.container{margin:0 auto;max-width:var(--max-width);padding:0 calc(var(--grid-unit)*4)}.header{border-bottom:1px solid var(--color-border-strong);margin-bottom:calc(var(--grid-unit)*6);padding:calc(var(--grid-unit)*8) 0 calc(var(--grid-unit)*6)}.header--hero{padding:calc(var(--grid-unit)*12) 0 calc(var(--grid-unit)*8)}main{padding-bottom:calc(var(--grid-unit)*12)}section{margin-bottom:calc(var(--grid-unit)*10)}.layout{display:grid;gap:calc(var(--grid-unit)*6);grid-template-columns:1fr}@media(min-width:64rem){.layout{grid-template-columns:12.5rem 1fr}}a{border-bottom:1px solid var(--color-border-strong);color:var(--color-text);text-decoration:none;transition:border-color var(--transition-fast),color var(--transition-fast)}a:hover{border-color:var(--color-accent);color:var(--color-accent)}.tag{background:var(--color-text);color:var(--color-bg);display:inline-block;font-size:.625rem;font-weight:600;letter-spacing:.08em;margin-left:calc(var(--grid-unit)*1);padding:.25rem .625rem;text-transform:uppercase;vertical-align:middle}.tag--outline{background:transparent;border:1px solid var(--color-border-strong);color:var(--color-text)}.tag--red{background:var(--color-accent)}.btn,button{align-items:center;background:var(--color-bg);border:1px solid var(--color-border-strong);box-shadow:var(--shadow-sm);color:var(--color-text);cursor:pointer;display:inline-flex;font-family:var(--font-sans);font-size:.75rem;font-weight:600;gap:calc(var(--grid-unit)*.5);justify-content:center;letter-spacing:.05em;padding:calc(var(--grid-unit)*1.25) calc(var(--grid-unit)*2.5);text-decoration:none;text-transform:uppercase;transition:all var(--transition-fast)}.btn:hover,button:hover{background:var(--color-text);border-color:var(--color-text);box-shadow:var(--shadow-md);color:var(--color-bg);transform:translateY(-1px)}.btn:active,button:active{box-shadow:var(--shadow-sm);transform:translateY(0)}.btn--primary,.btn.active,button.active{background:var(--color-text);color:var(--color-bg)}.btn--primary{border-color:var(--color-text)}.btn--primary:hover{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-bg)}.btn--secondary{background:transparent;box-shadow:none}.btn--secondary:hover{background:var(--color-bg-subtle);box-shadow:none;transform:none}.btn--ghost{background:transparent;border-color:transparent;box-shadow:none}.btn--ghost:hover{background:var(--color-bg-subtle);border-color:var(--color-border);transform:none}.hero-actions{display:flex;flex-wrap:wrap;gap:calc(var(--grid-unit)*2);margin-top:calc(var(--grid-unit)*4)}.feature-grid{display:grid;gap:calc(var(--grid-unit)*3);grid-template-columns:repeat(auto-fit,minmax(17.5rem,1fr))}.feature-card{background:var(--color-bg);border:1px solid var(--color-border);padding:calc(var(--grid-unit)*3);position:relative;transition:all var(--transition-base)}.feature-card:hover{border-color:var(--color-border-strong);box-shadow:var(--shadow-md);transform:translateY(-2px)}.feature-card:before{background:var(--color-accent);content:"";height:.1875rem;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity var(--transition-base)}.feature-card:hover:before{opacity:1}.feature-card__icon{align-items:center;background:var(--color-bg-subtle);color:var(--color-text);display:flex;font-size:2rem;font-weight:700;height:3rem;justify-content:center;margin-bottom:calc(var(--grid-unit)*2);width:3rem}.feature-card__title{color:var(--color-text);font-size:1rem;font-weight:600;margin:0 0 calc(var(--grid-unit)*1)}.feature-card__desc{color:var(--color-text-muted);font-size:.875rem;line-height:1.6;margin:0}.doc-sections{display:grid;gap:calc(var(--grid-unit)*4);grid-template-columns:repeat(auto-fit,minmax(12.5rem,1fr))}.doc-section h3{color:var(--color-text-muted);font-size:.75rem;font-weight:600;letter-spacing:.1em;margin-bottom:calc(var(--grid-unit)*2);text-transform:uppercase}.doc-section ul{display:flex;flex-direction:column;gap:calc(var(--grid-unit)*1)}.doc-section li{border:none;padding:0}.doc-section a{border-bottom:none;color:var(--color-text);font-size:.9375rem;font-weight:500}.doc-section a:hover{border-bottom:1px solid var(--color-accent);color:var(--color-accent)}.grid-controls{align-items:center;background:transparent;border:none;display:flex;gap:calc(var(--grid-unit)*.5);padding:0}.grid-controls button{background:var(--color-bg);border:1px solid var(--color-border);color:var(--color-text-muted);cursor:pointer;font-size:.6875rem;font-weight:500;letter-spacing:.05em;outline:none;padding:calc(var(--grid-unit)*.5) calc(var(--grid-unit)*1);text-transform:uppercase;transition:all var(--transition-fast)}.grid-controls button:focus,.grid-controls button:hover{border-color:var(--color-border-strong);color:var(--color-text);outline:none}.grid-controls button.active{background:var(--color-text);border-color:var(--color-text);color:var(--color-bg)}.grid-status{display:none}ul{list-style:none;margin:0;padding:0}li{border-bottom:1px solid var(--color-border);padding:calc(var(--grid-unit)*2) 0}li:last-child{border-bottom:none}.list-item{align-items:center;display:flex;justify-content:space-between;margin:calc(var(--grid-unit)*-1);padding:calc(var(--grid-unit)*1);transition:background var(--transition-fast)}.list-item:hover{background:var(--color-bg-subtle)}.list-item__title{color:var(--color-text);font-weight:500}.list-item__meta{color:var(--color-text-muted);font-size:.75rem}.list-item__arrow{color:var(--color-text-subtle);font-family:var(--font-mono);font-size:.75rem;transition:transform var(--transition-fast)}.list-item:hover .list-item__arrow{color:var(--color-accent);transform:translateX(.25rem)}.card{background:var(--color-bg);border:1px solid var(--color-border-strong);padding:calc(var(--grid-unit)*3);transition:box-shadow var(--transition-base),transform var(--transition-base)}.card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.card--filled{background:var(--color-bg-muted);border:none}.demo-grid{display:grid;gap:calc(var(--grid-unit)*3);grid-template-columns:repeat(auto-fill,minmax(12.5rem,1fr))}.demo-box{align-items:center;aspect-ratio:4/3;background:var(--color-bg-muted);border:1px solid var(--color-border);display:flex;justify-content:center;overflow:hidden;position:relative;transition:border-color var(--transition-fast)}.demo-box:hover{border-color:var(--color-border-strong)}.demo-box:after{bottom:calc(var(--grid-unit)*1);color:var(--color-text-muted);content:attr(data-label);font-size:.625rem;font-weight:600;left:calc(var(--grid-unit)*1);letter-spacing:.05em;position:absolute;text-transform:uppercase}.demo-row{align-items:flex-end;display:flex;flex-wrap:wrap;gap:calc(var(--grid-unit)*3);margin-bottom:calc(var(--grid-unit)*4)}.demo-item{align-items:center;display:flex;flex-direction:column;gap:calc(var(--grid-unit)*1)}.demo-item__label{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.625rem}.code-block{background:var(--color-code-bg);border:1px solid var(--color-border);color:var(--color-code-text);font-family:var(--font-mono);font-size:.8125rem;line-height:1.7;margin:calc(var(--grid-unit)*3) 0;overflow-x:auto;padding:calc(var(--grid-unit)*3);position:relative;-moz-tab-size:4;-o-tab-size:4;tab-size:4;white-space:pre}.code-block:before{background:linear-gradient(to right,var(--color-accent) 20%,transparent 20%);background-size:.5rem .5rem;content:"";height:2rem;left:0;opacity:.1;position:absolute;right:0;top:0}.code-block pre{margin:0;white-space:pre}.code-block code{font-family:var(--font-mono);white-space:pre}.code-block .keyword{color:#c084fc}.code-block .class{color:#7dd3fc}.code-block .value{color:#fda4af}.code-block .string{color:#86efac}.code-block .comment{color:var(--color-code-comment);font-style:italic}.code-block .tag-hl{color:#86efac}.code-block .function{color:#fbbf24}.scale-demo{display:flex;flex-direction:column;gap:calc(var(--grid-unit)*1)}.scale-line{align-items:center;border-bottom:1px solid var(--color-border);display:flex;gap:calc(var(--grid-unit)*2);padding:calc(var(--grid-unit)*1.5) 0}.scale-line__label{color:var(--color-text-muted);min-width:5rem}.scale-line__label,.scale-line__value{font-family:var(--font-mono);font-size:.6875rem}.scale-line__value{color:var(--color-text-subtle);min-width:3.75rem}.scale-line__bar{background:var(--color-text);height:.5rem}.scale-line__text{flex:1}.number-grid{background:var(--color-border);border:1px solid var(--color-border);display:grid;gap:1px;grid-template-columns:repeat(auto-fill,minmax(5rem,1fr));overflow:hidden}.number-cell{background:var(--color-bg);padding:calc(var(--grid-unit)*2);text-align:center;transition:background var(--transition-fast)}.number-cell:hover{background:var(--color-bg-subtle)}.number-cell__value{color:var(--color-text);font-size:1.5rem;font-weight:600;line-height:1;margin-bottom:calc(var(--grid-unit)*.5)}.number-cell__label{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.625rem}.nav-wrapper{backdrop-filter:blur(.5rem);background:var(--color-bg);position:sticky;top:0;transition:background-color var(--transition-base);z-index:100}.nav{background:transparent;border-bottom:1px solid var(--color-border);margin:0 auto;max-width:calc(var(--max-width) + var(--grid-unit)*8);padding:calc(var(--grid-unit)*1.5) calc(var(--grid-unit)*4)}.nav__inner{gap:calc(var(--grid-unit)*3);justify-content:space-between;margin:0 auto;max-width:var(--max-width)}.nav__inner,.nav__logo{align-items:center;display:flex}.nav__logo{border:none;color:var(--color-text);font-size:1rem;font-weight:700;gap:calc(var(--grid-unit)*1);letter-spacing:-.02em;outline:none;text-decoration:none}.nav__logo-text{transition:color var(--transition-fast)}.nav__version{background:var(--color-bg-muted);color:var(--color-text-muted);font-size:.5625rem;font-weight:500;padding:.125rem .375rem}.nav__logo:focus .nav__logo-text,.nav__logo:hover .nav__logo-text{color:var(--color-accent)}.nav__logo:focus,.nav__logo:hover{border:none;outline:none}.nav__github{align-items:center;border:none;color:var(--color-text-muted);display:flex;height:2rem;justify-content:center;transition:color var(--transition-fast),background-color var(--transition-fast);width:2rem}.nav__github:hover{background:var(--color-bg-muted);border:none;color:var(--color-text)}.nav__links{display:flex;flex-wrap:wrap;gap:calc(var(--grid-unit)*.5)}.nav__link{border:none;border-radius:0;color:var(--color-text-muted);font-size:.6875rem;font-weight:500;letter-spacing:.05em;outline:none;padding:calc(var(--grid-unit)*.5) calc(var(--grid-unit)*1);text-transform:uppercase;transition:all var(--transition-fast)}.nav__link:focus,.nav__link:hover{border:none;color:var(--color-text);outline:none}.nav__link--active{background:var(--color-text)}.nav__link--active,.nav__link--active:hover{color:var(--color-bg)}.theme-toggle{align-items:center;background:transparent;border:1px solid var(--color-border);color:var(--color-text-muted);cursor:pointer;display:flex;height:2rem;justify-content:center;padding:0;transition:all var(--transition-fast);width:2rem}.theme-toggle:hover{background:var(--color-bg-muted);border-color:var(--color-text-muted);color:var(--color-text)}.theme-icon--dark,[data-theme=dark] .theme-icon--light{display:none}[data-theme=dark] .theme-icon--dark{display:block}.nav__dropdown{position:relative}.nav__dropdown-toggle{align-items:center;background:var(--color-bg);border:1px solid var(--color-border);color:var(--color-text-muted);cursor:pointer;display:flex;font-size:.6875rem;font-weight:500;gap:calc(var(--grid-unit)*.75);letter-spacing:.05em;outline:none;padding:calc(var(--grid-unit)*.75) calc(var(--grid-unit)*1.25);text-transform:uppercase;transition:all var(--transition-fast)}.nav__dropdown-toggle:focus,.nav__dropdown-toggle:hover{border-color:var(--color-text-muted);color:var(--color-text);outline:none}.nav__dropdown-toggle svg{transition:transform var(--transition-fast)}.nav__dropdown.open .nav__dropdown-toggle svg{transform:rotate(180deg)}.nav__dropdown-menu{background:var(--color-bg);border:1px solid var(--color-border);box-shadow:var(--shadow-lg);min-width:12.5rem;opacity:0;padding:calc(var(--grid-unit)*1) 0;position:absolute;right:0;top:100%;transform:translateY(-.5rem);transition:all var(--transition-base);visibility:hidden;z-index:1000}.nav__dropdown.open .nav__dropdown-menu{opacity:1;transform:translateY(.5rem);visibility:visible}.nav__dropdown-section{padding:calc(var(--grid-unit)*1) 0}.nav__dropdown-section:not(:last-child){border-bottom:1px solid var(--color-border)}.nav__dropdown-label{color:var(--color-text-subtle);display:block;font-size:.625rem;font-weight:600;letter-spacing:.08em;margin-bottom:calc(var(--grid-unit)*.5);padding:calc(var(--grid-unit)*.5) calc(var(--grid-unit)*2);text-transform:uppercase}.nav__dropdown-menu a{border:none;color:var(--color-text-muted);display:block;font-size:.8125rem;font-weight:400;outline:none;padding:calc(var(--grid-unit)*.75) calc(var(--grid-unit)*2);transition:all var(--transition-fast)}.nav__dropdown-menu a:last-child{border-bottom:none}.nav__dropdown-menu a:focus,.nav__dropdown-menu a:hover{background:var(--color-bg-muted);border:none;color:var(--color-text);outline:none}.nav__dropdown-menu a.is-active{color:var(--color-accent);font-weight:500;position:relative}.nav__mobile-toggle{align-items:center;background:transparent;border:1px solid var(--color-border);color:var(--color-text);cursor:pointer;display:flex;height:2.5rem;justify-content:center;padding:0;width:2.5rem;z-index:1001}.nav__mobile-toggle .icon-close,.nav__mobile-toggle[aria-expanded=true] .icon-menu{display:none}.nav__mobile-toggle[aria-expanded=true] .icon-close{display:block}@media(min-width:48rem){.nav__mobile-toggle{display:none}}.nav__right{align-items:center;display:flex;flex-wrap:wrap;gap:calc(var(--grid-unit)*1.5);justify-content:flex-end}@media(max-width:47.9375rem){.nav__right{align-items:stretch;background:var(--color-bg);bottom:0;flex-direction:column;justify-content:flex-start;left:0;opacity:0;overflow-y:auto;padding:5rem 1.5rem 1.5rem;position:fixed;right:0;top:0;transform:translateY(-1rem);transition:all var(--transition-base);visibility:hidden;z-index:1000}.nav__right.is-open{opacity:1;transform:translateY(0);visibility:visible}.nav__right .grid-controls{border-bottom:1px solid var(--color-border);flex-direction:column;margin-bottom:1rem;padding-bottom:1rem;width:100%}.nav__right .grid-controls button,.nav__right .theme-toggle{justify-content:flex-start;padding:.75rem 1rem;width:100%}.nav__right .theme-toggle{margin-bottom:1rem}.nav__right .nav__dropdown{width:100%}.nav__right .nav__dropdown-toggle{justify-content:space-between;width:100%}.nav__right .nav__dropdown-menu{border:none;border-top:1px solid var(--color-border);box-shadow:none;display:none;opacity:1;position:static;transform:none;visibility:visible}.nav__right .nav__dropdown.open .nav__dropdown-menu{display:block}.nav__right .nav__github{border-top:1px solid var(--color-border);justify-content:flex-start;margin-top:auto;padding:1rem 1rem .75rem;width:100%}.nav-wrapper.nav-open{bottom:0;left:0;position:fixed;right:0;top:0;z-index:999}}.sidebar{align-self:start;position:sticky;top:calc(var(--grid-unit)*8)}.sidebar__section{margin-bottom:calc(var(--grid-unit)*3)}.sidebar__title{color:var(--color-text-subtle);font-size:.625rem;font-weight:600;letter-spacing:.1em;margin-bottom:calc(var(--grid-unit)*1);text-transform:uppercase}.sidebar__list{list-style:none;margin:0;padding:0}.sidebar__list li{border-bottom:none}.sidebar__link,.sidebar__list li{padding:calc(var(--grid-unit)*.5) 0}.sidebar__link{border:none;color:var(--color-text-muted);display:block;font-size:.8125rem;transition:color var(--transition-fast)}.sidebar__link:hover{border:none;color:var(--color-text)}.sidebar__link--active{color:var(--color-text);font-weight:600}.table-scroll{overflow-x:auto;width:100%;-webkit-overflow-scrolling:touch;margin:calc(var(--grid-unit)*3) 0}.table-scroll:after{background:linear-gradient(to right,transparent,var(--color-bg));bottom:0;content:"";opacity:0;pointer-events:none;position:absolute;right:0;top:0;transition:opacity var(--transition-fast);width:1.5rem}@media(max-width:48rem){.table-scroll{position:relative}.table-scroll.is-scrollable:after{opacity:1}}.table-scroll .table{margin:0}.table{border:1px solid var(--color-border);border-collapse:collapse;font-size:.875rem;margin:calc(var(--grid-unit)*3) 0;overflow:hidden;width:100%}.table td,.table th{border-bottom:1px solid var(--color-border);padding:calc(var(--grid-unit)*1.5) calc(var(--grid-unit)*2);text-align:left;white-space:nowrap}@media(min-width:48rem){.table td,.table th{white-space:normal}}.table th{background:var(--color-bg-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.table caption,.table th{color:var(--color-text-muted)}.table caption{background:var(--color-bg-subtle);border:1px solid var(--color-border);caption-side:top;font-size:.75rem;font-weight:500;padding:.5rem 1rem;text-align:left}.table caption,.table tr:last-child td{border-bottom:none}.table tr:hover td{background:var(--color-bg-subtle)}.table td:first-child{font-weight:500}.table code{font-size:.75rem;padding:.125rem .375rem}.alert,.table code{background:var(--color-bg-muted)}.alert{border-left:.25rem solid var(--color-border-strong);margin:calc(var(--grid-unit)*3) 0;padding:calc(var(--grid-unit)*2) calc(var(--grid-unit)*2.5)}.alert--tip{background:rgba(34,197,94,.08);border-left-color:#22c55e}.alert--warning{background:rgba(245,158,11,.08);border-left-color:#f59e0b}.alert--danger{background:rgba(255,0,0,.08);border-left-color:var(--color-accent)}.alert__title{align-items:center;display:flex;font-size:.75rem;font-weight:600;gap:calc(var(--grid-unit)*.5);letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*.5);text-transform:uppercase}.alert p{font-size:.875rem;line-height:1.6;margin:0}.api-signature{background:var(--color-code-bg);color:#7dd3fc;font-family:var(--font-mono);font-size:.875rem;padding:calc(var(--grid-unit)*2)}.api-params,.api-signature{margin:calc(var(--grid-unit)*2) 0}.api-param{border-bottom:1px solid var(--color-border);display:grid;font-size:.875rem;gap:calc(var(--grid-unit)*2);grid-template-columns:8.75rem 6.25rem 1fr;padding:calc(var(--grid-unit)*1.5) 0}.api-param__name{font-family:var(--font-mono);font-weight:500}.api-param__type{font-family:var(--font-mono);font-size:.75rem}.api-param__desc,.api-param__type{color:var(--color-text-muted)}.footer{background:var(--color-bg-subtle);border-top:1px solid var(--color-border-strong);margin-top:calc(var(--grid-unit)*10);padding:calc(var(--grid-unit)*5) 0}.footer__content{align-items:flex-start;display:flex;flex-wrap:wrap;gap:calc(var(--grid-unit)*4);justify-content:space-between}.footer__left{display:flex;flex-direction:column;gap:calc(var(--grid-unit)*.5)}.footer__brand{color:var(--color-text);font-size:1rem;font-weight:700;letter-spacing:-.02em}.footer__tagline{color:var(--color-text-subtle);font-size:.75rem}.footer__right{align-items:flex-end;display:flex;flex-direction:column;gap:calc(var(--grid-unit)*1)}.footer__links{display:flex;gap:calc(var(--grid-unit)*2)}.footer__link{border:none;color:var(--color-text-muted);font-size:.75rem;font-weight:500;transition:color var(--transition-fast)}.footer__link:hover{border:none;color:var(--color-accent)}.footer__copyright{color:var(--color-text-subtle);font-size:.6875rem}@media(max-width:48rem){h1{font-size:2.5rem}h2{font-size:1.5rem}.header{padding:calc(var(--grid-unit)*4) 0}.grid-controls span,.nav__links,.sidebar{display:none}.api-param{gap:calc(var(--grid-unit)*.5);grid-template-columns:1fr}.footer__content{flex-direction:column}.footer__content,.footer__right{align-items:flex-start}}input[type=range]{--slider-track-h:0.1875rem;--slider-thumb:0.875rem;-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent;margin:0;padding:0;width:100%}input[type=range]:focus{outline:none}input[type=range]::-webkit-slider-runnable-track{background:var(--color-text);height:var(--slider-track-h)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--color-text);border:1px solid var(--color-text);height:var(--slider-thumb);margin-top:calc((var(--slider-track-h) - var(--slider-thumb))/2);width:var(--slider-thumb)}input[type=range]:focus-visible::-webkit-slider-thumb{outline:.125rem solid var(--color-accent);outline-offset:.125rem}input[type=range]::-moz-range-track{background:var(--color-text);height:var(--slider-track-h)}input[type=range]::-moz-range-thumb{background:var(--color-text);border:1px solid var(--color-text);height:var(--slider-thumb);width:var(--slider-thumb)}input[type=range]:focus-visible::-moz-range-thumb{outline:.125rem solid var(--color-accent);outline-offset:.125rem}.page--paper .paper-muted{color:var(--color-text-muted);font-size:.9375rem;margin-top:calc(var(--grid-unit)*-1)}.page--paper .paper-controls{background:var(--color-bg-subtle);border:1px solid var(--color-border);display:grid;gap:calc(var(--grid-unit)*2);grid-template-columns:1fr;margin:calc(var(--grid-unit)*2) 0;padding:calc(var(--grid-unit)*2)}@media(min-width:720px){.page--paper .paper-controls{align-items:end;grid-template-columns:1fr auto}}.page--paper .paper-field{display:grid;gap:calc(var(--grid-unit)*1)}.page--paper .paper-field__label{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.page--paper .paper-select{background:var(--color-bg);border:1px solid var(--color-border-strong);color:var(--color-text);font-family:var(--font-mono);font-size:.875rem;padding:calc(var(--grid-unit)*1) calc(var(--grid-unit)*1.5);width:100%}.page--paper .paper-orient{display:inline-flex;flex-wrap:wrap;gap:calc(var(--grid-unit)*1);justify-content:flex-start}.page--paper .paper-orient__btn{font-size:.625rem;outline:none;padding:calc(var(--grid-unit)*.75) calc(var(--grid-unit)*1.25)}.page--paper .paper-orient__btn:focus{outline:none}.page--paper .paper-preview-wrap{align-items:center;background:var(--color-bg-subtle);border:1px solid var(--color-border);display:flex;flex-direction:column;gap:calc(var(--grid-unit)*2);margin:calc(var(--grid-unit)*2) 0;min-height:28.125rem;padding:calc(var(--grid-unit)*3)}.page--paper .paper-preview-container{display:grid;height:26.25rem;place-items:center;width:100%}.page--paper .paper-preview{background:linear-gradient(90deg,rgba(0,0,0,.06) 1px,transparent 0),linear-gradient(rgba(0,0,0,.06) 1px,transparent 0);background-size:1.25rem 1.25rem;border:1px solid var(--color-border-strong);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;justify-content:flex-end;transition:width .3s ease,height .3s ease}.page--paper .paper-preview__meta{background:hsla(0,0%,100%,.95);border-top:1px solid var(--color-border);display:grid;gap:.25rem;padding:calc(var(--grid-unit)*1.5)}.page--paper .paper-preview__title{font-weight:700;letter-spacing:-.02em;text-transform:uppercase}.page--paper .paper-preview__dims{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.8125rem}.page--paper .paper-scale-indicator{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.05em;text-transform:uppercase}.page--paper .comparison-grid{display:grid;gap:calc(var(--grid-unit)*3);grid-template-columns:repeat(3,1fr);margin:calc(var(--grid-unit)*3) 0}@media(max-width:900px){.page--paper .comparison-grid{grid-template-columns:1fr}}.page--paper .comparison-column{background:var(--color-bg);border:1px solid var(--color-border);padding:calc(var(--grid-unit)*2)}.page--paper .comparison-heading{font-size:.875rem;font-weight:700;letter-spacing:.05em;margin:0 0 calc(var(--grid-unit)*.5) 0;text-transform:uppercase}.page--paper .comparison-desc{color:var(--color-text-muted);font-size:.75rem;line-height:1.5;margin:0 0 calc(var(--grid-unit)*2) 0}.page--paper .comparison-stack{align-items:flex-end;background:var(--color-bg-subtle);display:flex;height:18.75rem;justify-content:center;padding:calc(var(--grid-unit)*2);position:relative}.page--paper .comparison-sheet{align-items:flex-end;border:1px solid;bottom:calc(var(--grid-unit)*2);cursor:pointer;display:flex;justify-content:center;left:50%;padding:calc(var(--grid-unit)*1);position:absolute;transform:translateX(-50%);transition:all .2s ease}.page--paper .comparison-sheet:hover{box-shadow:var(--shadow-md);z-index:10!important}.page--paper .comparison-sheet--q{background:rgba(220,38,38,.08);border-color:var(--color-accent)}.page--paper .comparison-sheet--a{background:rgba(37,99,235,.08);border-color:#2563eb}.page--paper .comparison-sheet--us{background:rgba(22,163,74,.08);border-color:#16a34a}.page--paper .comparison-sheet__label{font-family:var(--font-mono);font-size:.625rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}.page--paper .comparison-sheet--q .comparison-sheet__label{color:var(--color-accent)}.page--paper .comparison-sheet--a .comparison-sheet__label{color:#2563eb}.page--paper .comparison-sheet--us .comparison-sheet__label{color:#16a34a}.page--paper .paper-table{border-collapse:collapse;margin-top:calc(var(--grid-unit)*2);width:100%}.page--paper .paper-table td,.page--paper .paper-table th{border-bottom:1px solid var(--color-border);font-size:.875rem;padding:calc(var(--grid-unit)*1.5) calc(var(--grid-unit)*1);text-align:left}.page--paper .paper-table th{color:var(--color-text-muted);font-size:.6875rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.page--paper .paper-usage{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.8125rem}.guide--layer{display:none;height:100%;inset:0;min-height:100vh;pointer-events:none;position:fixed;width:100%}.guide--layer.active{display:block!important}.guide--layer[data-grid=graph]{z-index:9998}.guide--layer[data-grid=baseline]{z-index:9999}.guide--layer.guide--graph_centered{background-image:linear-gradient(90deg,rgba(255,0,0,.1) 1px,transparent 0),linear-gradient(180deg,rgba(255,0,0,.1) 1px,transparent 0);background-size:.5rem .5rem}.guide--layer.guide--baseline{background-image:linear-gradient(180deg,rgba(0,150,255,.15) 1px,transparent 0);background-size:100% .5rem}.page--layers .layer-controls{display:flex;flex-wrap:wrap;gap:calc(var(--grid-unit)*1);margin:calc(var(--grid-unit)*3) 0}.page--layers .layer-btn{background:var(--color-bg);border:1px solid var(--color-border-strong);color:var(--color-text);cursor:pointer;font-family:var(--font-sans);font-size:.6875rem;font-weight:600;letter-spacing:.03em;padding:calc(var(--grid-unit)*.75) calc(var(--grid-unit)*1.5);text-transform:uppercase;transition:all var(--transition-fast)}.page--layers .layer-btn--active,.page--layers .layer-btn:hover{background:var(--color-text);color:var(--color-bg)}.page--layers .layer-demo{background:linear-gradient(90deg,var(--color-border) 1px,transparent 1px),linear-gradient(var(--color-border) 1px,transparent 1px);background-size:1.25rem 1.25rem;border:1px solid var(--color-border);height:25rem;margin:calc(var(--grid-unit)*3) 0;overflow:hidden;position:relative}.page--layers .layer-box{align-items:center;border:none;box-shadow:0 4px 12px rgba(0,0,0,.15);cursor:pointer;display:flex;flex-direction:column;font-size:.875rem;font-weight:600;height:8.75rem;justify-content:center;position:absolute;transition:transform .3s ease,opacity .3s ease,box-shadow .3s ease;width:11.25rem}.page--layers .layer-box:hover{box-shadow:0 8px 24px rgba(0,0,0,.25);transform:scale(1.05)}.page--layers .layer-box__name{font-size:1rem;font-weight:700;letter-spacing:.05em;margin-bottom:.25rem;text-transform:uppercase}.page--layers .layer-box__value{font-family:var(--font-mono);font-size:.75rem;opacity:.9}.page--layers .layer-box__zindex{font-family:var(--font-mono);font-size:.625rem;margin-top:.25rem;opacity:.7}.page--layers .layer-box--hidden{opacity:.08!important;pointer-events:none;transform:scale(.95)}.page--layers .z-canvas{background:linear-gradient(135deg,#1a1a2e,#16213e);color:#fff;left:17.5rem;top:12.5rem;z-index:1}.page--layers .z-content{background:linear-gradient(135deg,#0077b6,#00b4d8);color:#fff;left:13.75rem;top:10rem;z-index:2}.page--layers .z-interface{background:linear-gradient(135deg,#2d6a4f,#40916c);color:#fff;left:10rem;top:7.5rem;z-index:3}.page--layers .z-modal{background:linear-gradient(135deg,#d00000,#e85d04);color:#fff;left:6.25rem;top:5rem;z-index:4}.page--layers .z-guides{background:linear-gradient(135deg,#7209b7,#b5179e);color:#fff;left:2.5rem;top:2.5rem;z-index:5}.page--layers .layer-table{border-collapse:collapse;margin:calc(var(--grid-unit)*3) 0;width:100%}.page--layers .layer-table td,.page--layers .layer-table th{border-bottom:1px solid var(--color-border);padding:calc(var(--grid-unit)*1.5);text-align:left}.page--layers .layer-table th{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.page--layers .layer-table td{font-size:.875rem}.page--layers .layer-table td:first-child{font-weight:500}.page--layers .layer-table code{background:var(--color-bg-muted);font-family:var(--font-mono);font-size:.75rem;padding:.2em .4em}.page--layers .layer-swatch{display:inline-block;height:1rem;margin-right:.5rem;vertical-align:middle;width:1rem}.page--layers .stack-diagram{display:flex;flex-direction:column-reverse;gap:.25rem;margin:calc(var(--grid-unit)*3) 0;max-width:500px}.page--layers .stack-item{align-items:center;display:flex;font-size:.8125rem;font-weight:600;height:3rem;justify-content:space-between;letter-spacing:.03em;padding:0 calc(var(--grid-unit)*2);text-transform:uppercase}.page--layers .stack-item__z{font-family:var(--font-mono);font-size:.6875rem;font-weight:400;opacity:.9}.page--layers .stack-item--guides{background:linear-gradient(135deg,#7209b7,#b5179e);color:#fff}.page--layers .stack-item--modal{background:linear-gradient(135deg,#d00000,#e85d04);color:#fff}.page--layers .stack-item--interface{background:linear-gradient(135deg,#2d6a4f,#40916c);color:#fff}.page--layers .stack-item--content{background:linear-gradient(135deg,#0077b6,#00b4d8);color:#fff}.page--layers .stack-item--canvas{background:linear-gradient(135deg,#1a1a2e,#16213e);color:#fff}.page--layers .use-case-grid{display:grid;gap:calc(var(--grid-unit)*2);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin:calc(var(--grid-unit)*3) 0}.page--layers .use-case{background:var(--color-bg-muted);border:1px solid var(--color-border);padding:calc(var(--grid-unit)*2)}.page--layers .use-case__layer{display:inline-block;font-size:.6875rem;font-weight:600;letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*1);padding:.25rem .5rem;text-transform:uppercase}.page--layers .use-case__layer--guides{background:#7209b7;color:#fff}.page--layers .use-case__layer--modal{background:#d00000;color:#fff}.page--layers .use-case__layer--interface{background:#2d6a4f;color:#fff}.page--layers .use-case__layer--content{background:#0077b6;color:#fff}.page--layers .use-case__layer--canvas{background:#1a1a2e;color:#fff}.page--layers .use-case__title{font-size:.9375rem;font-weight:600;margin-bottom:.25rem}.page--layers .use-case__examples{color:var(--color-text-muted);font-size:.8125rem;margin:0}.page--device .device-status{display:grid;gap:calc(var(--grid-unit)*2);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin:calc(var(--grid-unit)*2) 0 calc(var(--grid-unit)*3)}.page--device .device-status__item{background:var(--color-bg);border:1px solid var(--color-border);padding:calc(var(--grid-unit)*2)}.page--device .device-status__label{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*1);text-transform:uppercase}.page--device .device-status__value{font-family:var(--font-mono);font-size:1rem;font-weight:600}.page--device .device-features{display:grid;gap:calc(var(--grid-unit)*3);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin:calc(var(--grid-unit)*2) 0}.page--device .device-feature-list{border-top:1px solid var(--color-border);list-style:none;margin:0;padding:0}.page--device .device-feature-list li{align-items:baseline;border-bottom:1px solid var(--color-border);display:flex;gap:calc(var(--grid-unit)*2);justify-content:space-between;padding:calc(var(--grid-unit)*1.5) 0}.page--device .device-feature-list__key{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.75rem}.page--device .device-feature-list__value{color:var(--color-text);font-family:var(--font-mono);font-size:.75rem;font-weight:700}.page--device .device-tip{margin-top:calc(var(--grid-unit)*3)}.page--device .device-muted{color:var(--color-text-muted);margin-top:calc(var(--grid-unit)*1)}.page--device .device-controls{align-items:flex-end;background:var(--color-bg-subtle);border:1px solid var(--color-border);display:flex;flex-wrap:wrap;gap:calc(var(--grid-unit)*2);justify-content:space-between;margin:calc(var(--grid-unit)*2) 0;padding:calc(var(--grid-unit)*2)}.page--device .device-search{display:grid;gap:calc(var(--grid-unit)*1);min-width:min(520px,100%)}.page--device .device-search__label{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.page--device .device-search__input{background:var(--color-bg);border:1px solid var(--color-border-strong);font-family:var(--font-mono);font-size:.8125rem;outline:none;padding:calc(var(--grid-unit)*1.25) calc(var(--grid-unit)*1.5);transition:box-shadow var(--transition-fast);width:100%}.page--device .device-search__input:focus{box-shadow:0 0 0 3px rgba(0,0,0,.12)}.page--device .device-match{min-width:160px;text-align:right}.page--device .device-match__label{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*1);text-transform:uppercase}.page--device .device-match__value{font-family:var(--font-mono);font-size:1rem;font-weight:700}.page--device .device-table{border-collapse:collapse;margin:calc(var(--grid-unit)*2) 0;width:100%}.page--device .device-table td,.page--device .device-table th{border-bottom:1px solid var(--color-border);padding:calc(var(--grid-unit)*1.5);text-align:left;vertical-align:top}.page--device .device-table th{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.page--device .device-table code{background:var(--color-bg-muted);font-family:var(--font-mono);font-size:.75rem;padding:.2em .4em;white-space:nowrap}.page--device .device-row.is-filtered{display:none}.page--device .device-row.is-match{background:rgba(255,0,0,.06)}.page--device .device-badge{align-items:center;background:var(--color-bg);border:1px solid var(--color-border-strong);display:inline-flex;font-family:var(--font-mono);font-size:.6875rem;justify-content:center;padding:.25em .5em;white-space:nowrap}.page--device .code-block{background:var(--color-bg-subtle);border:1px solid var(--color-border);margin:calc(var(--grid-unit)*2) 0;overflow:auto;padding:calc(var(--grid-unit)*2);-moz-tab-size:4;-o-tab-size:4;tab-size:4;white-space:pre}.page--device .code-block pre{font-family:var(--font-mono);font-size:.75rem;line-height:1.5;margin:0;white-space:pre}.page--qscale .qscale-metrics{display:grid;gap:calc(var(--grid-unit)*2);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin:calc(var(--grid-unit)*2) 0 calc(var(--grid-unit)*3)}.page--qscale .qscale-metrics__item{background:var(--color-bg);border:1px solid var(--color-border);padding:calc(var(--grid-unit)*2)}.page--qscale .qscale-metrics__label{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*1);text-transform:uppercase}.page--qscale .qscale-metrics__value{font-family:var(--font-mono);font-size:.875rem;font-weight:700}.page--qscale .qscale-controls{background:var(--color-bg-subtle);border:1px solid var(--color-border);display:grid;gap:calc(var(--grid-unit)*2);margin:calc(var(--grid-unit)*2) 0;padding:calc(var(--grid-unit)*2)}.page--qscale .qscale-slider{display:grid;gap:calc(var(--grid-unit)*1)}.page--qscale .qscale-slider__label{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.page--qscale #qs-range{width:100%}.page--qscale .qscale-chips{display:flex;flex-wrap:wrap;gap:calc(var(--grid-unit)*1)}.page--qscale .qscale-chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--color-bg);border:1px solid var(--color-border-strong);color:var(--color-text);cursor:pointer;font-family:var(--font-mono);font-size:.75rem;padding:.35em .6em;transition:background var(--transition-fast),color var(--transition-fast)}.page--qscale .qscale-chip.active,.page--qscale .qscale-chip:hover{background:var(--color-text);color:var(--color-bg)}.page--qscale .qscale-demo{display:grid;gap:calc(var(--grid-unit)*3);grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin:calc(var(--grid-unit)*3) 0}.page--qscale .qscale-demo__panel{background:var(--color-bg);border:1px solid var(--color-border);padding:calc(var(--grid-unit)*2)}.page--qscale .qscale-demo__title{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*1.5);text-transform:uppercase}.page--qscale .qscale-demo__row{align-items:center;display:grid;gap:calc(var(--grid-unit)*2);grid-template-columns:1fr 1fr}.page--qscale .qscale-box{background:linear-gradient(90deg,rgba(255,0,0,.12) 1px,transparent 0),linear-gradient(rgba(255,0,0,.12) 1px,transparent 0);background-size:.5rem .5rem;border:1px solid var(--color-border-strong);box-sizing:border-box;min-height:.5rem;min-width:.5rem}.page--qscale .qscale-demo__meta{display:grid;font-family:var(--font-mono);font-size:.75rem;gap:calc(var(--grid-unit)*.75)}.page--qscale .qscale-demo__line{border-bottom:1px solid var(--color-border);display:flex;gap:calc(var(--grid-unit)*2);justify-content:space-between;padding-bottom:calc(var(--grid-unit)*.5)}.page--qscale .qscale-demo__line .k{color:var(--color-text-muted)}.page--qscale .qscale-demo__line .v{color:var(--color-text);font-weight:700}.page--qscale .qscale-muted{color:var(--color-text-muted);margin-top:calc(var(--grid-unit)*1)}.page--qscale .qscale-util-grid{display:grid;gap:calc(var(--grid-unit)*1);margin-top:calc(var(--grid-unit)*2)}.page--qscale .qscale-util{align-items:baseline;background:var(--color-bg-subtle);border:1px solid var(--color-border);display:flex;gap:calc(var(--grid-unit)*2);justify-content:space-between;padding:calc(var(--grid-unit)*1.25) calc(var(--grid-unit)*1.5)}.page--qscale .qscale-util .c{font-family:var(--font-mono);font-size:.75rem;font-weight:700}.page--qscale .qscale-util .d{color:var(--color-text-muted);font-size:.75rem}.page--qscale .qscale-table{border-collapse:collapse;margin:calc(var(--grid-unit)*2) 0;width:100%}.page--qscale .qscale-table td,.page--qscale .qscale-table th{border-bottom:1px solid var(--color-border);padding:calc(var(--grid-unit)*1.5);text-align:left;vertical-align:top}.page--qscale .qscale-table th{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.page--qscale .qscale-table code{background:var(--color-bg-muted);font-family:var(--font-mono);font-size:.75rem;padding:.2em .4em;white-space:nowrap}.page--qscale .qscale-usage{color:var(--color-text-muted)}.page--qscale .qscale-use-cases{display:grid;gap:1.5rem;grid-template-columns:repeat(2,1fr);margin:2rem 0}.page--qscale .use-case{background:var(--color-bg-subtle);border:.0625rem solid var(--color-border);padding:1.5rem}.page--qscale .use-case h3{color:var(--color-text);font-size:1rem;font-weight:600;margin-bottom:1rem}.page--qscale .use-case ul{margin:0;padding-left:1.25rem}.page--qscale .use-case li{color:var(--color-text-muted);font-size:.875rem;line-height:1.5rem}.page--qscale .use-case:first-child h3{color:var(--color-success,#16a34a)}.page--qscale .use-case:last-child h3{color:var(--color-error,#dc2626)}@media(max-width:640px){.page--qscale .qscale-demo__row,.page--qscale .qscale-use-cases{grid-template-columns:1fr}}.page--breakpoints .bp-status{display:grid;gap:calc(var(--grid-unit)*2);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin:calc(var(--grid-unit)*3) 0}.page--breakpoints .bp-status__item{background:var(--color-bg);border:1px solid var(--color-border);padding:calc(var(--grid-unit)*2)}.page--breakpoints .bp-status__label{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;margin-bottom:.375rem;text-transform:uppercase}.page--breakpoints .bp-status__value{font-family:var(--font-mono);font-size:1.125rem;font-weight:500;letter-spacing:-.01em}.page--breakpoints .bp-table{border-collapse:collapse;margin:calc(var(--grid-unit)*3) 0;width:100%}.page--breakpoints .bp-table td,.page--breakpoints .bp-table th{border-bottom:1px solid var(--color-border);padding:calc(var(--grid-unit)*1.5);text-align:left;vertical-align:top}.page--breakpoints .bp-table th{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.page--breakpoints .bp-row.active{background:var(--color-bg-muted);outline:2px solid var(--color-border-strong);outline-offset:-2px}.page--breakpoints .bp-mult{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.75rem}.page--breakpoints .bp-demo-card{background:var(--color-bg);border:1px solid var(--color-border-strong);margin-top:calc(var(--grid-unit)*2)}.page--breakpoints .bp-demo-card__title{font-weight:700;letter-spacing:-.02em;margin-bottom:.375rem}.page--breakpoints .bp-demo-card__meta{color:var(--color-text-muted);font-size:.875rem}.layer-stack{display:flex;flex-direction:column;gap:.125rem;margin:calc(var(--grid-unit)*3) 0}.layer-stack__item{align-items:center;background:var(--color-bg-muted);border-left:4px solid var(--color-border-strong);display:grid;gap:calc(var(--grid-unit)*2);grid-template-columns:120px 120px 1fr;padding:calc(var(--grid-unit)*2)}.layer-stack__item--guides{background:linear-gradient(90deg,rgba(114,9,183,.1),transparent);border-left-color:#7209b7}.layer-stack__item--modal{background:linear-gradient(90deg,rgba(208,0,0,.1),transparent);border-left-color:#d00000}.layer-stack__item--interface{background:linear-gradient(90deg,rgba(45,106,79,.1),transparent);border-left-color:#2d6a4f}.layer-stack__item--content{background:linear-gradient(90deg,rgba(0,119,182,.1),transparent);border-left-color:#0077b6}.layer-stack__item--canvas{background:linear-gradient(90deg,rgba(26,26,46,.15),transparent);border-left-color:#1a1a2e}.layer-stack__name{font-family:var(--font-mono);font-size:.9375rem;font-weight:600}.layer-stack__value{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.8125rem}.layer-stack__desc{color:var(--color-text-muted);font-size:.875rem}@media(max-width:640px){.layer-stack__item{gap:calc(var(--grid-unit)*.5);grid-template-columns:1fr}.layer-stack__desc{margin-top:calc(var(--grid-unit)*.5)}}.best-practices{display:grid;gap:calc(var(--grid-unit)*3);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:calc(var(--grid-unit)*3) 0}.best-practice{border:1px solid var(--color-border);padding:calc(var(--grid-unit)*2.5)}.best-practice h4{font-size:.9375rem;font-weight:600;margin:0 0 calc(var(--grid-unit)*1)}.best-practice p{color:var(--color-text-muted);font-size:.875rem;line-height:1.5;margin:0}.highlight-box{background:var(--color-bg-muted);border-left:4px solid var(--color-border-strong);margin:calc(var(--grid-unit)*3) 0;padding:calc(var(--grid-unit)*3)}.highlight-box h4{font-size:.9375rem;font-weight:600;margin:0 0 calc(var(--grid-unit)*1)}.highlight-box p{font-size:.9375rem;line-height:1.6;margin:0}.principles-grid{display:grid;gap:calc(var(--grid-unit)*3);grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:calc(var(--grid-unit)*3) 0}.principle{border-top:2px solid var(--color-border-strong);padding-top:calc(var(--grid-unit)*2)}.principle h4{font-size:.9375rem;font-weight:600;margin:0 0 calc(var(--grid-unit)*1)}.principle p{color:var(--color-text-muted);font-size:.875rem;line-height:1.5;margin:0}.philosophy{display:flex;flex-direction:column;gap:calc(var(--grid-unit)*3);margin:calc(var(--grid-unit)*3) 0}.philosophy__item{border-left:3px solid var(--color-border);padding-left:calc(var(--grid-unit)*3)}.philosophy__item h4{font-size:1rem;font-weight:600;margin:0 0 calc(var(--grid-unit)*1)}.philosophy__item p{color:var(--color-text-muted);font-size:.9375rem;line-height:1.6;margin:0}.quote{background:var(--color-bg-muted);border-left:4px solid var(--color-accent);margin:calc(var(--grid-unit)*4) 0;padding:calc(var(--grid-unit)*3)}.quote blockquote{color:var(--color-text);font-size:1.125rem;font-style:italic;line-height:1.6;margin:0 0 calc(var(--grid-unit)*2)}.quote cite{color:var(--color-text-muted);font-size:.875rem;font-style:normal}.cta-links{display:flex;flex-wrap:wrap;gap:calc(var(--grid-unit)*2);margin:calc(var(--grid-unit)*3) 0}.button{align-items:center;background:var(--color-text);color:var(--color-bg);display:inline-flex;font-size:.875rem;font-weight:500;padding:calc(var(--grid-unit)*1.5) calc(var(--grid-unit)*3);text-decoration:none;transition:background var(--transition-fast)}.button:hover{background:var(--color-text-muted)}.button--secondary{background:var(--color-bg);border:1px solid var(--color-border-strong);color:var(--color-text)}.button--secondary:hover{background:var(--color-bg-muted)}.density-current{display:grid;gap:calc(var(--grid-unit)*2);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin:calc(var(--grid-unit)*3) 0}.density-current__item{background:var(--color-bg-muted);padding:calc(var(--grid-unit)*2.5);text-align:center}.density-current__label{color:var(--color-text-muted);display:block;font-size:.6875rem;font-weight:600;letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*1);text-transform:uppercase}.density-current__value{color:var(--color-text);display:block;font-family:var(--font-mono);font-size:1.5rem;font-weight:600}.density-visual{display:grid;gap:calc(var(--grid-unit)*3);grid-template-columns:repeat(3,1fr);margin:calc(var(--grid-unit)*4) 0}@media(max-width:640px){.density-visual{grid-template-columns:1fr}}.density-visual__box{text-align:center}.density-visual__grid{background:var(--color-bg);border:2px solid var(--color-border-strong);height:5rem;margin:0 auto calc(var(--grid-unit)*2);position:relative;width:5rem}.density-visual__grid:after,.density-visual__grid:before{background:var(--color-border);content:"";position:absolute}.density-visual__grid--1x:before{height:1px;left:0;top:50%;width:100%}.density-visual__grid--1x:after{height:100%;left:50%;top:0;width:1px}.density-visual__grid--2x{background:linear-gradient(var(--color-border) 1px,transparent 1px),linear-gradient(90deg,var(--color-border) 1px,transparent 1px);background-size:50% 50%}.density-visual__grid--3x{background:linear-gradient(var(--color-border) 1px,transparent 1px),linear-gradient(90deg,var(--color-border) 1px,transparent 1px);background-size:33.333% 33.333%}.density-visual__label{display:block;font-size:.9375rem;font-weight:600;margin-bottom:calc(var(--grid-unit)*.5)}.density-visual__desc{color:var(--color-text-muted);display:block;font-size:.8125rem}.density-baseline{color:var(--color-text-muted);font-size:.6875rem;font-weight:400}.density-calculator,.density-row--highlight{background:var(--color-bg-muted)}.density-calculator{margin:calc(var(--grid-unit)*3) 0;padding:calc(var(--grid-unit)*3)}.density-calc__input{margin-bottom:calc(var(--grid-unit)*3)}.density-calc__input label{color:var(--color-text-muted);display:block;font-size:.75rem;font-weight:600;letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*1);text-transform:uppercase}.density-calc__input input{background:var(--color-bg);border:2px solid var(--color-border-strong);color:var(--color-text);font-family:var(--font-mono);font-size:1.5rem;max-width:200px;padding:calc(var(--grid-unit)*1.5);transition:border-color var(--transition-fast);width:100%}.density-calc__input input:focus{border-color:var(--color-accent);outline:none}.density-calc__results{display:grid;gap:calc(var(--grid-unit)*2);grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}.density-calc__result{background:var(--color-bg);border-left:3px solid var(--color-border);padding:calc(var(--grid-unit)*2)}.density-calc__label{color:var(--color-text-muted);display:block;font-size:.6875rem;font-weight:600;letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*.5);text-transform:uppercase}.density-calc__value{color:var(--color-text);font-family:var(--font-mono);font-size:1rem;font-weight:500}.scale-comparison{border:1px solid var(--color-border);display:flex;flex-direction:column;font-family:var(--font-mono);font-size:.875rem;gap:0;overflow:hidden}.scale-row{border-bottom:1px solid var(--color-border);display:grid;grid-template-columns:repeat(5,1fr)}.scale-row:last-child{border-bottom:none}.scale-row.scale-header{font-size:.75rem;letter-spacing:.05em;text-transform:uppercase}.scale-row.scale-header,.scale-row.scale-lcm{background:var(--color-bg-alt);font-weight:600}.scale-cell{border-right:1px solid var(--color-border);padding:calc(var(--grid-unit)*1.5) calc(var(--grid-unit)*2);text-align:center}.scale-cell:last-child{border-right:none}.scale-cell.highlight-type{background:rgba(59,130,246,.1);color:var(--color-accent);font-weight:500}.scale-cell.highlight-line{background:rgba(16,185,129,.1);color:#10b981;font-weight:500}[data-theme=dark] .scale-cell.highlight-type{background:rgba(59,130,246,.15)}[data-theme=dark] .scale-cell.highlight-line{background:rgba(16,185,129,.15)}.grid-demo{display:flex;flex-direction:column;gap:calc(var(--grid-unit)*4)}.grid-container{position:relative}.grid-container.combined{margin-top:calc(var(--grid-unit)*2)}.grid-label{color:var(--color-text-muted);font-size:.75rem;font-weight:600;letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*1);text-transform:uppercase}.grid-combined,.grid-line-scale,.grid-type{background:var(--color-bg-alt);border:1px solid var(--color-border);height:60px;position:relative}.grid-combined .grid-line,.grid-line-scale .grid-line,.grid-type .grid-line{background:var(--color-border-strong);height:100%;left:var(--offset);position:absolute;top:0;width:1px}.grid-combined .grid-line.lcm,.grid-line-scale .grid-line.lcm,.grid-type .grid-line.lcm{background:var(--color-accent);width:2px}.grid-type .grid-line{background:rgba(59,130,246,.4)}.grid-type .grid-line.lcm{background:var(--color-accent)}.grid-line-scale .grid-line{background:rgba(16,185,129,.4)}.grid-line-scale .grid-line.lcm{background:#10b981}.grid-combined .grid-line.type{background:rgba(59,130,246,.4);height:50%;top:0}.grid-combined .grid-line.line{background:rgba(16,185,129,.4);height:50%;top:50%}.grid-combined .grid-line.lcm{background:var(--color-accent);height:100%;top:0;width:2px}.grid-combined .grid-line span{bottom:-18px;color:var(--color-text-muted);font-family:var(--font-mono);font-size:.625rem;left:50%;position:absolute;transform:translateX(-50%);white-space:nowrap}.info-box,.insight-box{background:var(--color-bg-alt);border:1px solid var(--color-border);margin-top:calc(var(--grid-unit)*3);padding:calc(var(--grid-unit)*3)}.info-box h4,.insight-box h4{color:var(--color-text);font-size:.875rem;font-weight:600;margin-bottom:calc(var(--grid-unit)*1.5)}.info-box p,.insight-box p{font-size:.875rem;margin-bottom:calc(var(--grid-unit)*1)}.info-box p:last-child,.insight-box p:last-child{margin-bottom:0}.info-box code,.insight-box code{background:var(--color-bg);font-family:var(--font-mono);font-size:.875em;padding:.15em .4em}.insight-box{border-left:3px solid var(--color-accent)}.insight-box h3{font-size:1.125rem}.insight-box h3,.insight-box ul{margin-bottom:calc(var(--grid-unit)*2)}.insight-box ul{padding-left:calc(var(--grid-unit)*3)}.insight-box li{font-size:.875rem;margin-bottom:calc(var(--grid-unit)*1)}.highlight-row{background:var(--color-bg-alt);font-weight:600}.type-demo{display:flex;flex-direction:column;gap:calc(var(--grid-unit)*3);margin-top:calc(var(--grid-unit)*3)}.type-sample{background:var(--color-bg-alt);border:1px solid var(--color-border);padding:calc(var(--grid-unit)*3);position:relative}.type-sample p{margin:0}.type-label{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.625rem;letter-spacing:.05em;position:absolute;right:calc(var(--grid-unit)*1.5);text-transform:uppercase;top:calc(var(--grid-unit)*1)}.body-sample p{font-size:16px;line-height:25px}.small-sample p{font-size:12px;line-height:20px}.heading-sample p{font-size:24px;font-weight:600;line-height:30px}.display-sample p{font-size:40px;font-weight:700;line-height:40px}.scale-explorer{background:var(--color-bg-subtle);border:.0625rem solid var(--color-border);margin:1.875rem 0;padding:1.875rem}.explorer-controls{display:flex;flex-direction:column;gap:1.25rem;margin-bottom:1.875rem}.explorer-slider{align-items:center;display:flex;gap:1.25rem}.explorer-slider label{font-weight:500;min-width:6.25rem}.explorer-slider input[type=range]{-webkit-appearance:none;background:var(--color-border);flex:1;height:.5rem}.explorer-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--color-accent);cursor:pointer;height:1.25rem;width:1.25rem}.slider-value{font-family:var(--font-mono);font-size:1.25rem;font-weight:600;line-height:1.5625rem;min-width:2.5rem;text-align:center}.explorer-chips{align-items:center;display:flex;flex-wrap:wrap;gap:.625rem}.chip-label{color:var(--color-text-muted)}.chip,.chip-label{font-size:.875rem;line-height:1.25rem}.chip{background:transparent;border:.0625rem solid var(--color-border);cursor:pointer;font-family:var(--font-mono);padding:.3125rem .9375rem;transition:all .15s ease}.chip.active,.chip:hover{border-color:var(--color-accent)}.chip.active{background:var(--color-accent);color:#fff}.explorer-display{align-items:start;display:grid;gap:1.875rem;grid-template-columns:1fr auto}.explorer-metrics{display:grid;gap:1.25rem;grid-template-columns:repeat(3,1fr)}.metric-card{background:var(--color-bg);border:.0625rem solid var(--color-border);padding:1.25rem;text-align:center}.metric-card h4{color:var(--color-text-muted);font-size:.75rem;letter-spacing:.05em;line-height:.9375rem;margin:0 0 .625rem;text-transform:uppercase}.metric-main{font-family:var(--font-mono);font-size:1.75rem;font-weight:700;line-height:2.1875rem;margin-bottom:.625rem}.type-card .metric-main{color:#2563eb}.line-card .metric-main{color:#d946ef}.lcm-card .metric-main{color:#16a34a}.metric-details{color:var(--color-text-muted);display:flex;font-family:var(--font-mono);font-size:.75rem;gap:.9375rem;justify-content:center;line-height:.9375rem}.metric-details .aligned{color:#16a34a;font-weight:500}.explorer-preview,.preview-box{align-items:center;display:flex;justify-content:center}.preview-box{background:linear-gradient(135deg,rgba(37,99,235,.2),rgba(217,70,239,.2));border:.125rem solid var(--color-accent);height:7.5rem;position:relative;transition:all .3s ease;width:7.5rem}.preview-label{bottom:-1.875rem;color:var(--color-text-muted);font-size:.75rem;line-height:.9375rem;position:absolute}.grid-comparison-large{background:var(--color-bg-subtle);border:.0625rem solid var(--color-border);margin:1.875rem 0;padding:1.875rem}.grid-row{align-items:center;display:grid;gap:1.25rem;grid-template-columns:8.75rem 1fr;margin-bottom:1.25rem}.grid-row.combined{border-top:.125rem dashed var(--color-border);margin-top:1.875rem;padding-top:1.875rem}.grid-label{display:flex;flex-direction:column;gap:.3125rem}.label-title{font-size:.875rem;font-weight:600;line-height:1.25rem}.label-value{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.75rem;line-height:.9375rem}.grid-canvas{background:var(--color-bg);border:.0625rem solid var(--color-border);height:5rem;overflow:hidden;position:relative}.grid-line{bottom:0;position:absolute;top:0;width:.0625rem}.grid-line.type{background:rgba(37,99,235,.6)}.grid-line.line-scale{background:rgba(217,70,239,.6)}.grid-line.lcm{background:rgba(22,163,74,.9);width:.125rem}.grid-legend{border-top:.0625rem solid var(--color-border);display:flex;gap:2.5rem;justify-content:center;margin-top:1.25rem;padding-top:1.25rem}.legend-item{align-items:center;display:flex;font-size:.875rem;gap:.625rem;line-height:1.25rem}.legend-item.type .legend-color{background:#2563eb}.legend-item.line .legend-color{background:#d946ef}.legend-item.lcm .legend-color{background:#16a34a}.legend-color{height:.25rem;width:1.25rem}.math-foundation{display:grid;gap:1.875rem;margin:1.875rem 0}.foundation-card{background:var(--color-bg-subtle);border:.0625rem solid var(--color-border);padding:1.875rem}.foundation-card h3{font-size:1.25rem;line-height:1.5625rem;margin:0 0 1.25rem}.math-formula{background:var(--color-bg);margin-bottom:1.25rem;padding:1.25rem;text-align:center}.math-formula code{font-size:1.25rem;font-weight:600;line-height:1.5625rem}.math-example{color:var(--color-text-muted);display:flex;flex-direction:column;font-family:var(--font-mono);font-size:.875rem;gap:.3125rem;line-height:1.25rem}.math-example strong{color:#16a34a}.hcn-grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(11.25rem,1fr));margin-top:1.25rem}.hcn-item{background:var(--color-bg);border:.0625rem solid var(--color-border);padding:1.25rem;text-align:center}.hcn-item.highlight{background:rgba(22,163,74,.05);border-color:#16a34a}.hcn-number{color:var(--color-accent);display:block;font-family:var(--font-mono);font-size:1.5rem;font-weight:700;line-height:1.875rem;margin-bottom:.625rem}.hcn-divisors{font-family:var(--font-mono);margin-bottom:.3125rem;word-break:break-all}.hcn-count,.hcn-divisors{color:var(--color-text-muted);display:block;font-size:.75rem;line-height:.9375rem}.hcn-badge,.hcn-count{font-weight:500}.hcn-badge{background:rgba(22,163,74,.1);color:#16a34a;display:inline-block;font-family:var(--font-mono);font-size:.75rem;line-height:.9375rem;padding:.3125rem .625rem}.scale-table .lcm-row{background:rgba(22,163,74,.05)}.scale-table .aligned{color:#16a34a;font-weight:600}.scale-table .not-aligned{color:var(--color-text-muted)}.function-grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(17.5rem,1fr));margin:1.875rem 0}.function-card{background:var(--color-bg-subtle);border:.0625rem solid var(--color-border);padding:1.5625rem}.function-card h4{font-family:var(--font-mono);margin:0 0 .625rem}.function-card p{color:var(--color-text-muted);font-size:.875rem;line-height:1.25rem;margin:0 0 1.25rem}.function-card pre{background:var(--color-bg);font-size:.75rem;line-height:1.25rem;margin:0;overflow-x:auto;padding:.9375rem}.typography-demo{margin:1.875rem 0}.type-specimen{border-bottom:.0625rem solid var(--color-border);padding:1.25rem 0;position:relative}.type-specimen:last-child{border-bottom:none}.type-specimen p{font-size:var(--type-size);line-height:var(--line-height);margin:0}.specimen-label{color:var(--color-text-muted);display:block;font-family:var(--font-mono);font-size:.75rem;line-height:.9375rem;margin-bottom:.625rem}.benefits-grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(13.75rem,1fr));margin:1.875rem 0}.benefit-card{background:var(--color-bg-subtle);border:.0625rem solid var(--color-border);padding:1.5625rem;text-align:center}.benefit-card h4{font-size:1rem;line-height:1.25rem;margin:0 0 .625rem}.benefit-card p{color:var(--color-text-muted);font-size:.875rem;line-height:1.25rem;margin:0}.benefit-icon{font-size:2rem;line-height:2.5rem;margin-bottom:.9375rem}@media(max-width:768px){.explorer-display,.explorer-metrics{grid-template-columns:1fr}.explorer-preview{order:-1}.grid-row{grid-template-columns:1fr}.grid-label{align-items:center;flex-direction:row;justify-content:space-between}}.ratio-grid{display:grid;gap:calc(var(--grid-unit)*3);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin:calc(var(--grid-unit)*4) 0}.ratio-card{border:1px solid var(--color-border)}.ratio-card__preview{align-items:center;background:var(--color-text);display:flex;justify-content:center}.ratio-card__inner{color:var(--color-bg);font-family:var(--font-mono);font-size:.75rem;opacity:.6}.ratio-card__info{background:var(--color-bg);padding:calc(var(--grid-unit)*1.5)}.ratio-card__name{font-size:.875rem;font-weight:600;margin:0 0 calc(var(--grid-unit)*.5)}.ratio-card__value{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.6875rem;margin:0}.ratio-table{border-collapse:collapse;margin:calc(var(--grid-unit)*3) 0;width:100%}.ratio-table td,.ratio-table th{border-bottom:1px solid var(--color-border);padding:calc(var(--grid-unit)*1.5);text-align:left}.ratio-table th{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.ratio-table td{font-size:.875rem}.ratio-table td:first-child{font-weight:500}.ratio-table code{background:var(--color-bg-muted);font-family:var(--font-mono);font-size:.75rem;padding:.2em .4em}.use-case-grid{display:grid;gap:calc(var(--grid-unit)*2);grid-template-columns:repeat(3,1fr);margin:calc(var(--grid-unit)*3) 0}@media(max-width:640px){.use-case-grid{grid-template-columns:1fr 1fr}}.use-case{text-align:center}.use-case__box{background:var(--color-bg-muted);border:1px solid var(--color-border);margin-bottom:calc(var(--grid-unit)*1)}.use-case__label{font-size:.75rem;font-weight:500}.use-case__ratio{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.625rem}.prose{max-width:65ch}.prose p{color:var(--color-text-muted);font-size:1rem;line-height:1.75;margin-bottom:1.5em}.prose p:first-of-type{color:var(--color-text);font-size:1.125rem}.prose p:first-of-type:first-letter{float:left;font-size:3.5rem;font-weight:600;line-height:1;margin-right:.5rem;margin-top:.1em}.text-sample{border-left:4px solid var(--color-text);margin:calc(var(--grid-unit)*4) 0;padding-left:calc(var(--grid-unit)*3)}.text-sample--quote{border-left-color:var(--color-accent)}.text-sample blockquote{color:var(--color-text);font-size:1.25rem;font-style:italic;margin:0 0 calc(var(--grid-unit)*1)}.text-sample cite{color:var(--color-text-muted);font-size:.875rem;font-style:normal}.type-comparison{display:grid;gap:calc(var(--grid-unit)*4);grid-template-columns:1fr 1fr;margin:calc(var(--grid-unit)*4) 0}@media(max-width:768px){.type-comparison{grid-template-columns:1fr}}.type-column h4{color:var(--color-text-muted);font-size:.6875rem;font-weight:600;letter-spacing:.05em;margin-bottom:calc(var(--grid-unit)*2);text-transform:uppercase}.type-column p{margin:0}.type-line{align-items:baseline;border-bottom:1px solid var(--color-border);display:flex;padding:calc(var(--grid-unit)*1.5) 0}.type-line__label{color:var(--color-text-muted);min-width:100px}.type-line__label,.type-line__size{flex-shrink:0;font-family:var(--font-mono);font-size:.625rem}.type-line__size{color:var(--color-text-subtle);min-width:60px}.type-line__text{color:var(--color-text);font-weight:400}.rhythm-row{align-items:flex-end;display:flex;gap:calc(var(--grid-unit)*1);margin:calc(var(--grid-unit)*3) 0}.rhythm-block{background:var(--color-text);width:48px}.rhythm-block__label{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.5625rem;margin-top:calc(var(--grid-unit)*.5);text-align:center}.width-specimen{margin:calc(var(--grid-unit)*3) 0}.width-line{align-items:center;border-bottom:1px solid var(--color-border);display:flex;gap:calc(var(--grid-unit)*2);padding:calc(var(--grid-unit)*1.5) 0}.width-bar{background:var(--color-text);height:6px}.width-label{color:var(--color-text-muted);flex-shrink:0;font-family:var(--font-mono);font-size:.625rem;min-width:100px}.modular-scale{margin:calc(var(--grid-unit)*3) 0}.modular-item{align-items:center;border-bottom:1px solid var(--color-border);display:flex;gap:calc(var(--grid-unit)*2);padding:calc(var(--grid-unit)*1.5) 0}.modular-item__ratio{color:var(--color-accent);flex-shrink:0;font-family:var(--font-mono);font-size:.625rem;min-width:120px}.modular-item__bar{background:var(--color-text);height:16px}.grid-unit-demo{background:var(--color-border);border:1px solid var(--color-border);display:grid;gap:1px;grid-template-columns:repeat(8,1fr);margin:calc(var(--grid-unit)*3) 0;max-width:320px}.grid-unit-demo__cell{align-items:center;aspect-ratio:1;background:var(--color-bg-muted);color:var(--color-text-muted);display:flex;font-family:var(--font-mono);font-size:.5rem;justify-content:center}.grid-unit-demo__cell--filled{background:var(--color-text);color:var(--color-bg)}.utility-grid{display:grid;gap:calc(var(--grid-unit)*2);grid-template-columns:repeat(auto-fill,minmax(100px,1fr));margin:calc(var(--grid-unit)*3) 0}.utility-box{align-items:center;background:var(--color-text);color:var(--color-bg);display:flex;font-family:var(--font-mono);font-size:.625rem;font-weight:500;justify-content:center;min-height:48px;text-align:center}.padding-demo{background:var(--color-bg-muted);border:1px solid var(--color-border)}.padding-inner{background:var(--color-text);color:var(--color-bg);font-family:var(--font-mono);font-size:.5625rem;padding:calc(var(--grid-unit)*1);text-align:center}.margin-demo{background:var(--color-bg-muted);border:1px dashed var(--color-border);display:inline-block}.margin-inner{align-items:center;background:var(--color-text);color:var(--color-bg);display:flex;font-family:var(--font-mono);font-size:.5625rem;height:32px;justify-content:center;text-align:center;width:48px}.gap-demo{background:var(--color-bg-muted);border:1px solid var(--color-border);display:flex;padding:calc(var(--grid-unit)*1)}.gap-item{height:24px;width:24px}.gap-item,.size-box{background:var(--color-text)}.border-demo{background:var(--color-bg-muted);border-color:var(--color-text);border-style:solid;height:32px;width:48px}.radius-demo{background:var(--color-text);height:48px;width:48px}.inset-demo{background:var(--color-bg-muted);border:1px solid var(--color-border);height:60px;position:relative;width:80px}.inset-item{background:var(--color-accent);height:16px;position:absolute;width:16px}.responsive-demo{background:var(--color-text);color:var(--color-bg);font-weight:500;text-align:center;transition:all .3s ease}.responsive-demo p{margin:0;max-width:none}.scale-bar{background:var(--color-text);height:6px}.scale-reference{align-items:center;border-bottom:1px solid var(--color-border);display:flex;gap:calc(var(--grid-unit)*2);padding:calc(var(--grid-unit)*1.5) 0}.scale-reference__label{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.6875rem;min-width:100px}.card-demo{background:var(--color-bg);border:1px solid var(--color-text);max-width:320px}.card-demo h4{font-size:1rem;margin:0 0 calc(var(--grid-unit)*1)}.card-demo p{color:var(--color-text-muted);font-size:.875rem;margin:0 0 calc(var(--grid-unit)*2)}.btn-demo{border:none;cursor:pointer;font-family:var(--font-sans);font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.btn-demo--primary{background:var(--color-text);color:var(--color-bg)}.btn-demo--secondary{background:var(--color-bg);border:1px solid var(--color-text);color:var(--color-text)}.breakpoint-tag{background:var(--color-bg-muted);color:var(--color-text-muted);display:inline-block;font-family:var(--font-mono);font-size:.5625rem;font-weight:600;letter-spacing:.05em;margin-right:calc(var(--grid-unit)*.5);padding:.25em .5em;text-transform:uppercase}.baseline-demo,.breakpoint-tag{border:1px solid var(--color-border)}.baseline-demo{margin:calc(var(--grid-unit)*3) 0;position:relative}.baseline-content{padding:calc(var(--grid-unit)*3);position:relative;z-index:1}.baseline-content h3{margin-top:0}.baseline-content p{max-width:45ch}.toggle-btn{background:var(--color-text);border:none;bottom:calc(var(--grid-unit)*3);color:var(--color-bg);cursor:pointer;font-family:var(--font-sans);font-size:.6875rem;font-weight:600;letter-spacing:.05em;padding:calc(var(--grid-unit)*1) calc(var(--grid-unit)*2);position:fixed;right:calc(var(--grid-unit)*3);text-transform:uppercase;transition:opacity .2s;z-index:10000}.toggle-btn:hover{opacity:.8}.rhythm-example{margin:calc(var(--grid-unit)*3) 0}.rhythm-spec{align-items:baseline;display:flex;gap:calc(var(--grid-unit)*4);margin-top:calc(var(--grid-unit)*1)}.rhythm-spec__item{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.625rem}
+/*# sourceMappingURL=to.css.map */