@24vlh/vds 0.1.5 → 0.1.6

package/dist/components/header-footer.css

@@ -346,3 +346,21 @@
     outline-offset: var(--space-1);
     border-radius: var(--radius-sm);
 }
+
+/* ---------------------------------------------------------
+   11. APP SHELL (STICKY FOOTER LAYOUT)
+--------------------------------------------------------- */
+
+.vds-shell {
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+}
+
+.vds-shell__main {
+    flex: 1 0 auto;
+}
+
+.vds-shell__footer {
+    margin-top: auto;
+}

package/dist/components/header-footer.min.css

@@ -1 +1 @@
-.vds-header-footer,[data-vds-header-footer]{--header-height:var(--space-16);--header-logo-height:var(--space-12);--header-toggle-size:var(--space-6);--footer-logo-height:var(--space-8);--footer-col-min-width:var(--space-40)}.header{background-color:var(--color-header-bg);border-bottom:var(--border-width) solid var(--color-header-border);position:relative;width:100%;z-index:var(--z-header)}.header--sticky{position:sticky;top:0}.header--elevated{box-shadow:var(--shadow-1)}.header__inner{align-items:center;display:flex;height:var(--header-height);justify-content:space-between;margin:0 auto;max-width:var(--layout-max-width);padding:0 var(--space-6)}.header .logo{align-items:center;display:inline-flex;height:100%;justify-content:center;margin-right:var(--space-6);padding:0}.header .logo svg{height:var(--header-logo-height);width:auto}.header .logo[href]:hover{opacity:.9}.header .nav{align-items:center;display:flex;gap:var(--space-6)}.header .nav__item{color:var(--color-text);font-size:var(--text-sm);padding:var(--space-1) 0;position:relative;-webkit-text-decoration:none;text-decoration:none;transition:color .15s ease}.header .nav__item:hover{color:var(--color-text-muted)}.header .nav__item--active{color:var(--color-text);font-weight:600}.header .nav__item--active:after{background-color:var(--color-accent);border-radius:var(--radius-pill,var(--radius-md));bottom:calc(var(--space-1)*-1);content:"";height:var(--border-width);left:0;position:absolute;right:0}.header .nav__item--disabled{cursor:default;opacity:.5;pointer-events:none}.header .nav__item:focus-visible{border-radius:var(--radius-sm);outline:var(--border-width) solid var(--focus-ring-color);outline-offset:var(--space-1)}.header .header__toggle{background-color:transparent;border:none;border-radius:var(--radius-sm);color:var(--color-text);cursor:pointer;display:none;padding:var(--space-2)}.header .header__toggle svg{stroke:currentColor;height:var(--header-toggle-size);width:var(--header-toggle-size)}.header .header__toggle:focus-visible{outline:var(--border-width) solid var(--focus-ring-color);outline-offset:var(--space-1)}@media (max-width:768px){.header .nav{display:none}.header .header__toggle{align-items:center;display:flex;justify-content:center}.header.header--nav-open .nav{background-color:var(--color-surface);border-bottom:var(--border-width) solid var(--color-border-subtle);display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-6);position:absolute;right:0;top:var(--header-height);width:100%}.header.header--nav-open .nav__item{padding:var(--space-1) 0}}.header .skip-link{background-color:var(--color-accent);border-radius:var(--radius-sm);color:var(--color-on-accent);left:var(--space-4);padding:var(--space-2) var(--space-3);position:absolute;-webkit-text-decoration:none;text-decoration:none;top:var(--space-4);transform:translateY(calc(var(--space-6)*-1));transition:transform .15s ease;z-index:var(--z-header)}.header .skip-link:focus-visible{outline:var(--border-width) solid var(--focus-ring-color);outline-offset:var(--space-1);transform:translateY(0)}.footer{background-color:var(--color-footer-bg);border-top:var(--border-width) solid var(--color-border-strong);color:var(--color-footer-text);padding-bottom:var(--space-10);padding-top:var(--space-10);width:100%}.footer__inner{align-items:flex-start;display:flex;flex-wrap:nowrap;justify-content:space-between;margin:0 auto;max-width:var(--layout-max-width);padding:0 var(--space-6)}.footer__col{display:flex;flex-direction:column;gap:var(--space-3);min-width:var(--footer-col-min-width)}.footer__col-title{font-size:var(--text-sm);font-weight:600;margin-bottom:var(--space-2)}.footer__link{color:var(--color-footer-text);font-size:var(--text-sm);opacity:.85;-webkit-text-decoration:none;text-decoration:none;transition:opacity .15s ease}.footer__link:hover{opacity:1}.footer__link:focus-visible{border-radius:var(--radius-sm);outline:var(--border-width) solid var(--focus-ring-color);outline-offset:var(--space-1)}@media (max-width:768px){.footer__inner{flex-direction:column;gap:var(--space-10)}}.footer .logo{align-items:center;display:inline-flex;justify-content:flex-start;margin-bottom:var(--space-6);padding:0}.footer .logo svg{height:var(--footer-logo-height);width:auto}.footer .logo-frame,.footer .logo-rail{stroke:var(--color-logo-ink-inverse)}.footer .logo-chevron{stroke:var(--color-logo-accent-inverse)}.footer__meta{font-size:var(--text-xs);margin-top:var(--space-8);opacity:.75}.footer__meta,.footer__meta a,.footer__meta p,.footer__meta small,.footer__meta span{color:var(--color-footer-text)}.footer__meta a{-webkit-text-decoration:none;text-decoration:none}.footer__meta a:focus-visible{border-radius:var(--radius-sm);outline:var(--border-width) solid var(--focus-ring-color);outline-offset:var(--space-1)}
+.vds-header-footer,[data-vds-header-footer]{--header-height:var(--space-16);--header-logo-height:var(--space-12);--header-toggle-size:var(--space-6);--footer-logo-height:var(--space-8);--footer-col-min-width:var(--space-40)}.header{background-color:var(--color-header-bg);border-bottom:var(--border-width) solid var(--color-header-border);position:relative;width:100%;z-index:var(--z-header)}.header--sticky{position:sticky;top:0}.header--elevated{box-shadow:var(--shadow-1)}.header__inner{align-items:center;display:flex;height:var(--header-height);justify-content:space-between;margin:0 auto;max-width:var(--layout-max-width);padding:0 var(--space-6)}.header .logo{align-items:center;display:inline-flex;height:100%;justify-content:center;margin-right:var(--space-6);padding:0}.header .logo svg{height:var(--header-logo-height);width:auto}.header .logo[href]:hover{opacity:.9}.header .nav{align-items:center;display:flex;gap:var(--space-6)}.header .nav__item{color:var(--color-text);font-size:var(--text-sm);padding:var(--space-1) 0;position:relative;-webkit-text-decoration:none;text-decoration:none;transition:color .15s ease}.header .nav__item:hover{color:var(--color-text-muted)}.header .nav__item--active{color:var(--color-text);font-weight:600}.header .nav__item--active:after{background-color:var(--color-accent);border-radius:var(--radius-pill,var(--radius-md));bottom:calc(var(--space-1)*-1);content:"";height:var(--border-width);left:0;position:absolute;right:0}.header .nav__item--disabled{cursor:default;opacity:.5;pointer-events:none}.header .nav__item:focus-visible{border-radius:var(--radius-sm);outline:var(--border-width) solid var(--focus-ring-color);outline-offset:var(--space-1)}.header .header__toggle{background-color:transparent;border:none;border-radius:var(--radius-sm);color:var(--color-text);cursor:pointer;display:none;padding:var(--space-2)}.header .header__toggle svg{stroke:currentColor;height:var(--header-toggle-size);width:var(--header-toggle-size)}.header .header__toggle:focus-visible{outline:var(--border-width) solid var(--focus-ring-color);outline-offset:var(--space-1)}@media (max-width:768px){.header .nav{display:none}.header .header__toggle{align-items:center;display:flex;justify-content:center}.header.header--nav-open .nav{background-color:var(--color-surface);border-bottom:var(--border-width) solid var(--color-border-subtle);display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-6);position:absolute;right:0;top:var(--header-height);width:100%}.header.header--nav-open .nav__item{padding:var(--space-1) 0}}.header .skip-link{background-color:var(--color-accent);border-radius:var(--radius-sm);color:var(--color-on-accent);left:var(--space-4);padding:var(--space-2) var(--space-3);position:absolute;-webkit-text-decoration:none;text-decoration:none;top:var(--space-4);transform:translateY(calc(var(--space-6)*-1));transition:transform .15s ease;z-index:var(--z-header)}.header .skip-link:focus-visible{outline:var(--border-width) solid var(--focus-ring-color);outline-offset:var(--space-1);transform:translateY(0)}.footer{background-color:var(--color-footer-bg);border-top:var(--border-width) solid var(--color-border-strong);color:var(--color-footer-text);padding-bottom:var(--space-10);padding-top:var(--space-10);width:100%}.footer__inner{align-items:flex-start;display:flex;flex-wrap:nowrap;justify-content:space-between;margin:0 auto;max-width:var(--layout-max-width);padding:0 var(--space-6)}.footer__col{display:flex;flex-direction:column;gap:var(--space-3);min-width:var(--footer-col-min-width)}.footer__col-title{font-size:var(--text-sm);font-weight:600;margin-bottom:var(--space-2)}.footer__link{color:var(--color-footer-text);font-size:var(--text-sm);opacity:.85;-webkit-text-decoration:none;text-decoration:none;transition:opacity .15s ease}.footer__link:hover{opacity:1}.footer__link:focus-visible{border-radius:var(--radius-sm);outline:var(--border-width) solid var(--focus-ring-color);outline-offset:var(--space-1)}@media (max-width:768px){.footer__inner{flex-direction:column;gap:var(--space-10)}}.footer .logo{align-items:center;display:inline-flex;justify-content:flex-start;margin-bottom:var(--space-6);padding:0}.footer .logo svg{height:var(--footer-logo-height);width:auto}.footer .logo-frame,.footer .logo-rail{stroke:var(--color-logo-ink-inverse)}.footer .logo-chevron{stroke:var(--color-logo-accent-inverse)}.footer__meta{font-size:var(--text-xs);margin-top:var(--space-8);opacity:.75}.footer__meta,.footer__meta a,.footer__meta p,.footer__meta small,.footer__meta span{color:var(--color-footer-text)}.footer__meta a{-webkit-text-decoration:none;text-decoration:none}.footer__meta a:focus-visible{border-radius:var(--radius-sm);outline:var(--border-width) solid var(--focus-ring-color);outline-offset:var(--space-1)}.vds-shell{display:flex;flex-direction:column;min-height:100vh}.vds-shell__main{flex:1 0 auto}.vds-shell__footer{margin-top:auto}

package/dist/core.css

@@ -475,6 +475,7 @@ table {
 html,
 body {
     width: 100%;
+    height: 100%;
 }
 
 body {

package/dist/core.min.css

@@ -1 +1 @@
-:root{--font-family-sans:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-family-mono:"JetBrains Mono","SF Mono",Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--text-xxxs:0.65rem;--text-xxs:0.75rem;--text-xs:0.8125rem;--text-sm:0.875rem;--text-base:1rem;--text-md:1.0625rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--text-5xl:3.25rem;--line-height-xs-tight:0.5;--line-height-tight:1.1;--line-height-xl-tight:1.2;--line-height-snug:1.25;--line-height-normal:1.5;--line-height-relaxed:1.7;--font-weight-regular:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--letter-tight:-0.015em;--letter-normal:0;--letter-loose:0.015em;--footnote-font-size:var(--text-xs);--space-0:0;--space-0_5:0.125rem;--space-1:0.25rem;--space-1_5:0.375rem;--space-2:0.5rem;--space-2_5:0.625rem;--space-3:0.75rem;--space-3_5:0.875rem;--space-4:1rem;--space-5:1.25rem;--space-5_5:1.3125rem;--space-6:1.5rem;--space-7:1.75rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-14:3.5rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--space-28:7rem;--space-32:8rem;--space-36:9rem;--space-40:10rem;--space-44:11rem;--space-48:12rem;--space-64:16rem;--section-spacing-xs:var(--space-6);--section-spacing-sm:var(--space-8);--section-spacing-md:var(--space-12);--section-spacing-lg:var(--space-16);--section-spacing-xl:var(--space-20);--gap-xs:var(--space-2);--gap-sm:var(--space-3);--gap-md:var(--space-6);--gap-lg:var(--space-8);--gap-xl:var(--space-12);--component-gap-xs:var(--space-2);--component-gap-sm:var(--space-3);--component-gap-md:var(--space-4);--component-gap-lg:var(--space-6);--component-gap-xl:var(--space-10);--radius-none:0;--radius-xs:2px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:18px;--radius-full:999px;--radius-pill:9999px;--border-width:1px;--border-width-strong:3px;--tab-indicator-height:2px;--shadow-xs:0 1px 2px rgba(0,0,0,.05);--shadow-sm:0 1px 3px rgba(0,0,0,.1);--shadow-md:0 4px 6px rgba(0,0,0,.1);--shadow-lg:0 10px 15px rgba(0,0,0,.15);--shadow-xl:0 20px 25px rgba(0,0,0,.2);--layout-max-width:80rem;--content-width-sm:640px;--content-width-md:768px;--content-width-lg:1024px;--content-width-xl:1200px;--content-width-2xl:1440px;--sidebar-width-md:280px;--grid-min:16rem;--icon-xxs:1rem;--icon-xs:1.15rem;--icon-sm:1.25rem;--icon-md:1.35rem;--icon-lg:1.75rem;--icon-xl:2.25rem;--icon-container-sm:1.75rem;--icon-container-md:2.25rem;--icon-container-lg:3rem;--icon-container-xl:3.75rem;--icon-stroke-thin:1.25;--icon-stroke-regular:1.75;--icon-stroke-bold:2.25;--avatar-size-sm:var(--space-7);--avatar-size-md:var(--space-10);--avatar-size-lg:var(--space-16);--avatar-status-size:var(--space-2);--transition-fast:120ms ease-out;--transition-normal:180ms ease-out;--transition-slow:260ms ease-out;--ease-out:cubic-bezier(0.16,1,0.3,1);--ease-in:cubic-bezier(0.32,0,0.67,0);--ease-in-out:cubic-bezier(0.65,0,0.35,1);--motion-none:0ms;--z-negative:-1;--z-base:0;--z-header:10;--z-backdrop:80;--z-modal:90;--z-drawer:95;--z-toast:100;--z-tooltip:110;--z-sticky:40;--z-sticky-col:39;--focus-ring-width:2px;--focus-ring-offset:2px}a{--link-underline-thickness:2px}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"kern" 1,"liga" 1,"clig" 1,"calt" 1;box-sizing:border-box;line-height:1.5;line-height:var(--line-height-normal)}*,:after,:before{box-sizing:inherit;min-width:0}*{-webkit-box-decoration-break:clone;box-decoration-break:clone;scrollbar-color:var(--color-border-subtle) transparent;scrollbar-width:thin}body{background:var(--color-bg);color:var(--color-text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif,BlinkMacSystemFont;font-family:var(--font-family-sans),sans-serif;font-size:1rem;font-size:var(--text-base);margin:0;min-height:100vh;text-rendering:optimizeLegibility}canvas,img,picture,svg,video{display:block;max-width:100%}img{height:auto}button,input,select,textarea{color:inherit;font:inherit;margin:0}button{background:none;border:none;padding:0}[role=button],button,input[type=button],input[type=submit]{cursor:pointer}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=search]{-webkit-appearance:none;outline-offset:-2px}textarea{resize:vertical}input,select,textarea{line-height:inherit}fieldset{border:0;margin:0}fieldset,legend{padding:0}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,ol,p,ul{margin:0}h1,h2,h3,h4,h5,h6{color:inherit;padding:0}blockquote,figure,ol,p,ul{padding:0}ol,ul{padding-left:1.5rem;padding-left:var(--space-6)}ol ol,ol ul,ul ol,ul ul{margin:0;padding-left:1rem;padding-left:var(--space-4)}b,strong{font-weight:700;font-weight:var(--font-weight-bold)}hr{border:none;border-top:var(--border-width) solid var(--color-border-subtle);margin:1.5rem 0;margin:var(--space-6) 0}a{color:var(--link-text);-webkit-text-decoration:none;text-decoration:none;transition:color .18s ease-out;transition:color var(--transition-normal)}a:hover{-webkit-text-decoration-skip:ink;color:var(--link-text-hover);-webkit-text-decoration:underline;text-decoration:underline;text-decoration-skip-ink:auto;text-decoration-thickness:1px;text-decoration-thickness:var(--link-underline-thickness,1px)}a:active{color:var(--link-text-active)}table{border-collapse:collapse;width:100%}:focus{outline:2px solid var(--focus-ring-color);outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:2px;outline-offset:var(--focus-ring-offset)}:focus:not(:focus-visible){outline:none}:focus-visible{outline:2px solid var(--focus-ring-color);outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:2px;outline-offset:var(--focus-ring-offset)}::-moz-selection{background:var(--color-selection-bg);color:var(--color-selection-text)}::selection{background:var(--color-selection-bg);color:var(--color-selection-text)}@media (prefers-reduced-motion:reduce){:root{--transition-fast:var(--motion-none);--transition-normal:var(--motion-none);--transition-slow:var(--motion-none);--ease-out:linear;--ease-in:linear;--ease-in-out:linear}*{animation-duration:0ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:0ms!important}html{scroll-behavior:auto}}@media (forced-colors:active){*{forced-color-adjust:none}}body,html{width:100%}body{display:flex;flex-direction:column}main{flex:1 0 auto}footer{flex-shrink:0}code,pre{font-family:JetBrains Mono,SF Mono,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace,monospace;font-family:var(--font-family-mono),monospace;font-size:.875em}pre{background:var(--code-bg);border:1px solid var(--code-border);color:var(--color-text);overflow:auto;white-space:pre-wrap;word-break:break-word}code,pre{-moz-tab-size:4;-o-tab-size:4;tab-size:4}kbd,samp{font-family:JetBrains Mono,SF Mono,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace,monospace;font-family:var(--font-family-mono),monospace}#__next,#__nuxt,#app,#root,.app-root,[data-app-root],[data-spa-root],[qwik-root],app-root,astro-root,svelte-root{display:flex;flex-direction:column;min-height:100vh;width:100%}header.page-header{position:relative;width:100%;z-index:10;z-index:var(--z-header)}main.page-content{flex:1 0 auto;width:100%}footer.page-footer{position:relative;width:100%;z-index:0;z-index:var(--z-base)}.content-header{width:100%}.content-body{flex:1 1 auto;min-height:0;width:100%}.content-footer{flex-shrink:0;width:100%}.container{max-width:1200px;max-width:var(--content-width-xl)}.container,.container-wide{margin-left:auto;margin-right:auto;padding-left:1rem;padding-left:var(--space-4);padding-right:1rem;padding-right:var(--space-4);width:100%}.container-wide{max-width:1440px;max-width:var(--content-width-2xl)}.container-narrow{max-width:1024px;max-width:var(--content-width-lg)}.container-narrow,.container-tight{margin-left:auto;margin-right:auto;padding-left:1rem;padding-left:var(--space-4);padding-right:1rem;padding-right:var(--space-4);width:100%}.container-tight{max-width:768px;max-width:var(--content-width-md)}.container-relaxed{margin-left:auto;margin-right:auto;max-width:90ch;padding-left:1rem;padding-left:var(--space-4);padding-right:1rem;padding-right:var(--space-4);width:100%}@media (max-width:768px){.container,.container-narrow,.container-relaxed,.container-tight,.container-wide{padding-left:.75rem;padding-left:var(--space-3);padding-right:.75rem;padding-right:var(--space-3)}}.full-bleed{margin-left:0;margin-right:0;padding-left:0;padding-right:0;width:100%}.section-bleed{margin-left:-1rem;margin-left:calc(var(--space-4)*-1);margin-right:-1rem;margin-right:calc(var(--space-4)*-1)}@media (max-width:768px){.section-bleed{margin-left:-.75rem;margin-left:calc(var(--space-3)*-1);margin-right:-.75rem;margin-right:calc(var(--space-3)*-1)}}.section-none{padding-bottom:0;padding-top:0}.section-xs{padding-bottom:1.5rem;padding-bottom:var(--section-spacing-xs);padding-top:1.5rem;padding-top:var(--section-spacing-xs)}.section-sm{padding-bottom:2rem;padding-bottom:var(--section-spacing-sm);padding-top:2rem;padding-top:var(--section-spacing-sm)}.section{padding-bottom:3rem;padding-bottom:var(--section-spacing-md);padding-top:3rem;padding-top:var(--section-spacing-md)}.section-lg{padding-bottom:4rem;padding-bottom:var(--section-spacing-lg);padding-top:4rem;padding-top:var(--section-spacing-lg)}.section-xl{padding-bottom:5rem;padding-bottom:var(--section-spacing-xl);padding-top:5rem;padding-top:var(--section-spacing-xl)}.layout-grid-auto{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));grid-template-columns:repeat(auto-fit,minmax(var(--grid-min),1fr))}.layout-grid-2,.layout-grid-auto{display:grid;gap:2rem;gap:var(--gap-lg)}.layout-grid-2{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:repeat(2,1fr)}.layout-grid-3{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:repeat(3,1fr)}.layout-grid-3,.layout-grid-4{display:grid;gap:2rem;gap:var(--gap-lg)}.layout-grid-4{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:repeat(4,1fr)}@media (max-width:768px){.layout-grid-2,.layout-grid-3,.layout-grid-4{grid-template-columns:1fr}}.sidebar-layout{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:280px 1fr;grid-template-columns:var(--sidebar-width-md) 1fr}.sidebar-layout,.sidebar-layout-right{display:grid;gap:2rem;gap:var(--gap-lg)}.sidebar-layout-right{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:1fr 280px;grid-template-columns:1fr var(--sidebar-width-md)}@media (max-width:1024px){.sidebar-layout,.sidebar-layout-right{grid-template-columns:1fr}}.split,.split-reverse{grid-gap:2rem;grid-gap:var(--gap-lg);display:grid;gap:2rem;gap:var(--gap-lg);grid-template-columns:1fr 1fr}.split-reverse>:first-child{order:2}.split-reverse>:last-child{order:1}@media (max-width:768px){.split,.split-reverse{grid-template-columns:1fr}}@media (min-width:769px){.split-reverse>*{order:0}}
+:root{--font-family-sans:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-family-mono:"JetBrains Mono","SF Mono",Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--text-xxxs:0.65rem;--text-xxs:0.75rem;--text-xs:0.8125rem;--text-sm:0.875rem;--text-base:1rem;--text-md:1.0625rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--text-5xl:3.25rem;--line-height-xs-tight:0.5;--line-height-tight:1.1;--line-height-xl-tight:1.2;--line-height-snug:1.25;--line-height-normal:1.5;--line-height-relaxed:1.7;--font-weight-regular:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--letter-tight:-0.015em;--letter-normal:0;--letter-loose:0.015em;--footnote-font-size:var(--text-xs);--space-0:0;--space-0_5:0.125rem;--space-1:0.25rem;--space-1_5:0.375rem;--space-2:0.5rem;--space-2_5:0.625rem;--space-3:0.75rem;--space-3_5:0.875rem;--space-4:1rem;--space-5:1.25rem;--space-5_5:1.3125rem;--space-6:1.5rem;--space-7:1.75rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-14:3.5rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--space-28:7rem;--space-32:8rem;--space-36:9rem;--space-40:10rem;--space-44:11rem;--space-48:12rem;--space-64:16rem;--section-spacing-xs:var(--space-6);--section-spacing-sm:var(--space-8);--section-spacing-md:var(--space-12);--section-spacing-lg:var(--space-16);--section-spacing-xl:var(--space-20);--gap-xs:var(--space-2);--gap-sm:var(--space-3);--gap-md:var(--space-6);--gap-lg:var(--space-8);--gap-xl:var(--space-12);--component-gap-xs:var(--space-2);--component-gap-sm:var(--space-3);--component-gap-md:var(--space-4);--component-gap-lg:var(--space-6);--component-gap-xl:var(--space-10);--radius-none:0;--radius-xs:2px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:18px;--radius-full:999px;--radius-pill:9999px;--border-width:1px;--border-width-strong:3px;--tab-indicator-height:2px;--shadow-xs:0 1px 2px rgba(0,0,0,.05);--shadow-sm:0 1px 3px rgba(0,0,0,.1);--shadow-md:0 4px 6px rgba(0,0,0,.1);--shadow-lg:0 10px 15px rgba(0,0,0,.15);--shadow-xl:0 20px 25px rgba(0,0,0,.2);--layout-max-width:80rem;--content-width-sm:640px;--content-width-md:768px;--content-width-lg:1024px;--content-width-xl:1200px;--content-width-2xl:1440px;--sidebar-width-md:280px;--grid-min:16rem;--icon-xxs:1rem;--icon-xs:1.15rem;--icon-sm:1.25rem;--icon-md:1.35rem;--icon-lg:1.75rem;--icon-xl:2.25rem;--icon-container-sm:1.75rem;--icon-container-md:2.25rem;--icon-container-lg:3rem;--icon-container-xl:3.75rem;--icon-stroke-thin:1.25;--icon-stroke-regular:1.75;--icon-stroke-bold:2.25;--avatar-size-sm:var(--space-7);--avatar-size-md:var(--space-10);--avatar-size-lg:var(--space-16);--avatar-status-size:var(--space-2);--transition-fast:120ms ease-out;--transition-normal:180ms ease-out;--transition-slow:260ms ease-out;--ease-out:cubic-bezier(0.16,1,0.3,1);--ease-in:cubic-bezier(0.32,0,0.67,0);--ease-in-out:cubic-bezier(0.65,0,0.35,1);--motion-none:0ms;--z-negative:-1;--z-base:0;--z-header:10;--z-backdrop:80;--z-modal:90;--z-drawer:95;--z-toast:100;--z-tooltip:110;--z-sticky:40;--z-sticky-col:39;--focus-ring-width:2px;--focus-ring-offset:2px}a{--link-underline-thickness:2px}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"kern" 1,"liga" 1,"clig" 1,"calt" 1;box-sizing:border-box;line-height:1.5;line-height:var(--line-height-normal)}*,:after,:before{box-sizing:inherit;min-width:0}*{-webkit-box-decoration-break:clone;box-decoration-break:clone;scrollbar-color:var(--color-border-subtle) transparent;scrollbar-width:thin}body{background:var(--color-bg);color:var(--color-text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif,BlinkMacSystemFont;font-family:var(--font-family-sans),sans-serif;font-size:1rem;font-size:var(--text-base);margin:0;min-height:100vh;text-rendering:optimizeLegibility}canvas,img,picture,svg,video{display:block;max-width:100%}img{height:auto}button,input,select,textarea{color:inherit;font:inherit;margin:0}button{background:none;border:none;padding:0}[role=button],button,input[type=button],input[type=submit]{cursor:pointer}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=search]{-webkit-appearance:none;outline-offset:-2px}textarea{resize:vertical}input,select,textarea{line-height:inherit}fieldset{border:0;margin:0}fieldset,legend{padding:0}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,ol,p,ul{margin:0}h1,h2,h3,h4,h5,h6{color:inherit;padding:0}blockquote,figure,ol,p,ul{padding:0}ol,ul{padding-left:1.5rem;padding-left:var(--space-6)}ol ol,ol ul,ul ol,ul ul{margin:0;padding-left:1rem;padding-left:var(--space-4)}b,strong{font-weight:700;font-weight:var(--font-weight-bold)}hr{border:none;border-top:var(--border-width) solid var(--color-border-subtle);margin:1.5rem 0;margin:var(--space-6) 0}a{color:var(--link-text);-webkit-text-decoration:none;text-decoration:none;transition:color .18s ease-out;transition:color var(--transition-normal)}a:hover{-webkit-text-decoration-skip:ink;color:var(--link-text-hover);-webkit-text-decoration:underline;text-decoration:underline;text-decoration-skip-ink:auto;text-decoration-thickness:1px;text-decoration-thickness:var(--link-underline-thickness,1px)}a:active{color:var(--link-text-active)}table{border-collapse:collapse;width:100%}:focus{outline:2px solid var(--focus-ring-color);outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:2px;outline-offset:var(--focus-ring-offset)}:focus:not(:focus-visible){outline:none}:focus-visible{outline:2px solid var(--focus-ring-color);outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:2px;outline-offset:var(--focus-ring-offset)}::-moz-selection{background:var(--color-selection-bg);color:var(--color-selection-text)}::selection{background:var(--color-selection-bg);color:var(--color-selection-text)}@media (prefers-reduced-motion:reduce){:root{--transition-fast:var(--motion-none);--transition-normal:var(--motion-none);--transition-slow:var(--motion-none);--ease-out:linear;--ease-in:linear;--ease-in-out:linear}*{animation-duration:0ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:0ms!important}html{scroll-behavior:auto}}@media (forced-colors:active){*{forced-color-adjust:none}}body,html{height:100%;width:100%}body{display:flex;flex-direction:column}main{flex:1 0 auto}footer{flex-shrink:0}code,pre{font-family:JetBrains Mono,SF Mono,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace,monospace;font-family:var(--font-family-mono),monospace;font-size:.875em}pre{background:var(--code-bg);border:1px solid var(--code-border);color:var(--color-text);overflow:auto;white-space:pre-wrap;word-break:break-word}code,pre{-moz-tab-size:4;-o-tab-size:4;tab-size:4}kbd,samp{font-family:JetBrains Mono,SF Mono,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace,monospace;font-family:var(--font-family-mono),monospace}#__next,#__nuxt,#app,#root,.app-root,[data-app-root],[data-spa-root],[qwik-root],app-root,astro-root,svelte-root{display:flex;flex-direction:column;min-height:100vh;width:100%}header.page-header{position:relative;width:100%;z-index:10;z-index:var(--z-header)}main.page-content{flex:1 0 auto;width:100%}footer.page-footer{position:relative;width:100%;z-index:0;z-index:var(--z-base)}.content-header{width:100%}.content-body{flex:1 1 auto;min-height:0;width:100%}.content-footer{flex-shrink:0;width:100%}.container{max-width:1200px;max-width:var(--content-width-xl)}.container,.container-wide{margin-left:auto;margin-right:auto;padding-left:1rem;padding-left:var(--space-4);padding-right:1rem;padding-right:var(--space-4);width:100%}.container-wide{max-width:1440px;max-width:var(--content-width-2xl)}.container-narrow{max-width:1024px;max-width:var(--content-width-lg)}.container-narrow,.container-tight{margin-left:auto;margin-right:auto;padding-left:1rem;padding-left:var(--space-4);padding-right:1rem;padding-right:var(--space-4);width:100%}.container-tight{max-width:768px;max-width:var(--content-width-md)}.container-relaxed{margin-left:auto;margin-right:auto;max-width:90ch;padding-left:1rem;padding-left:var(--space-4);padding-right:1rem;padding-right:var(--space-4);width:100%}@media (max-width:768px){.container,.container-narrow,.container-relaxed,.container-tight,.container-wide{padding-left:.75rem;padding-left:var(--space-3);padding-right:.75rem;padding-right:var(--space-3)}}.full-bleed{margin-left:0;margin-right:0;padding-left:0;padding-right:0;width:100%}.section-bleed{margin-left:-1rem;margin-left:calc(var(--space-4)*-1);margin-right:-1rem;margin-right:calc(var(--space-4)*-1)}@media (max-width:768px){.section-bleed{margin-left:-.75rem;margin-left:calc(var(--space-3)*-1);margin-right:-.75rem;margin-right:calc(var(--space-3)*-1)}}.section-none{padding-bottom:0;padding-top:0}.section-xs{padding-bottom:1.5rem;padding-bottom:var(--section-spacing-xs);padding-top:1.5rem;padding-top:var(--section-spacing-xs)}.section-sm{padding-bottom:2rem;padding-bottom:var(--section-spacing-sm);padding-top:2rem;padding-top:var(--section-spacing-sm)}.section{padding-bottom:3rem;padding-bottom:var(--section-spacing-md);padding-top:3rem;padding-top:var(--section-spacing-md)}.section-lg{padding-bottom:4rem;padding-bottom:var(--section-spacing-lg);padding-top:4rem;padding-top:var(--section-spacing-lg)}.section-xl{padding-bottom:5rem;padding-bottom:var(--section-spacing-xl);padding-top:5rem;padding-top:var(--section-spacing-xl)}.layout-grid-auto{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));grid-template-columns:repeat(auto-fit,minmax(var(--grid-min),1fr))}.layout-grid-2,.layout-grid-auto{display:grid;gap:2rem;gap:var(--gap-lg)}.layout-grid-2{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:repeat(2,1fr)}.layout-grid-3{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:repeat(3,1fr)}.layout-grid-3,.layout-grid-4{display:grid;gap:2rem;gap:var(--gap-lg)}.layout-grid-4{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:repeat(4,1fr)}@media (max-width:768px){.layout-grid-2,.layout-grid-3,.layout-grid-4{grid-template-columns:1fr}}.sidebar-layout{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:280px 1fr;grid-template-columns:var(--sidebar-width-md) 1fr}.sidebar-layout,.sidebar-layout-right{display:grid;gap:2rem;gap:var(--gap-lg)}.sidebar-layout-right{grid-gap:2rem;grid-gap:var(--gap-lg);grid-template-columns:1fr 280px;grid-template-columns:1fr var(--sidebar-width-md)}@media (max-width:1024px){.sidebar-layout,.sidebar-layout-right{grid-template-columns:1fr}}.split,.split-reverse{grid-gap:2rem;grid-gap:var(--gap-lg);display:grid;gap:2rem;gap:var(--gap-lg);grid-template-columns:1fr 1fr}.split-reverse>:first-child{order:2}.split-reverse>:last-child{order:1}@media (max-width:768px){.split,.split-reverse{grid-template-columns:1fr}}@media (min-width:769px){.split-reverse>*{order:0}}

package/dist/vds.css

@@ -475,6 +475,7 @@ table {
 html,
 body {
     width: 100%;
+    height: 100%;
 }
 
 body {
@@ -8714,6 +8715,24 @@ select.form-control:not([multiple]):not([size]) {
     border-radius: var(--radius-sm);
 }
 
+/* ---------------------------------------------------------
+   11. APP SHELL (STICKY FOOTER LAYOUT)
+--------------------------------------------------------- */
+
+.vds-shell {
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+}
+
+.vds-shell__main {
+    flex: 1 0 auto;
+}
+
+.vds-shell__footer {
+    margin-top: auto;
+}
+
 /************************************************************
  * VLAH DESIGN SYSTEM (VDS) - Hero Component
  *