:root[data-theme=light],:root:not([data-theme]){--marks-color-primary-solid: #0E5842;--marks-color-red-100: #FFE4E9;--marks-color-red-200: #FD3860;--marks-color-red-300: #97001E;--marks-color-blue-100: #D7E7FF;--marks-color-blue-200: #2576F7;--marks-color-blue-300: #050D3A;--marks-color-green-100: #C0F3E4;--marks-color-green-200: #0FAF80;--marks-color-green-300: #0E5842;--marks-color-orange-100: #FFEBD2;--marks-color-orange-200: #FF8C00;--marks-color-orange-300: #854900;--marks-color-gray-100: #FAFAFA;--marks-color-gray-150: #ECECEC;--marks-color-gray-200: #D1D1D1;--marks-color-gray-300: #8D8D8D;--marks-color-gray-350: #6F6F6F;--marks-color-gray-400: #505050;--marks-color-gray-500: #2A2A2A;--marks-color-white: #FFFFFF;--marks-color-black: #000000}:root[data-theme=dark]{--marks-color-primary-solid: #0E5842;--marks-color-red-100: #FFE4E9;--marks-color-red-200: #FD3860;--marks-color-red-300: #97001E;--marks-color-blue-100: #D7E7FF;--marks-color-blue-200: #2576F7;--marks-color-blue-300: #050D3A;--marks-color-green-100: #C0F3E4;--marks-color-green-200: #0FAF80;--marks-color-green-300: #0E5842;--marks-color-orange-100: #FFEBD2;--marks-color-orange-200: #FF8C00;--marks-color-orange-300: #854900;--marks-color-gray-100: #FAFAFA;--marks-color-gray-150: #ECECEC;--marks-color-gray-200: #D1D1D1;--marks-color-gray-300: #8D8D8D;--marks-color-gray-350: #6F6F6F;--marks-color-gray-400: #505050;--marks-color-gray-500: #2A2A2A;--marks-color-white: #FFFFFF;--marks-color-black: #000000}:root{--marks-spacing-0: 0px;--marks-spacing-4: 4px;--marks-spacing-8: 8px;--marks-spacing-12: 12px;--marks-spacing-16: 16px;--marks-spacing-20: 20px;--marks-spacing-24: 24px;--marks-spacing-28: 28px;--marks-spacing-32: 32px;--marks-spacing-36: 36px;--marks-spacing-40: 40px;--marks-spacing-56: 56px;--marks-spacing-72: 72px;--marks-spacing-80: 80px;--marks-radius-0: 0px;--marks-radius-8: 8px;--marks-radius-12: 12px;--marks-radius-16: 16px;--marks-radius-24: 24px;--marks-radius-full: 100px}.marks-h1-regular{font-size:48px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:400;line-height:1.2;word-wrap:break-word}.marks-h1-bold{font-size:48px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:700;line-height:1.2;word-wrap:break-word}.marks-h2-regular{font-size:36px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:400;line-height:1.2;word-wrap:break-word}.marks-h2-bold{font-size:36px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:700;line-height:1.2;word-wrap:break-word}.marks-h3-regular{font-size:24px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:400;line-height:1.3;word-wrap:break-word}.marks-h3-bold{font-size:24px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:700;line-height:1.3;word-wrap:break-word}.marks-h4-regular{font-size:18px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:400;line-height:1.4;word-wrap:break-word}.marks-h4-bold{font-size:18px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:700;line-height:1.4;word-wrap:break-word}.marks-h5-regular{font-size:16px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:400;line-height:1.4;word-wrap:break-word}.marks-h5-bold{font-size:16px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:700;line-height:1.4;word-wrap:break-word}.marks-paragraph-lg{font-size:18px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:400;line-height:27px;word-wrap:break-word}.marks-paragraph-md-multiline{font-size:15px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:400;line-height:22.5px;word-wrap:break-word}.marks-paragraph-md-one-line{font-size:15px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:400;word-wrap:break-word}.marks-paragraph-md-bold{font-size:15px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:700;word-wrap:break-word}.marks-paragraph-sm-multiline{font-size:13px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:400;line-height:19.5px;word-wrap:break-word}.marks-paragraph-sm-one-line{font-size:13px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:400;word-wrap:break-word}.marks-paragraph-sm-bold{font-size:13px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:700;word-wrap:break-word}.marks-paragraph-xs{font-size:10px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:700;word-wrap:break-word}.marks-button-lg{font-size:16px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:500;word-wrap:break-word}.marks-button-md{font-size:15px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:500;word-wrap:break-word}.marks-button-sm{font-size:13px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:500;word-wrap:break-word}.preview-container{display:flex;height:100vh;overflow:hidden}.preview-nav{width:240px;background:var(--marks-color-white);border-right:1px solid var(--marks-color-gray-200);overflow-y:auto;padding:var(--marks-spacing-24)}.preview-nav h2{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--marks-color-gray-400);margin-bottom:var(--marks-spacing-16);margin-top:var(--marks-spacing-24)}.preview-nav h2:first-child{margin-top:0}.preview-nav ul{list-style:none}.preview-nav li{margin-bottom:var(--marks-spacing-4)}.preview-nav a{display:block;padding:var(--marks-spacing-8) var(--marks-spacing-12);color:var(--marks-color-gray-500);text-decoration:none;border-radius:var(--marks-radius-8);font-size:14px;transition:background-color .15s}.preview-nav a:hover{background:var(--marks-color-gray-100)}.preview-nav a.active{background:var(--marks-color-primary-solid);color:var(--marks-color-white)}.preview-content{flex:1;overflow-y:auto;padding:var(--marks-spacing-40)}.preview-section{margin-bottom:var(--marks-spacing-56)}.preview-section h1{font-size:32px;font-weight:600;color:var(--marks-color-gray-500);margin-bottom:var(--marks-spacing-8)}.preview-section p{color:var(--marks-color-gray-400);margin-bottom:var(--marks-spacing-32);font-size:16px}.preview-section h2{font-size:20px;font-weight:600;color:var(--marks-color-gray-500);margin-bottom:var(--marks-spacing-16);margin-top:var(--marks-spacing-32)}.preview-section h2:first-of-type{margin-top:0}.token-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));gap:var(--marks-spacing-16);margin-bottom:var(--marks-spacing-32)}.token-card{background:var(--marks-color-white);border:1px solid var(--marks-color-gray-200);border-radius:var(--marks-radius-12);padding:var(--marks-spacing-16);overflow:hidden}.token-card-header{margin-bottom:var(--marks-spacing-12)}.token-card-name{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--marks-color-gray-400);margin-bottom:var(--marks-spacing-4)}.token-card-value{font-size:14px;font-family:"Monaco","Menlo",monospace;color:var(--marks-color-gray-500);word-break:break-all}.color-sample{width:100%;height:80px;border-radius:var(--marks-radius-8);margin-bottom:var(--marks-spacing-12);border:1px solid var(--marks-color-gray-200)}.spacing-sample{background:var(--marks-color-primary-solid);opacity:.2;margin-bottom:var(--marks-spacing-12);border-radius:var(--marks-radius-4)}.spacing-sample-label{font-size:11px;color:var(--marks-color-gray-400);text-align:center;padding:var(--marks-spacing-4) 0}.radius-sample{width:100%;height:60px;background:var(--marks-color-primary-solid);opacity:.2;margin-bottom:var(--marks-spacing-12);display:flex;align-items:center;justify-content:center}.radius-sample-label{font-size:11px;color:var(--marks-color-gray-400)}.theme-toggle{position:fixed;top:var(--marks-spacing-16);right:var(--marks-spacing-16);padding:var(--marks-spacing-8) var(--marks-spacing-16);background:var(--marks-color-white);border:1px solid var(--marks-color-gray-200);border-radius:var(--marks-radius-8);cursor:pointer;font-size:14px;color:var(--marks-color-gray-500);z-index:100}.theme-toggle:hover{background:var(--marks-color-gray-100)}.preview-section.hidden{display:none}.component-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));gap:var(--marks-spacing-24);margin-bottom:var(--marks-spacing-32)}.component-card{display:flex;flex-direction:column;align-items:center;gap:var(--marks-spacing-12);padding:var(--marks-spacing-16);background:var(--marks-color-white);border:1px solid var(--marks-color-gray-200);border-radius:var(--marks-radius-12)}.component-label{font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--marks-color-gray-400);text-align:center}.component-interactive{display:flex;flex-direction:column;align-items:center;gap:var(--marks-spacing-16);padding:var(--marks-spacing-24);background:var(--marks-color-white);border:1px solid var(--marks-color-gray-200);border-radius:var(--marks-radius-12)}.component-status{font-size:14px;color:var(--marks-color-gray-400)}.toggle-container{display:flex;align-items:center;justify-content:center;min-height:40px}.marks-toggle{position:relative;display:inline-flex;align-items:center;border:none;background:transparent;padding:0;cursor:pointer;outline:none;transition:all .2s ease}.marks-toggle:focus-visible{outline:2px solid var(--marks-color-primary-solid);outline-offset:2px;border-radius:var(--marks-radius-8)}.marks-toggle__track{position:relative;width:44px;height:24px;background:var(--marks-color-gray-200);border-radius:var(--marks-radius-full);transition:background-color .2s ease}.marks-toggle__thumb{position:absolute;top:2px;left:2px;width:20px;height:20px;background:var(--marks-color-white);border-radius:var(--marks-radius-full);transition:transform .2s ease,box-shadow .2s ease;box-shadow:0 2px 4px rgba(0,0,0,.1)}.marks-toggle--on .marks-toggle__track{background:var(--marks-color-primary-solid)}.marks-toggle--on .marks-toggle__thumb{transform:translateX(20px)}.marks-toggle--hover-off:hover .marks-toggle__track{background:var(--marks-color-gray-300)}.marks-toggle--hover-on:hover .marks-toggle__track{background:var(--marks-color-green-300)}.marks-toggle--disabled{cursor:not-allowed;opacity:.5}.marks-toggle--disabled .marks-toggle__track{background:var(--marks-color-gray-200)}.marks-toggle--disabled.marks-toggle--on .marks-toggle__track{background:var(--marks-color-gray-300)}
