:root{--color-bg-primary:#fff;--color-bg-secondary:#f5f5f5;--color-bg-contrast:#ececec;--color-text-primary:#111;--color-text-secondary:#555;--color-brand-primary:#7f7af2;--color-neutral-contrast:#b8b8b8;--color-border-strong:#9a9a9a;--color-error:#d93025;--color-debug-outline:#00000014;--font-family-primary:"Inter", Arial, sans-serif;--font-size-heading-1:2rem;--font-size-heading-2:1.5rem;--font-size-subheading:1.125rem;--font-size-text:1rem;--font-size-text-small:.875rem;--font-weight-regular:400;--font-weight-semibold:600;--font-weight-bold:700;--line-height-heading:1.2;--line-height-text:1.5;--space-xs:4px;--space-sm:8px;--space-md:12px;--space-lg:16px;--space-xl:24px;--space-2xl:32px;--space-3xl:48px;--space-4xl:64px;--nav-width:228px;--header-height:72px;--page-min-width:320px;--width-standard:520px;--width-content:1180px;--width-mobile-preview:390px;--width-toggle:50px;--height-control:48px;--height-input:64px;--height-textarea:112px;--height-preview:360px;--height-preview-mobile:256px;--height-section-min:500px;--height-table-row:68px;--height-table-row-large:86px;--height-card-content:72px;--height-nav-brand:34px;--height-nav-footer-content:46px;--size-control-compact:38px;--size-swatch-width:42px;--size-swatch-height:30px;--size-icon-small:18px;--size-icon-standard:28px;--size-icon-large:40px;--border-width:1.5px;--outline-width:2px;--outline-width-debug:1px;--border-radius-small:4px;--border-radius-inner:9px;--border-radius-outer:18px;--motion-distance:10px;--motion-blur:5px}.btn{width:max-content;min-height:var(--height-control);justify-content:center;align-items:center;gap:var(--space-sm);padding:0 var(--space-lg);border:var(--border-width) solid var(--color-brand-primary);border-radius:var(--border-radius-inner);background:var(--color-brand-primary);color:var(--color-bg-primary);font:inherit;font-size:var(--font-size-text);font-weight:var(--font-weight-semibold);cursor:pointer;line-height:1;text-decoration:none;display:inline-flex}.btn:hover{filter:brightness(.9)}.btn-neutral{border-color:var(--color-neutral-contrast);background:var(--color-neutral-contrast);color:var(--color-text-primary)}.btn-neutral:hover{filter:none;border-color:var(--color-neutral-contrast);background:var(--color-bg-secondary);color:var(--color-text-primary)}.btn-icon{padding-left:var(--space-md)}.btn-no-fill,.btn-no-fill:hover{background:0 0}.btn-no-border,.btn-no-border:hover{border-color:#0000}.btn-curved{border-radius:100vh}.btn-text{min-height:auto;padding:var(--space-sm) var(--space-xs);color:var(--color-brand-primary);border-radius:var(--border-radius-inner);background:0 0;border-color:#0000}.btn-text:hover{filter:none;background:var(--color-bg-secondary);color:var(--color-brand-primary);border-color:#0000}.btn-text.btn-neutral{color:var(--color-text-secondary);background:0 0;border-color:#0000}.btn-text.btn-neutral:hover{filter:none;background:var(--color-bg-secondary);color:var(--color-text-primary);border-color:#0000}.btn-sign-in{min-height:var(--height-control);gap:var(--space-sm);padding:0 var(--space-lg) 0 var(--space-sm);border:var(--border-width) solid var(--color-neutral-contrast);color:var(--color-brand-primary);font-size:var(--font-size-subheading);background:0 0;border-radius:100vh}.btn-sign-in:hover{filter:none;border-color:var(--color-neutral-contrast);background:var(--color-bg-secondary);color:var(--color-brand-primary)}.btn-sign-in.btn-neutral{border-color:var(--color-neutral-contrast);color:var(--color-text-secondary);background:0 0}.btn-sign-in.btn-neutral:hover{filter:none;border-color:var(--color-neutral-contrast);background:var(--color-bg-secondary);color:var(--color-text-primary)}.btn-icon-placeholder{width:var(--size-icon-small);height:var(--size-icon-small);flex:0 0 var(--size-icon-small);border:var(--border-width) solid currentColor;border-radius:var(--border-radius-small)}.btn-sign-in-icon{width:var(--size-icon-standard);height:var(--size-icon-standard);flex:0 0 var(--size-icon-standard);display:block}.range-control,.textarea-control,.select-control{width:min(var(--width-standard), 100%);gap:var(--space-sm);color:var(--color-text-secondary);font-size:var(--font-size-text-small);display:grid}.range-control input{width:100%;accent-color:var(--color-brand-primary);cursor:pointer}.text-field{width:100%;position:relative}.text-field-border{width:100%;min-width:0;height:var(--height-input);border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-inner);margin:0;padding:0;position:relative}.text-field-border legend{width:0;max-width:0;height:0;margin-left:var(--space-md);white-space:nowrap;color:#0000;font-size:var(--font-size-text-small);padding:0;line-height:0;overflow:hidden}.text-field-border legend span{padding:0 var(--space-xs)}.text-field.floating .text-field-border legend{width:auto;max-width:none;overflow:visible}.text-field input{width:100%;height:100%;padding:var(--space-lg);color:var(--color-text-primary);font:inherit;font-size:var(--font-size-text);background:0 0;border:0;outline:0;position:absolute;inset:0}.text-field label{top:50%;left:var(--space-lg);z-index:2;color:var(--color-text-secondary);font-size:var(--font-size-text);pointer-events:none;background:0 0;padding:0;line-height:1;transition:top .15s,font-size .15s,color .15s;position:absolute;transform:translateY(-50%)}.text-field.floating label{color:var(--color-brand-primary);font-size:var(--font-size-text-small);top:0}.text-field.focused .text-field-border{border:var(--border-width) solid var(--color-brand-primary)}.text-field.error .text-field-border{border:var(--border-width) solid var(--color-error)}.text-field.error label{color:var(--color-error)}.input-error{align-items:center;gap:var(--space-sm);margin-top:var(--space-sm);color:var(--color-error);font-size:var(--font-size-text-small);display:none}.input-error-icon{width:var(--size-icon-small);height:var(--size-icon-small);border:var(--border-width) solid var(--color-error);border-radius:var(--border-radius-small);display:inline-block}.text-field.error .input-error{display:flex}.input-validate-button{margin-top:var(--space-lg)}.textarea-control textarea{width:100%;min-height:var(--height-textarea);padding:var(--space-md);resize:vertical;border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-inner);background:var(--color-bg-primary);color:var(--color-text-primary);font:inherit;outline:0}.textarea-control textarea:focus{border:var(--border-width) solid var(--color-brand-primary)}.select-control select{width:100%;min-height:var(--height-control);padding:0 var(--space-md);border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-inner);background:var(--color-bg-primary);color:var(--color-text-primary);font:inherit;outline:0}.select-control select:focus{border:var(--border-width) solid var(--color-brand-primary)}.choice-control{align-items:center;gap:var(--space-sm);color:var(--color-text-primary);cursor:pointer;display:inline-flex}.choice-control input,.checkbox-control input[type=checkbox]{width:var(--size-icon-small);height:var(--size-icon-small);flex:0 0 var(--size-icon-small);appearance:none;border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-small);background:var(--color-bg-primary);cursor:pointer}.choice-control input:checked,.checkbox-control input[type=checkbox]:checked{border-color:var(--color-brand-primary);background-color:var(--color-brand-primary);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3 8l3 3 7-7'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:calc(var(--size-icon-small) - var(--space-xs))}.choice-control input:focus-visible,.checkbox-control input[type=checkbox]:focus-visible{outline:var(--outline-width) solid var(--color-brand-primary);outline-offset:var(--outline-width)}.checkbox-control>span{color:var(--color-text-secondary);font-size:var(--font-size-text-small)}.radio-control{align-items:center;gap:var(--space-lg);color:var(--color-text-primary);flex-wrap:wrap;display:flex}.radio-control>span{color:var(--color-text-secondary);font-size:var(--font-size-text-small)}.radio-control label{align-items:center;gap:var(--space-sm);cursor:pointer;display:inline-flex}.radio-control input{width:var(--size-icon-small);height:var(--size-icon-small);accent-color:var(--color-brand-primary)}.toggle-control{width:var(--width-toggle);height:var(--space-2xl);cursor:pointer;display:inline-block;position:relative}.toggle-control input{opacity:0;pointer-events:none;position:absolute}.toggle-track{width:var(--width-toggle);height:var(--size-icon-small);background:var(--color-bg-contrast);border-radius:100vh;transition:background .18s;position:absolute;top:50%;left:0;transform:translateY(-50%)}.toggle-thumb{top:50%;left:calc(var(--space-xs) / 2);width:var(--size-icon-standard);height:var(--size-icon-standard);background:var(--color-text-secondary);border-radius:50%;transition:transform .18s,background .18s;position:absolute;transform:translateY(-50%)}.toggle-control input:checked+.toggle-track .toggle-thumb{transform:translateX(var(--size-icon-small)) translateY(-50%);background:var(--color-brand-primary)}.toggle-control input:focus-visible+.toggle-track{outline:var(--outline-width) solid var(--color-brand-primary);outline-offset:var(--outline-width)}.line{border:0;border-top:var(--border-width) solid var(--color-neutral-contrast);width:100%;height:0;margin:0;padding:0}fieldset.line{min-width:0}.line-labelled legend{padding:0 var(--space-lg);color:var(--color-text-primary);font-size:var(--font-size-text);margin:0 auto;line-height:1}.card{width:min(var(--width-content), 100%);margin:var(--space-4xl) auto 0;padding:var(--space-2xl);border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-outer);background:var(--color-bg-secondary)}.card-title-section{width:100%}.card-toggle{width:100%;min-height:var(--height-control);justify-content:space-between;align-items:center;gap:var(--space-lg);color:var(--color-text-primary);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;padding:0;display:flex}.card-title{color:var(--color-text-primary);font-size:var(--font-size-heading-2);font-weight:var(--font-weight-bold);margin:0}.card-toggle-icon{width:var(--size-icon-small);height:var(--size-icon-small);flex:0 0 var(--size-icon-small);color:var(--color-text-primary);display:inline-flex}.card-toggle-icon svg{width:100%;height:100%;display:block}.card-header{margin-top:var(--space-xl);padding:var(--space-lg);border-radius:var(--border-radius-inner);background:var(--color-bg-contrast)}.card-header-controls{align-items:stretch;gap:var(--space-lg);flex-direction:column;display:flex}.card-header-controls .radio-control,.card-header-controls .checkbox-control{-moz-column-gap:var(--space-lg);column-gap:var(--space-lg);row-gap:var(--space-sm);grid-template-columns:1.33fr repeat(3,minmax(0,1fr));display:grid}.card-header-controls .radio-control>span,.card-header-controls .checkbox-control>span{color:var(--color-text-primary);font-weight:var(--font-weight-bold)}.card-header-controls .range-control{width:100%}.card-body,.card-header+.card-body{margin-top:var(--space-xl)}.card-preview{background:var(--color-bg-primary);margin-top:0}.card-content{min-height:var(--height-card-content);padding:var(--space-md)}.card-actions{margin-bottom:var(--space-xl)}.card-grid{width:100%;height:var(--height-preview);gap:var(--space-md);padding:var(--space-lg);border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-inner);background:var(--color-bg-primary);display:grid}.card-grid-square{border-radius:0}.card-grid-item{cursor:pointer;background:0 0;border:0;min-width:0;min-height:0;padding:0}.card-grid-item.is-selected{outline:var(--outline-width) solid var(--color-brand-primary);outline-offset:calc(var(--outline-width) * -1);background:color-mix(in srgb, var(--color-brand-primary) 12%, transparent)}.card-grid-item:disabled{cursor:default}.generated-code{margin-top:var(--space-xl);border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-inner);background:var(--color-bg-primary);overflow:hidden}.generated-code-toolbar{min-height:var(--height-control);padding:0 var(--space-md) 0 var(--space-lg);border-bottom:var(--border-width) solid var(--color-neutral-contrast);background:var(--color-bg-contrast);justify-content:space-between;align-items:center;display:flex}.generated-code-icon{font-family:monospace;font-size:var(--font-size-text)}.generated-code-toggle-icon{width:var(--size-icon-small);height:var(--size-icon-small);flex:0 0 var(--size-icon-small);display:inline-flex}.generated-code-toggle-icon svg{width:100%;height:100%;display:block}.copy-icon{width:var(--size-icon-small);height:var(--size-icon-small);display:block}.generated-code-body{max-height:var(--height-preview);background:var(--color-bg-primary);overflow:auto}.generated-code-lines{min-width:max-content;padding:var(--space-sm) 0;color:var(--color-text-primary);font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:var(--font-size-text-small);line-height:1.7;display:block}.generated-code-line{grid-template-columns:3.25rem minmax(0,1fr);min-height:1.7em;display:grid}.generated-code-line:hover{background:var(--color-bg-secondary)}.generated-code-line-number{padding:0 var(--space-md);border-right:var(--border-width) solid var(--color-neutral-contrast);color:var(--color-text-secondary);text-align:right;-webkit-user-select:none;user-select:none}.generated-code-line-content{padding:0 var(--space-lg);white-space:pre}.banner{width:100%;min-height:var(--height-preview);border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-outer);background:var(--color-bg-primary);grid-template-columns:minmax(0,1fr) minmax(0,1fr);display:grid;overflow:hidden}.banner-media{min-width:0;min-height:var(--height-preview);padding:var(--space-xl);background:var(--color-bg-secondary);justify-content:center;align-items:center;display:flex}.banner-image-placeholder{aspect-ratio:4/3;border:var(--border-width) dashed var(--color-neutral-contrast);background:var(--color-bg-primary);width:100%}.banner-content{min-width:0;padding:var(--space-3xl);justify-content:center;gap:var(--space-lg);flex-direction:column;display:flex}.banner-text-first .banner-content{order:1}.banner-text-first .banner-media{order:2}.banner-text-last .banner-media{order:1}.banner-text-last .banner-content{order:2}.banner-content.align-left{align-items:flex-start}.banner-content.align-center{align-items:center}.banner-content.align-right{align-items:flex-end}.banner-actions{margin-top:var(--space-sm);display:flex}.table{border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-inner);background:var(--color-bg-primary);width:100%;overflow:hidden}.table-row{border-bottom:var(--border-width) solid var(--color-neutral-contrast);align-items:center;display:grid}.table-row:last-child{border-bottom:0}.table-row:hover:not(.table-header){background:var(--color-bg-secondary)}.table-header{min-height:var(--height-control);background:var(--color-bg-contrast);color:var(--color-text-secondary);font-size:var(--font-size-text-small);font-weight:var(--font-weight-bold)}.table-cell{min-width:0;padding:var(--space-md) var(--space-lg)}.table-text .table-row{min-height:var(--height-table-row-large);grid-template-columns:minmax(0,1.9fr) minmax(0,.7fr) minmax(0,.6fr)}.table-colors .table-row{min-height:var(--height-table-row);grid-template-columns:minmax(0,1fr) minmax(0,.8fr) minmax(0,.8fr) minmax(0,1.6fr)}.text-section{--preview-font-family:"Inter", Arial, sans-serif;font-family:var(--preview-font-family)!important}.text-section *,.text-section button,.text-section input,.text-section label{font-family:var(--preview-font-family)!important}.text-meta{color:var(--color-text-secondary);font-size:var(--font-size-text-small)}.text-heading-1,.text-heading-2,.text-subheading,.text-body,.text-small{margin:0}.text-heading-1{font-size:var(--font-size-heading-1);font-weight:var(--font-weight-bold);line-height:var(--line-height-heading)}.text-heading-2{font-size:var(--font-size-heading-2);font-weight:var(--font-weight-bold);line-height:var(--line-height-heading)}.text-subheading{font-size:var(--font-size-subheading);font-weight:var(--font-weight-semibold);line-height:var(--line-height-heading)}.text-body{font-size:var(--font-size-text);font-weight:var(--font-weight-regular);line-height:var(--line-height-text)}.text-small{font-size:var(--font-size-text-small);font-weight:var(--font-weight-regular);line-height:var(--line-height-text)}.text-preview.color-brand .text-heading-1,.text-preview.color-brand .text-heading-2,.text-preview.color-brand .text-heading-3,.text-preview.color-brand .text-subheading,.text-preview.color-brand .text-body,.text-preview.color-brand .text-small{color:var(--color-brand-primary)}.text-preview.color-neutral .text-heading-1,.text-preview.color-neutral .text-heading-2,.text-preview.color-neutral .text-heading-3,.text-preview.color-neutral .text-subheading,.text-preview.color-neutral .text-body{color:var(--color-text-primary)}.text-preview.color-neutral .text-small{color:var(--color-text-secondary)}.colors-variable,.colors-value{color:var(--color-text-primary);font-family:Consolas,Monaco,monospace;font-size:var(--font-size-text-small)}.colors-use{color:var(--color-text-secondary);font-size:var(--font-size-text-small);line-height:1.45}.colors-display{align-items:center;gap:var(--space-md);display:flex}.colors-swatch{width:var(--size-swatch-width);height:var(--size-swatch-height);flex:0 0 var(--size-swatch-width);border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-inner)}@media (width<=760px){.banner{grid-template-columns:1fr}.banner-media{min-height:var(--height-preview-mobile)}.banner-content{min-height:var(--height-preview-mobile);padding:var(--space-2xl)}.banner-text-last .banner-media,.banner-text-first .banner-media{order:1}.banner-text-last .banner-content,.banner-text-first .banner-content{order:2}.card{padding:var(--space-xl) var(--space-lg)}.table-text .table-row,.table-colors .table-row{padding:var(--space-md) 0;grid-template-columns:1fr}.table-header{display:none}.table-cell{padding:var(--space-sm) var(--space-md)}}.align-left{text-align:left;place-self:flex-start start;margin-right:auto}.align-center{text-align:center;place-self:center;margin-left:auto;margin-right:auto}.align-right{text-align:right;place-self:flex-end end;margin-left:auto}.display-none{display:none}.display-block{display:block}.display-flex{display:flex}.layout-row{align-items:center;gap:var(--space-lg);flex-wrap:wrap;display:flex}.layout-column{gap:var(--space-lg);flex-direction:column;display:flex}.layout-grid{gap:var(--space-xl);display:grid}.layout-full-width{width:100%}.buttons-grid,.inputs-grid{gap:var(--space-xl);display:grid}.buttons-grid .card-content{width:100%;display:grid}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{min-width:var(--page-min-width);background:var(--color-bg-primary);min-height:100vh;color:var(--color-text-primary);font-family:var(--font-family-primary,Arial, sans-serif)}body.dark{--color-bg-primary:#111;--color-bg-secondary:#1b1b1b;--color-bg-contrast:#292929;--color-text-primary:#f2f2f2;--color-text-secondary:#bdbdbd;--color-brand-primary:#8ab4f8;--color-neutral-contrast:#5a5a5a;--color-border-strong:#7a7a7a;--color-error:#f2aaaa;--color-debug-outline:#ffffff14}@media (width<=900px){:root{--font-size-heading-1:1.875rem;--font-size-heading-2:1.5rem}}@media (width<=560px){:root{--font-size-heading-1:1.75rem;--font-size-heading-2:1.375rem}}body.debug-mode header,body.debug-mode nav,body.debug-mode main,body.debug-mode section,body.debug-mode article,body.debug-mode aside,body.debug-mode div,body.debug-mode .card-grid-item{outline:var(--outline-width-debug) solid var(--color-debug-outline)}.page-template-main{width:100%;padding:var(--space-md)}.page-template-section{width:100%;min-width:0;min-height:78vh;margin-bottom:var(--space-md);padding:var(--space-md);color:var(--color-text-secondary);text-align:center;justify-content:center;align-items:center;display:flex}.page-template-section:last-child{margin-bottom:0}.page-template-section:first-child{height:calc(100vh - var(--header-height));min-height:var(--height-section-min);overflow:hidden}@media (width<=560px){.page-template-main,.page-template-section{padding-left:0;padding-right:0}}.page-template-preview{min-height:100vh}.page-template-controls{align-items:center;gap:var(--space-sm);padding:var(--space-sm);border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-inner);background:var(--color-bg-primary);display:flex}.page-template-control-button{min-width:var(--height-control);height:var(--size-control-compact);padding:0 var(--space-sm);border:var(--border-width) solid var(--color-neutral-contrast);border-radius:var(--border-radius-inner);background:var(--color-bg-primary);color:var(--color-text-primary);cursor:pointer}.page-template-control-button:hover{background:var(--color-bg-secondary)}.page-template-control-button.is-active{border-color:var(--color-brand-primary);color:var(--color-brand-primary)}.page-template-preview.page-mobile-preview{width:min(var(--width-mobile-preview), 100%);background:var(--color-bg-primary);min-height:100vh;box-shadow:calc(var(--border-width) * -1) 0 0 var(--color-neutral-contrast), var(--border-width) 0 0 var(--color-neutral-contrast);margin:0 auto}.page-brand-component{height:var(--size-icon-large);justify-self:start;align-items:center;gap:var(--space-xs);padding:0 var(--space-md) 0 0;border-radius:var(--border-radius-inner);display:inline-flex;overflow:hidden}.page-brand-logo-placeholder{width:var(--size-icon-large);height:var(--size-icon-large);flex:0 0 var(--size-icon-large);margin:calc(var(--border-width) * -1) 0 calc(var(--border-width) * -1) calc(var(--border-width) * -1);border-radius:var(--border-radius-inner) 0 0 var(--border-radius-inner);-o-object-fit:contain;object-fit:contain;-o-object-position:right center;object-position:right center;display:block}.page-brand-text{font-size:var(--font-size-heading-2);align-items:center;font-weight:700;line-height:1;display:inline-flex}.page-brand-letter{opacity:0;animation-duration:.55s;animation-timing-function:ease;animation-fill-mode:forwards;display:inline-block}.page-brand-letter-x,.page-brand-letter-l{color:color-mix(in srgb, var(--color-text-primary) 14%, var(--color-bg-primary))}.page-brand-letter-c,.page-brand-letter-h,.page-brand-letter-e,.page-brand-letter-s-one,.page-brand-letter-s-two{color:var(--color-text-primary)}.page-brand-letter-x{animation-name:page-brand-letter-x;animation-delay:0s}.page-brand-letter-l{animation-name:page-brand-letter-l;animation-delay:80ms}.page-brand-letter-c{animation-name:page-brand-letter-c;animation-delay:.16s}.page-brand-letter-h{animation-name:page-brand-letter-h;animation-delay:.24s}.page-brand-letter-e{animation-name:page-brand-letter-e;animation-delay:.32s}.page-brand-letter-s-one{animation-name:page-brand-letter-s-one;animation-delay:.4s}.page-brand-letter-s-two{animation-name:page-brand-letter-s-two;animation-delay:.48s}@keyframes page-brand-letter-x{0%{opacity:0;transform:translateX(calc(var(--motion-distance) * -1))}to{opacity:1;transform:translate(0)}}@keyframes page-brand-letter-l{0%{opacity:0;transform:translateY(calc(var(--motion-distance) * -1))}to{opacity:1;transform:translateY(0)}}@keyframes page-brand-letter-c{0%{opacity:0;transform:scale(.45)}to{opacity:1;transform:scale(1)}}@keyframes page-brand-letter-h{0%{opacity:0;transform:rotate(-16deg)}to{opacity:1;transform:rotate(0)}}@keyframes page-brand-letter-e{0%{opacity:0;filter:blur(var(--motion-blur))}to{opacity:1;filter:blur()}}@keyframes page-brand-letter-s-one{0%{opacity:0;transform:translateY(var(--motion-distance)) scale(.75)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes page-brand-letter-s-two{0%{opacity:0;transform:translateX(var(--motion-distance)) rotate(12deg)}65%{opacity:1;transform:translateX(calc(var(--space-xs) / -2)) rotate(-3deg)}to{opacity:1;transform:translate(0)rotate(0)}}@media (prefers-reduced-motion:reduce){.page-brand-letter{opacity:1;animation:none}}.page-app-shell{width:100%;min-height:100vh;transition:all .2s;display:flex}.page-nav{width:var(--nav-width);flex:0 0 var(--nav-width);background:var(--color-bg-primary);flex-direction:column;height:100vh;display:flex;position:sticky;top:0}.page-nav-header{height:var(--header-height);flex:0 0 var(--header-height);grid-template-columns:var(--size-icon-standard) 1fr;align-items:center;gap:var(--space-sm);padding:var(--space-md) var(--space-md) var(--space-md) calc(var(--space-md) * 2);display:grid}.page-nav-toggle{width:var(--size-icon-standard);height:var(--size-icon-standard);cursor:pointer;background:0 0;border:0;border-radius:0;justify-content:center;justify-self:center;align-items:center;padding:0;display:flex}.page-nav-toggle-icon{width:100%;height:100%;color:var(--color-text-primary);display:block}.page-nav-brand-placeholder{height:var(--height-nav-brand);border-radius:var(--border-radius-inner)}.page-nav-body{min-height:0;padding:var(--space-sm) var(--space-md);scrollbar-width:none;flex:auto;transition:max-height .2s,opacity .15s,padding .2s;overflow:hidden auto}.page-nav-body::-webkit-scrollbar{width:var(--space-sm)}.page-nav-body::-webkit-scrollbar-track{background:0 0}.page-nav-body::-webkit-scrollbar-thumb{background:0 0;border-radius:100vh}.page-nav-body:hover{scrollbar-width:thin;scrollbar-color:var(--color-border-strong) transparent}.page-nav-body:hover::-webkit-scrollbar-thumb{background:var(--color-border-strong)}.page-nav-item{width:100%;min-height:var(--height-control);align-items:center;gap:var(--space-xl);padding:var(--space-sm) var(--space-md);margin:var(--space-xs) 0;border-radius:var(--border-radius-inner);color:var(--color-text-primary);font:inherit;font-size:var(--font-size-text);text-align:left;cursor:pointer;background:0 0;border:0;display:flex}.page-nav-item:hover,.page-nav-item.page-nav-active{background:var(--color-bg-contrast)}.page-nav-icon{width:var(--size-icon-standard);height:var(--size-icon-standard);flex:0 0 var(--size-icon-standard);border-radius:var(--border-radius-inner)}.page-nav-label{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.page-nav-divider{height:var(--border-width);margin:var(--space-md) 0;background:var(--color-neutral-contrast)}.page-nav-footer{min-height:var(--height-card-content);padding:var(--space-md);flex:none;transition:max-height .2s,opacity .15s,padding .2s,border .2s}.page-nav-footer-content{width:100%;height:var(--height-nav-footer-content);color:var(--color-text-secondary);text-align:center;justify-content:center;align-items:center;display:flex}.page-nav.page-nav-closed-state{z-index:50;height:var(--header-height);position:fixed;top:0;left:0}.page-nav.page-nav-closed-state .page-nav-body,.page-nav.page-nav-closed-state .page-nav-footer{opacity:0;pointer-events:none;max-height:0;padding-top:0;padding-bottom:0;overflow:hidden}.page-nav.page-nav-closed-state .page-nav-footer{border-top:0}@media (width<=560px){:root{--nav-width:clamp(120px, 34vw, 180px)}.page-nav-header{gap:var(--space-md)}}.page-shell{min-width:0;width:calc(100% - var(--nav-width));flex:auto;transition:width .2s,margin-left .2s}.page-app-shell.page-nav-closed .page-shell{width:100%;margin-left:0}.page-header{z-index:20;width:100%;height:var(--header-height);justify-content:space-between;align-items:center;gap:var(--space-md);padding:var(--space-md);background:var(--color-bg-primary);display:flex;position:sticky;top:0}.page-header-left{justify-content:flex-start;align-items:center;min-width:0;display:flex}.page-header-right{padding:var(--space-md);color:var(--color-text-secondary);text-align:center;justify-content:flex-end;align-items:center;gap:var(--space-xl);display:flex}.page-app-shell.page-nav-closed .page-header{width:calc(100% - var(--nav-width));margin-left:var(--nav-width)}@media (width<=560px){.page-header{gap:var(--space-sm)}.page-header-right{padding:var(--space-sm);font-size:.75rem}}.page-theme-toggle{width:var(--size-control-compact);height:var(--size-control-compact);border-radius:var(--border-radius-inner);background:var(--color-bg-primary);color:var(--color-text-primary);cursor:pointer}.page-theme-toggle:hover{background:var(--color-bg-secondary)}.page-theme-toggle:before{content:"☀";font-size:var(--font-size-subheading)}body.dark .page-theme-toggle:before{content:"☾"}