.btn{display:inline-flex;align-items:center;justify-content:center;gap:4px;border:1px solid transparent;font-family:var(--font-family-base);font-size:1rem;font-weight:var(--font-weight-medium);line-height:var(--line-height-100);text-align:center;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:var(--transition-base);white-space:nowrap;vertical-align:middle;font-family:Inter,sans-serif}.btn,.btn:hover{text-decoration:none}.btn:hover{border-radius:var(--border-radius-radius-4)}.btn:focus,.btn:focus-visible{outline-offset:2px}.btn:active{transform:translateY(0)}.btn.disabled,.btn:disabled{opacity:.6;cursor:not-allowed;pointer-events:none;transform:none;box-shadow:none}.btn .material-symbols-outlined{font-size:1em;line-height:1;vertical-align:middle;display:inline-flex;align-items:center;font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 20}.btn.loading{pointer-events:none;opacity:.8}.btn.loading:before{content:"";display:inline-block;width:1rem;height:1rem;border-radius:50%;border:2px solid;border-top:2px solid transparent;animation:button-spin 1s linear infinite;margin-right:.5rem}.btn{padding:8px;font-size:var(--font-size-16);line-height:var(--line-height-140);border-radius:var(--border-radius-radius-4)}.btn-large,.btn-lg{min-width:140px;padding:8px 12px;font-size:1rem}.btn-md,.btn-medium{padding:var(--spacing-6);font-size:var(--font-size-14)!important;min-height:32px}.btn-sm,.btn-small{padding:var(--spacing-8);font-size:var(--font-size-12)}.radio-demo-card{margin-top:2.5rem;background:var(--surface-primary,#fff);border:2px dashed var(--primary-300,#c4a3ff);border-radius:8px;padding:1.5rem}.radio-title{font-size:1.25rem;font-weight:600;color:var(--primary-700,#3b2e5a);margin-bottom:1.5rem;text-align:left}.radio-table{width:100%}.radio-header-row{display:grid;grid-template-columns:100px 80px repeat(4,1fr);gap:1.5rem;padding-bottom:.75rem;align-items:center}.radio-state-header{font-size:.875rem;font-weight:600;color:var(--text-secondary,#374151);text-align:center;padding:.5rem}.radio-row{display:grid;grid-template-columns:100px 80px repeat(4,1fr);gap:1.5rem;margin-bottom:1rem;align-items:center}.radio-row>label{display:flex;justify-content:center;align-items:center;gap:10px}.radio-label{font-size:var(--font-size-14);font-weight:var(--font-weight-600);color:var(--neutral-800);font-family:Inter,sans-serif}.radio-label,.radio-size-label{text-align:right;padding-right:.5rem}.radio-size-label{font-size:.875rem;font-weight:500;color:var(--text-secondary,#6b7280)}.radio-btn{display:inline-flex;align-items:center;cursor:pointer;position:relative;margin:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;padding:2px;gap:4px}.radio-btn input[type=radio]{opacity:0;position:absolute;width:0;height:0}.radio-mark{display:inline-block;width:28px;height:28px;border-radius:50%;border:1px solid var(--neutral-600);background:var(--surface-primary,#fff);box-sizing:border-box;transition:border-color .2s,box-shadow .2s;position:relative}.radio-large .radio-mark{width:15.833px;height:15.833px}.radio-small .radio-mark{width:12.667px;height:12.667px}.radio-btn input[type=radio]:checked+.radio-mark{border-color:var(--primary-600,#5b3fd6)}.radio-btn input[type=radio]:checked+.radio-mark:after{content:"";display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:50%;background:var(--primary-500-base,#3862c5)}.radio-small input[type=radio]:checked+.radio-mark:after{width:6px;height:6px}.radio-btn input[type=radio]:focus+.radio-mark,.radio-btn.radio-focused-state .radio-mark{border-color:var(--primary-500,#3862c5);box-shadow:0 0 0 3px rgba(56,98,197,.2);outline:2px solid var(--primary-500,#3862c5);outline-offset:2px}.radio-btn input[type=radio]:hover+.radio-mark,.radio-btn.hover-state .radio-mark{border-color:var(--primary-700,#3b2e5a)}.radio-btn input[type=radio]:checked:disabled+.radio-mark,.radio-btn input[type=radio]:disabled+.radio-mark{opacity:.5;cursor:not-allowed;background:var(--surface-secondary,#f3f3f3);border-color:var(--border-color,#e5e7eb)}.btn-primary{--bs-btn-border-color:var(--button-primary);--bs-btn-hover-border-color:var(--button-primary-hover);--bs-btn-active-border-color:var(--button-primary-active-border);--bs-btn-hover-bg:var(--button-primary-hover);--bs-btn-active-bg:var(--button-primary-active);background-color:var(--button-primary);border:1px solid var(--button-primary);color:var(--white);padding:var(--spacing-6);min-height:32px}.btn-primary:hover{background-color:var(--button-primary-hover);border:1px solid var(--button-primary-hover);color:var(--white)}.btn-primary.clicked,.btn-primary:active{background-color:var(--button-primary-active);border:1px solid var(--button-primary-active-border);color:var(--white)}.btn-primary.disabled,.btn-primary:disabled{background:var(--neutral-25);border:1px solid var(--neutral-25);color:var(--neutral-200);opacity:1}.btn.btn-outline-primary,.btn.btn-outlined{background:transparent!important;border-color:var(--border-color,#dee2e6)!important;color:var(--neutral-800)}.btn.btn-outline-primary:hover,.btn.btn-outlined:hover{background:var(--primary-50)!important;border-color:var(--primary-600)!important;color:var(--primary-600)}.btn.btn-outline-primary.clicked,.btn.btn-outline-primary:active,.btn.btn-outlined.clicked,.btn.btn-outlined:active{background:var(--primary-700)!important;border-color:var(--primary-700)!important;color:var(--white)}.btn.btn-outline-primary.disabled,.btn.btn-outline-primary:disabled,.btn.btn-outlined.disabled,.btn.btn-outlined:disabled{background:transparent!important;border-color:var(--neutral-300)!important;color:var(--neutral-400);opacity:1}.btn-secondary,.btn.btn-secondary{background:var(--primary-50,#e9eef9);border:1px solid var(--primary-50,#e9eef9);color:var(--primary-500-base,#3862c5)}.btn-secondary:hover,.btn.btn-secondary:hover{background:var(--primary-100,#d6dff3);border:1px solid var(--primary-100,#d6dff3);color:var(--primary-600,#2d4e9e)}.btn-secondary.clicked,.btn-secondary:active,.btn-secondary:active:focus,.btn-secondary:focus:active,.btn.btn-secondary.clicked,.btn.btn-secondary:active,.btn.btn-secondary:active:focus,.btn.btn-secondary:focus:active{background:var(--primary-700,#223b76);border:1px solid var(--primary-700,#223b76);color:var(--white)}.btn-secondary.disabled,.btn-secondary:disabled,.btn.btn-secondary.disabled,.btn.btn-secondary:disabled{background:var(--neutral-100);border:1px solid var(--neutral-100);color:var(--neutral-400);opacity:1}.btn-ghost,.btn-text{background:transparent;border-color:transparent;color:var(--primary-500-base,#3862c5)}.btn-ghost:hover,.btn-text:hover{background:var(--primary-50,#e9eef9);border-color:transparent;color:var(--primary-600,#2d4e9e)}.btn-ghost.clicked,.btn-ghost:active,.btn-text.clicked,.btn-text:active{background:var(--primary-700,#223b76);border-color:transparent;color:var(--white)}.btn-ghost.disabled,.btn-ghost:disabled,.btn-text.disabled,.btn-text:disabled{background:transparent;border-color:transparent;color:var(--neutral-400);opacity:1}.btn-link{color:var(--primary-500-base,#3862c5);text-underline-offset:2px;padding:0 var(--spacing-4)}.btn-link,.btn-link:hover{background:transparent;border-color:transparent}.btn-link:hover{color:var(--primary-600)}.btn-link.clicked,.btn-link:active{background:transparent;border-color:transparent;color:var(--primary-700,#223b76)}.btn-link.disabled,.btn-link:disabled{background:transparent;border-color:transparent;color:var(--neutral-400);opacity:1}.btn-success{background-color:var(--success-500);border-color:var(--success-500);color:var(--white)}.btn-success:hover{color:var(--white)}.btn-success:active,.btn-success:hover{background-color:var(--success-700);border-color:var(--success-700)}.btn-danger,.btn-error{background-color:var(--error-500);border-color:var(--error-500);color:var(--white)}.btn-danger:hover,.btn-error:hover{background-color:var(--error-600);border-color:var(--error-600)}.btn-danger:active,.btn-error:active{background-color:var(--error-700);border-color:var(--error-700)}.btn-warning{background-color:var(--warning-500);border-color:var(--warning-500);color:var(--white)}.btn-warning:hover{color:var(--white)}.btn-warning:active,.btn-warning:hover{background-color:var(--warning-700);border-color:var(--warning-700)}.btn-outline-primary{background-color:transparent;border:1px solid var(--primary-500);color:var(--primary-500)}.btn-outline-primary:hover{background-color:var(--primary-500);color:var(--white)}.btn-outline-primary:active{background-color:var(--primary-600);border:1px solid var(--primary-600)}.btn-outline-secondary{background-color:transparent;border:1px solid var(--secondary-500);color:var(--secondary-800)}.btn-outline-secondary:hover{background-color:var(--secondary-500);color:var(--neutral-800)}.btn-outline-secondary:active{background-color:var(--secondary-800);border:1px solid var(--secondary-800)}.btn-outline-success{background-color:transparent;border:1px solid var(--success-500);color:var(--success-500)}.btn-outline-success:hover{background-color:var(--success-500);color:var(--white)}.btn-outline-success:active{background-color:var(--success-600);border:1px solid var(--success-600)}.btn-outline-danger,.btn-outline-error{background-color:transparent;border:1px solid var(--error-500);color:var(--error-500)}.btn-outline-danger:hover,.btn-outline-error:hover{background-color:var(--error-500);color:var(--white)}.btn-outline-danger:active,.btn-outline-error:active{background-color:var(--error-600);border:1px solid var(--error-600)}.btn-outline-warning{background-color:transparent;border:1px solid var(--warning-500);color:var(--warning-500)}.btn-outline-warning:hover{background-color:var(--warning-500);color:var(--white)}.btn-outline-warning:active{background-color:var(--warning-600);border:1px solid var(--warning-600)}.btn-ghost-primary{background-color:transparent;border-color:transparent;color:var(--primary-500)}.btn-ghost-primary:hover{background-color:var(--primary-50);color:var(--primary-600)}.btn-ghost-primary:active{background-color:var(--primary-100);color:var(--primary-700)}.btn-ghost-secondary{background-color:transparent;border-color:transparent;color:var(--secondary-800)}.btn-ghost-secondary:hover{background-color:var(--secondary-500);color:var(--neutral-800)}.btn-ghost-secondary:active{background-color:var(--secondary-800)}.btn-ghost-success{background-color:transparent;border-color:transparent;color:var(--success-500)}.btn-ghost-success:hover{background-color:var(--success-100);color:var(--success-500)}.btn-ghost-success:active{background-color:var(--success-200)}.btn-ghost-danger,.btn-ghost-error{background-color:transparent;border-color:transparent;color:var(--error-500)}.btn-ghost-danger:hover,.btn-ghost-error:hover{color:var(--error-600)}.btn-ghost-danger:active,.btn-ghost-error:active{background-color:var(--error-200)}.btn-ghost-warning{background-color:transparent;border-color:transparent;color:var(--warning-500)}.btn-ghost-warning:hover{background-color:var(--warning-100);color:var(--warning-500)}.btn-ghost-warning:active{background-color:var(--warning-200)}.btn-gradient-1{background:linear-gradient(135deg,var(--gradient-1-start) 0,var(--gradient-1-end) 100%);border-color:var(--gradient-1-start);color:var(--white)}.btn-gradient-1:hover{filter:brightness(.95)}.btn-gradient-1:active{filter:brightness(.9)}.btn-gradient-2{background:linear-gradient(135deg,var(--gradient-2-start) 0,var(--gradient-2-end) 100%);border-color:var(--gradient-2-start);color:var(--white)}.btn-gradient-2:hover{filter:brightness(.95)}.btn-gradient-2:active{filter:brightness(.9)}.btn-gradient-3{background:linear-gradient(135deg,var(--gradient-3-start) 0,var(--gradient-3-end) 100%);border-color:var(--gradient-3-start);color:var(--white)}.btn-gradient-3:hover{filter:brightness(.95)}.btn-gradient-3:active{filter:brightness(.9)}.btn-gradient-success{background:linear-gradient(135deg,var(--gradient-5-start) 0,var(--gradient-5-end) 100%);border-color:var(--gradient-5-start);color:var(--white)}.btn-gradient-success:hover{filter:brightness(.95)}.btn-gradient-success:active{filter:brightness(.9)}.btn-gradient-error{background:linear-gradient(135deg,var(--gradient-6-start) 0,var(--gradient-6-end) 100%);border-color:var(--gradient-6-start);color:var(--white)}.btn-gradient-error:hover{filter:brightness(.95)}.btn-gradient-error:active{filter:brightness(.9)}.btn-gradient-warning{background:linear-gradient(135deg,var(--gradient-7-start) 0,var(--gradient-7-end) 100%);border-color:var(--gradient-7-start);color:var(--white)}.btn-gradient-warning:hover{filter:brightness(.95)}.btn-gradient-warning:active{filter:brightness(.9)}.btn-group{display:inline-flex;vertical-align:middle}.btn-group .btn{position:relative;flex:1 1 auto}.btn-group .btn:not(:first-child){margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}.btn-group .btn:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.btn-group .btn:active,.btn-group .btn:focus,.btn-group .btn:hover{z-index:1}.btn-icon{padding:.75rem;width:auto;height:auto}.btn-icon.btn-sm{padding:.5rem}.btn-icon.btn-lg{padding:1rem}@keyframes button-spin{to{transform:rotate(1turn)}}.btn-fab{position:fixed;bottom:2rem;right:2rem;width:3.5rem;height:3.5rem;border-radius:50%;box-shadow:var(--elevation-3);z-index:var(--zindex-sticky)}.btn-fab:hover{transform:scale(1.1);box-shadow:0 8px 25px rgba(0,0,0,.15)}.btn-fab:active{transform:scale(1.05)}.btn-block{display:block;width:100%}@media (max-width:768px){.btn-responsive{display:block;width:100%;margin-bottom:.5rem}.btn-responsive:last-child{margin-bottom:0}.btn-group{display:flex;flex-direction:column}.btn-group .btn{margin-left:0;margin-top:-1px;border-radius:var(--border-radius-radius-4)}.btn-group .btn:not(:first-child){border-top-left-radius:0;border-top-right-radius:0}.btn-group .btn:not(:last-child){border-bottom-left-radius:0;border-bottom-right-radius:0}}.toggle-demo-card{background:var(--surface-primary);border:2px dashed var(--primary-300,#c4a3ff);border-radius:8px;padding:1.5rem;margin-top:2rem;color:var(--text-primary)}.toggle-table{width:100%;border-collapse:collapse}.toggle-header-row{margin-bottom:var(--spacing-24);padding-bottom:var(--spacing-12);border-bottom:1px solid var(--neutral-50)}.toggle-header-row,.toggle-row{display:grid;grid-template-columns:100px 80px repeat(4,1fr);gap:1.5rem;align-items:center}.toggle-row{margin-bottom:1rem}.toggle-row>div{display:flex;justify-content:center;align-items:center}.toggle-state-header{font-size:.875rem;font-weight:600;color:var(--neutral-700);text-align:center;padding:.5rem}.toggle-label{color:var(--neutral-700)}.toggle-label,.toggle-size-label{font-size:var(--font-size-14);font-weight:500;text-align:center;padding-right:.5rem}.toggle-switch{position:relative;display:inline-block;width:52px;height:24px}.toggle-switch.toggle-small{width:40px;height:16px}.toggle-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--gray-200);transition:.3s;border-radius:var(--radius-full);box-shadow:0 2px 8px rgba(60,60,60,.08)}.toggle-switch input:checked+.slider{background-color:var(--primary-500-base,#3862c5)}.toggle-switch input:disabled+.slider{background-color:var(--toggle-disabled-bg,#e5e7eb);cursor:not-allowed}.slider:before{position:absolute;content:"";height:20px;width:20px;left:2px;top:2px;background-color:var(--white);transition:.3s cubic-bezier(.4,0,.2,1);border-radius:50%;box-shadow:0 1px 4px rgba(60,60,60,.1)}.toggle-switch.toggle-small .slider:before{height:12px;width:12px;left:2px;top:2px}.toggle-switch input:checked+.slider:before{transform:translateX(28px)}.toggle-switch.toggle-small input:checked+.slider:before{transform:translateX(24px)}.toggle-switch input:disabled+.slider:before{background-color:var(--gray-100)}.hover-state .slider{box-shadow:0 4px 12px rgba(60,60,60,.16)}.focused-state{outline:1px solid var(--primary-500-base,#3862c5);outline-offset:2px;border-radius:20px}.checkbox-demo-card{margin-top:2.5rem;background:var(--surface-primary,#fff);border:2px dashed var(--primary-300,#c4a3ff);border-radius:8px;padding:1.5rem}.checkbox-title{font-size:1.25rem;font-weight:600;color:var(--primary-700,#3b2e5a);margin-bottom:1.5rem;text-align:left}.checkbox-table{width:100%}.checkbox-header-row{display:grid;grid-template-columns:100px 80px repeat(4,1fr);gap:1.5rem;padding-bottom:.75rem;align-items:center}.checkbox-state-header{font-size:.875rem;font-weight:600;color:var(--neutral-700);text-align:center;padding:.5rem}.checkbox-row{display:grid;grid-template-columns:100px 80px repeat(4,1fr);gap:1.5rem;margin-bottom:1rem;align-items:center}.checkbox-row>label{display:flex;justify-content:center;align-items:center;gap:10px}.checkbox-label{color:var(--neutral-400)}.checkbox-label,.checkbox-size-label{font-size:.875rem;font-weight:500;text-align:right;padding-right:.5rem}.checkbox-size-label{color:var(--text-secondary,#6b7280)}.checkbox-btn{display:inline-flex;align-items:center;cursor:pointer;position:relative;padding:2px;margin:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;gap:4px}.checkbox-btn input[type=checkbox]{opacity:0;position:absolute;width:0;height:0}.checkbox-mark{display:inline-block;width:24px;height:24px;border-radius:2px;border:2px solid var(--neutral-200);background:var(--surface-primary,#fff);box-sizing:border-box;transition:border-color .2s,box-shadow .2s;position:relative}.checkbox-mark:hover{background:var(--neutral-25)}.checkbox-large .checkbox-mark{width:20px;height:20px}.checkbox-small .checkbox-mark{width:16px;height:16px}.checkbox-small .input-label-text{font-size:var(--font-size-12)}.checkbox-btn input[type=checkbox]:checked+.checkbox-mark{background:var(--primary-500-base,#3862c5);border-color:var(--primary-500-base)}.checkbox-btn input[type=checkbox]:checked+.checkbox-mark:after{content:"";display:block;position:absolute;top:40%;left:50%;transform:translate(-50%,-60%) rotate(-45deg);width:12px;height:7px;border-left:2px solid var(--neutral-0,#fff);border-bottom:2px solid var(--neutral-0,#fff)}.checkbox-small input[type=checkbox]:checked+.checkbox-mark:after{width:11.333px;height:6px;border-left-width:2px;border-bottom-width:2px;top:45%}.checkbox-btn input[type=checkbox]:focus+.checkbox-mark,.checkbox-btn.checkbox-focused-state .checkbox-mark,.checkbox-btn.focused-state .checkbox-mark{border-color:var(--primary-500,#3862c5);outline:2px solid var(--primary-500,#3862c5);outline-offset:1px;border-radius:1px}.checkbox-btn input[type=checkbox]:checked:disabled+.checkbox-mark,.checkbox-btn input[type=checkbox]:disabled+.checkbox-mark{opacity:.5;cursor:not-allowed;background:var(--neutral-100,#b7b8bd);border-color:var(--neutral-100,#b7b8bd)}.input-label-text{color:var(--neutral-500);font-size:var(--Font-Size-Body-M,14px);font-style:normal;font-weight:400;line-height:20px;font-family:Inter}.btn-icon{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 12px;border:0;background:var(--neutral-0,#ffffff);color:var(--neutral-600,#6b7280);font-family:Inter,sans-serif;font-size:14px;font-weight:500;line-height:20px;cursor:pointer;transition:all .2s ease;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.btn-icon .material-icons,.btn-icon .material-symbols-outlined,.btn-icon i{font-size:20px;line-height:1}.btn-icon:hover{border-color:var(--primary-500,#3862c5);text-decoration:none}.btn-icon:hover,.btn-icon:hover .material-icons,.btn-icon:hover .material-symbols-outlined,.btn-icon:hover i{color:var(--primary-500,#3862c5)}.btn-icon:focus{outline:2px solid var(--primary-500,#3862c5);outline-offset:2px}.btn-icon:active,.btn-icon:focus{border-color:var(--primary-500,#3862c5);color:var(--primary-500,#3862c5)}.btn-icon:active{background:var(--primary-50,#eff6ff)}.btn-icon.disabled,.btn-icon:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-icon.disabled:hover,.btn-icon:disabled:hover{border-color:var(--neutral-300,#d1d5db);color:var(--neutral-600,#6b7280)}.btn-icon.btn-icon-only{padding:8px;width:36px;height:36px}.btn-icon.btn-icon-only .material-icons,.btn-icon.btn-icon-only .material-symbols-outlined,.btn-icon.btn-icon-only i{margin:0}.btn-icon.btn-icon-sm{padding:6px 10px;font-size:12px}.btn-icon.btn-icon-sm .material-icons,.btn-icon.btn-icon-sm .material-symbols-outlined,.btn-icon.btn-icon-sm i{font-size:16px}.btn-icon.btn-icon-sm.btn-icon-only{padding:6px;width:28px;height:28px}.btn-icon.btn-icon-lg{padding:8px 10px;font-size:16px}.btn-icon.btn-icon-lg .material-icons,.btn-icon.btn-icon-lg .material-symbols-outlined,.btn-icon.btn-icon-lg i{font-size:23px;font-weight:300}.btn-icon.btn-icon-lg.btn-icon-only{padding:10px;width:44px;height:44px}.btn-md .material-symbols-outlined{font-size:var(--font-size-20)}.mail-sm .material-symbols-outlined{font-size:var(--font-size-14)}.mail-md .material-symbols-outlined{font-size:var(--font-size-18)}.btn-icon{color:var(--primary-500-base)}.btn-icon:hover{color:var(--primary-600)}.icon-size{font-size:16px;width:16px;height:16px}.button-demo-page.button-demo-container{background:var(--surface-primary);border-radius:var(--border-radius-radius-12);padding:0 var(--spacing-16) var(--spacing-24) var(--spacing-16);max-width:100%;overflow-x:hidden}.button-demo-page .button-demo{font-family:var(
    --font-family-base,Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif
  );background:transparent;color:var(--text-primary)}.button-demo-page .button-demo .mb-2{margin-bottom:8px}.button-demo-page .button-demo .heading{font-size:clamp(1.5rem,4vw,2rem);font-weight:var(--font-weight-700);color:var(--text-primary);margin-bottom:var(--spacing-12);word-wrap:break-word}.button-demo-page .button-demo .description{font-size:clamp(.875rem,2vw,1rem);line-height:1.5;color:var(--text-secondary,var(--neutral-700));margin-bottom:var(--spacing-16);word-wrap:break-word}.button-demo-page .button-demo .subHeading{font-size:clamp(1.125rem,3vw,1.25rem);font-weight:var(--font-weight-600);color:var(--text-primary);margin-bottom:var(--spacing-12);word-wrap:break-word}.button-demo-page .button-demo .button-system-table{border:2px dashed var(--primary-300);border-radius:var(--border-radius-radius-8);padding:var(--spacing-24);background:var(--surface-primary);margin-bottom:40px;overflow-x:auto}.button-demo-page .button-demo .table-header{display:grid;grid-template-columns:100px 80px repeat(4,1fr);gap:var(--spacing-16);margin-bottom:var(--spacing-24);padding-bottom:var(--spacing-12);border-bottom:1px solid var(--border-color,var(--neutral-50));min-width:-moz-min-content;min-width:min-content}.button-demo-page .button-demo .size-label,.button-demo-page .button-demo .table-header .size-label,.button-demo-page .button-demo .table-header .variant-label{font-size:var(--font-size-14);font-weight:var(--font-weight-600);color:var(--text-secondary,var(--neutral-700));text-align:right;padding-right:var(--spacing-8)}.button-demo-page .button-demo .state-header{font-size:var(--font-size-14);font-weight:var(--font-weight-600);color:var(--text-secondary,var(--neutral-700));text-align:left;padding:var(--spacing-8)}.button-demo-page .button-demo .button-row{display:grid;grid-template-columns:100px 1fr;gap:var(--spacing-16);margin-bottom:var(--spacing-24);align-items:start;min-width:-moz-min-content;min-width:min-content}.button-demo-page .button-demo .variant-label{font-size:var(--font-size-14);font-weight:var(--font-weight-600);color:var(--text-secondary,var(--neutral-700));padding:var(--spacing-8) 0;display:flex;align-items:center;writing-mode:vertical-lr;text-orientation:mixed;justify-content:center}.button-demo-page .button-demo .size-buttons{display:flex;flex-direction:column;gap:var(--spacing-12)}.button-demo-page .button-demo .size-row{display:grid;grid-template-columns:80px repeat(4,1fr);gap:var(--spacing-16);align-items:center;min-width:-moz-min-content;min-width:min-content}.button-demo-page .button-demo .size-label{font-size:var(--font-size-14);font-weight:var(--font-weight-600);color:var(--text-secondary,var(--neutral-700));text-align:right;padding-right:var(--spacing-8)}.button-demo-page .button-demo .btn-medium{width:120px;min-width:120px}.button-demo-page .button-demo .btn-small{width:100px;min-width:100px}.button-demo-page .button-demo .clicked{filter:brightness(.9)}.button-demo-page .button-demo .checkbox-demo-card,.button-demo-page .button-demo .radio-demo-card,.button-demo-page .button-demo .toggle-demo-card{background:var(--surface-primary);border:2px dashed var(--primary-300);border-radius:var(--border-radius-radius-8);padding:var(--spacing-24);margin-bottom:var(--spacing-24)}.button-demo-page .button-demo .checkbox-size-label,.button-demo-page .button-demo .radio-size-label,.button-demo-page .button-demo .toggle-size-label{font-size:var(--font-size-14);font-weight:var(--font-weight-600);color:var(--text-secondary,var(--neutral-700));text-align:right;padding-right:var(--spacing-8)}.button-demo-page .button-demo .checkbox-state-header,.button-demo-page .button-demo .radio-state-header,.button-demo-page .button-demo .toggle-state-header{font-size:var(--font-size-14);font-weight:var(--font-weight-600);color:var(--text-secondary,var(--neutral-700));text-align:center;padding:var(--spacing-8)}.button-demo-page .button-demo .radio-btn.radio-small input[type=radio]{width:16px;height:16px;border-width:1.5px}.button-demo-page .button-demo .radio-btn.radio-large input[type=radio]{width:24px;height:24px;border-width:2px}.button-demo-page .button-demo .radio-btn input[type=radio]:checked{background:var(--primary-500);box-shadow:inset 0 0 0 4px var(--surface-primary)}.button-demo-page .button-demo .radio-btn input[type=radio]:disabled{border-color:var(--neutral-300);background:var(--neutral-200);cursor:not-allowed}.button-demo-page .button-demo .toggle-title{font-size:var(--font-size-20);font-weight:var(--font-weight-600);color:var(--text-primary,var(--neutral-800));margin-bottom:var(--spacing-24);text-align:left}.button-demo-page .button-demo .demo-instructions{background:var(--surface-secondary);border:1px solid var(--border-color,var(--neutral-200));border-radius:var(--border-radius-radius-6);padding:var(--spacing-12) var(--spacing-16);margin-bottom:var(--spacing-24);color:var(--text-secondary,var(--neutral-500));font-size:var(--font-size-14);text-align:center;font-style:italic}.button-demo-page .button-demo .chip-demo-card{margin:32px auto;padding:24px;background:var(--surface-primary);border-radius:16px;box-shadow:0 2px 8px rgba(0,0,0,.08);max-width:100%;border:2px dashed var(--primary-300,#a259ff)}.button-demo-page .button-demo .chip-demo-table{display:table;width:100%;border-collapse:separate;border-spacing:0 16px}.button-demo-page .button-demo .chip-demo-row{display:table-row}.button-demo-page .button-demo .chip-demo-header .chip-demo-cell{font-size:14px;font-weight:500;color:var(--text-secondary,#6b7280);padding-bottom:8px}.button-demo-page .button-demo .chip-demo-cell{display:table-cell;vertical-align:middle;text-align:center;padding:8px 12px}.button-demo-page .button-demo .chip-demo-label{font-size:14px;font-weight:600;color:var(--neutral-800);text-align:left}.button-demo-page .button-demo .chip{display:inline-flex;align-items:center;border-radius:var(--border-radius-radius-infinite);background:var(--neutral-0);color:var(--neutral-700);font-weight:var(--font-weight-500);font-size:var(--font-size-12);padding:var(--spacing-4) var(--spacing-8);height:25px;border:1px solid var(--neutral-100);transition:all var(--transition-duration-200) ease;cursor:pointer;gap:var(--spacing-4);-webkit-user-select:none;-moz-user-select:none;user-select:none;justify-content:center}.button-demo-page .button-demo .chip-md{height:var(--size-1000);font-size:var(--font-size-14);padding:var(--spacing-4) var(--spacing-12)}.button-demo-page .button-demo .chip-icon{display:flex;color:var(--neutral-400);font-size:var(--font-size-14)}.button-demo-page .button-demo .chip-md .chip-icon{font-size:var(--font-size-18)}.button-demo-page .button-demo .chip-label{display:inline-flex;align-items:center}.button-demo-page .button-demo .chip-close{display:flex;color:var(--neutral-400);cursor:pointer;font-size:var(--font-size-14);padding:var(--spacing-2);border-radius:var(--radius-full);transition:all var(--transition-duration-200) ease}.button-demo-page .button-demo .chip-md .chip-close{font-size:var(--font-size-18)}.button-demo-page .button-demo .chip-close:hover{background:var(--neutral-50);color:var(--neutral-700)}.button-demo-page .button-demo .chip-default{background:var(--neutral-0);border-color:var(--neutral-100);color:var(--neutral-700)}.button-demo-page .button-demo .chip-hovered{background:var(--neutral-10);border-color:var(--neutral-50);color:var(--neutral-700)}.button-demo-page .button-demo .chip-focused{background:var(--neutral-0);border-color:var(--primary-500);box-shadow:0 0 0 2px var(--primary-50);color:var(--neutral-700)}.button-demo-page .button-demo .chip-selected{background:var(--primary-500);border-color:var(--primary-500);color:var(--neutral-0)}.button-demo-page .button-demo .chip-selected .chip-close,.button-demo-page .button-demo .chip-selected .chip-icon{color:var(--neutral-0)}.button-demo-page .button-demo .chip-disabled{background:var(--utility-bg-1);color:var(--neutral-200);border-color:var(--neutral-25);cursor:not-allowed}.button-demo-page .button-demo .chip-disabled .chip-close,.button-demo-page .button-demo .chip-disabled .chip-icon{color:var(--neutral-200)}@media (max-width:1024px){.button-demo-page .button-demo .button-row{grid-template-columns:80px 1fr}.button-demo-page .button-demo .variant-label{writing-mode:horizontal-tb;text-orientation:mixed;min-height:auto;justify-content:flex-start}}@media (max-width:768px){.button-demo-page.button-demo-container{padding:0 var(--spacing-12) var(--spacing-20) var(--spacing-12)}.button-demo-page .button-demo{padding:var(--spacing-12)}.button-demo-container .radio-label{text-align:center!important}.button-demo-page .button-demo .button-system-table{padding:var(--spacing-12);margin-bottom:var(--spacing-24)}.button-demo-page .button-demo .table-header{grid-template-columns:60px 60px repeat(4,minmax(72px,1fr));gap:var(--spacing-8);margin-bottom:var(--spacing-16);padding-bottom:var(--spacing-8);font-size:var(--font-size-12)}.button-demo-page .button-demo .state-header{font-size:var(--font-size-12);padding:var(--spacing-4)}.button-demo-page .button-demo .button-row{display:flex;flex-direction:column;margin-bottom:var(--spacing-20);border:1px solid var(--border-color,var(--neutral-100));border-radius:var(--border-radius-radius-6);padding:var(--spacing-12);min-width:0}.button-demo-page .button-demo .variant-label{font-size:var(--font-size-14);font-weight:var(--font-weight-600);margin-bottom:var(--spacing-8);color:var(--text-primary);writing-mode:horizontal-tb}.button-demo-page .button-demo .size-buttons{width:100%}.button-demo-page .button-demo .size-row{display:grid;grid-template-columns:1fr;gap:var(--spacing-8);min-width:0}.button-demo-page .button-demo .size-row .size-label{text-align:left;margin-bottom:0;padding-right:0;grid-column:1}.button-demo-page .button-demo .size-row .btn{max-width:100%;min-width:0}.button-demo-page .button-demo .checkbox-demo-card,.button-demo-page .button-demo .radio-demo-card,.button-demo-page .button-demo .toggle-demo-card{padding:var(--spacing-12)}.button-demo-page .button-demo .checkbox-size-label,.button-demo-page .button-demo .radio-size-label,.button-demo-page .button-demo .toggle-size-label{text-align:left;margin-bottom:var(--spacing-4);font-weight:var(--font-weight-600);color:var(--text-secondary)}.button-demo-page .button-demo .checkbox-table,.button-demo-page .button-demo .chip-demo-table,.button-demo-page .button-demo .radio-table,.button-demo-page .button-demo .toggle-table{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--border-color,var(--neutral-100));border-radius:var(--border-radius-radius-6);background:var(--surface-primary);display:block}.button-demo-page .button-demo .checkbox-header-row,.button-demo-page .button-demo .radio-header-row,.button-demo-page .button-demo .toggle-header-row{min-width:-moz-max-content;min-width:max-content;padding:var(--spacing-8);gap:var(--spacing-8)}.button-demo-page .button-demo .checkbox-row,.button-demo-page .button-demo .radio-row,.button-demo-page .button-demo .toggle-row{min-width:-moz-max-content;min-width:max-content;gap:var(--spacing-8);margin-bottom:var(--spacing-8)}.button-demo-page .button-demo .chip-demo-card{padding:var(--spacing-12);margin:var(--spacing-16) 0}.button-demo-page .button-demo .chip-demo-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}.button-demo-page .button-demo .chip-demo-row{display:block}.button-demo-page .button-demo .chip-demo-cell{display:block;padding:var(--spacing-8);text-align:left;border-bottom:1px solid var(--neutral-100)}.button-demo-page .button-demo .chip-demo-header .chip-demo-cell{font-weight:var(--font-weight-600);border-bottom:2px solid var(--neutral-200)}}@media (max-width:576px){.button-demo-page.button-demo-container{padding:0 var(--spacing-8) var(--spacing-16) var(--spacing-8)}.button-demo-page .button-demo{padding:var(--spacing-8)}.button-demo-page .button-demo .heading{font-size:1.375rem}.button-demo-page .button-demo .subHeading{font-size:1.125rem}.button-demo-page .button-demo .button-system-table{padding:var(--spacing-8)}.button-demo-page .button-demo .table-header{grid-template-columns:50px 50px repeat(4,minmax(64px,1fr));gap:var(--spacing-4);font-size:11px}.button-demo-page .button-demo .state-header{font-size:11px;padding:var(--spacing-2)}.button-demo-page .button-demo .size-row{grid-template-columns:1fr}.button-demo-page .button-demo .size-row .btn{width:100%;min-width:0}.button-demo-page .button-demo .checkbox-demo-card,.button-demo-page .button-demo .radio-demo-card,.button-demo-page .button-demo .toggle-demo-card{padding:var(--spacing-8)}}.metric-card{display:flex;padding:var(--spacing-16);flex-direction:column;align-items:flex-start;gap:var(--spacing-8);flex:1 0 0;border-radius:6px 8px 6px 6px;border-bottom:2px solid var(--primary-700);background:var(--surface-primary)}.metric-value{font-size:var(--font-size-24);font-weight:var(--font-weight-700);color:var(--primary-700);margin-bottom:0;font-family:Mulish,sans-serif}.metric-label{font-size:var(--font-size-12);color:var(--neutral-600);font-weight:var(--font-weight-500);margin-bottom:0;font-family:Inter,sans-serif}.metric-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--neutral-25);padding-bottom:var(--spacing-12);margin-bottom:var(--spacing-12);position:relative;overflow:visible}.metric-title{font-size:var(--font-size-18);font-weight:var(--font-weight-600);color:var(--neutral-800);font-family:Inter,sans-serif}.suggestion-card{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-12);padding:var(--spacing-10) var(--spacing-12);background:var(--primary-50);border-radius:var(--radius-8);box-shadow:0 0 0 1px var(--primary-50) inset}.suggestion-card__left{display:flex;align-items:center;gap:var(--spacing-8);min-width:0}.suggestion-card__icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:var(--radius-6);background:var(--primary-50);color:var(--primary-700);font-size:14px}.suggestion-card__content{display:flex;flex-direction:column;gap:var(--spacing-2);min-width:0}.suggestion-card__title{color:var(--neutral-900);font-weight:500;font-size:13px;line-height:1.4;white-space:normal;word-wrap:break-word;overflow-wrap:break-word}.suggestion-card__highlight{margin-left:var(--spacing-3);color:#111827;font-weight:600;font-size:13px}.suggestion-card__hint{color:var(--primary-600);text-decoration:none;font-size:12px}.suggestion-card__hint:hover{text-decoration:underline}@media (max-width:480px){.suggestion-card{flex-direction:column;align-items:stretch;gap:12px}.suggestion-card__cta{align-self:flex-end}}