:root{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.6;font-weight:400;--color-bg-primary: hsl(30, 30%, 96%);--color-bg-secondary: hsl(30, 25%, 98%);--color-bg-tertiary: hsl(30, 20%, 100%);--color-text-primary: hsl(25, 15%, 25%);--color-text-secondary: hsl(25, 10%, 45%);--color-text-tertiary: hsl(25, 8%, 60%);--color-accent-primary: hsl(215, 60%, 55%);--color-accent-secondary: hsl(190, 55%, 50%);--color-accent-gradient: linear-gradient(135deg, hsl(215, 60%, 55%), hsl(190, 55%, 50%));--color-success: hsl(142, 50%, 45%);--color-warning: hsl(40, 85%, 50%);--color-error: hsl(0, 65%, 55%);--glass-bg: rgba(255, 255, 255, .7);--glass-border: rgba(100, 80, 70, .15);--glass-shadow: 0 4px 20px rgba(0, 0, 0, .06);--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 1.5rem;--spacing-lg: 2rem;--spacing-xl: 3rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--transition-fast: .15s ease-in-out;--transition-normal: .25s ease-in-out;--transition-slow: .35s ease-in-out;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;margin:0;padding:0}body{margin:0;min-width:320px;min-height:100vh;background:var(--color-bg-primary);color:var(--color-text-primary);display:flex;justify-content:center;align-items:center}#root{width:100%}h1{font-size:2.5rem;font-weight:700;line-height:1.2;background:var(--color-accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--spacing-md)}h2{font-size:1.5rem;font-weight:600;color:var(--color-text-primary);margin-bottom:var(--spacing-sm)}h3{font-size:1.125rem;font-weight:600;color:var(--color-text-secondary);margin-bottom:var(--spacing-xs)}.glass-card{background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow);padding:var(--spacing-lg);transition:transform var(--transition-normal),box-shadow var(--transition-normal)}.glass-card:hover{transform:translateY(-2px);box-shadow:0 8px 32px #0000001a}.content-page{max-width:800px;margin:0 auto;padding:var(--spacing-lg);background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow)}.back-link{display:inline-block;margin-bottom:2rem;color:var(--color-accent-primary);text-decoration:none;font-weight:500;font-size:.9rem;transition:transform var(--transition-fast)}.back-link:hover{transform:translate(-4px)}.content-page h1{margin-bottom:.5rem;background:var(--color-accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.last-updated{font-size:.85rem;color:var(--color-text-tertiary);margin-bottom:2rem}.content-page section{margin-bottom:2.5rem}.content-page h2{font-size:1.25rem;margin-bottom:1rem}.content-page p{color:var(--color-text-secondary);margin-bottom:1rem}.content-page ul{padding-left:1.5rem;color:var(--color-text-secondary)}.content-page li{margin-bottom:.75rem}.footer-links{display:flex;justify-content:center;gap:1.5rem;margin-top:1.5rem;flex-wrap:wrap}.footer-links a{color:var(--color-text-secondary);text-decoration:none;font-size:.85rem;transition:color var(--transition-fast)}.nav-link{color:var(--color-text-secondary);text-decoration:none;font-size:.95rem;font-weight:500;transition:all var(--transition-fast);padding:.4rem .8rem;border-radius:var(--radius-sm);position:relative;overflow:hidden}.nav-link:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background:var(--color-accent-primary);transition:all var(--transition-normal);transform:translate(-50%)}.nav-link:hover{color:var(--color-accent-primary);background:#5d85c314}.nav-link:hover:after{width:100%}.tab-container{display:flex;justify-content:center;margin-bottom:var(--spacing-lg)}.tab-segmented-control{display:flex;background:#0000000a;padding:4px;border-radius:var(--radius-xl);position:relative;width:100%;max-width:400px;border:1px solid var(--glass-border)}.tab-button{flex:1;background:none;border:none;padding:.75rem 1rem;font-size:1rem;font-weight:600;color:var(--color-text-secondary);cursor:pointer;z-index:1;transition:color var(--transition-normal);border-radius:var(--radius-xl);box-shadow:none}.tab-button:hover{background:none;transform:none;color:var(--color-text-primary)}.tab-button.active{color:#fff;background:none;box-shadow:none}.tab-glider{position:absolute;top:4px;left:4px;width:calc(50% - 4px);height:calc(100% - 8px);background:var(--color-accent-gradient);border-radius:var(--radius-xl);transition:transform .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #5d85c34d}.app-header{margin-bottom:var(--spacing-xl);padding:1rem 0;border-bottom:1px solid var(--glass-border);position:sticky;top:0;background:#ffffffd9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:100}.header-container{display:flex;justify-content:space-between;align-items:center;max-width:1400px;margin:0 auto;padding:0 var(--spacing-lg);gap:2rem}.header-brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;transition:opacity var(--transition-fast)}.header-brand:hover{opacity:.9}.brand-logo{width:40px;height:40px;object-fit:contain;border-radius:8px}.brand-title{margin:0;font-size:1.5rem;font-weight:700;background:var(--color-accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;white-space:nowrap}.header-description{color:var(--color-text-secondary);font-size:1rem;margin:1rem auto 0;max-width:800px;text-align:center;padding:0 var(--spacing-lg)}.desktop-nav{display:flex;align-items:center;gap:1.5rem}.hamburger{display:none;flex-direction:column;justify-content:space-around;width:2rem;height:1.5rem;background:transparent;border:none;cursor:pointer;padding:0;z-index:1001}.hamburger span{width:2rem;height:.2rem;background:var(--color-accent-primary);border-radius:10px;transition:all .3s ease;position:relative}.hamburger.open span:first-child{transform:translateY(10px) rotate(45deg)}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}.mobile-nav-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:1000;opacity:0;visibility:hidden;transition:all .3s ease}.mobile-nav-overlay.show{opacity:1;visibility:visible}.mobile-nav{position:fixed;top:0;right:-300px;width:300px;height:100%;background:var(--color-bg-primary);box-shadow:-4px 0 24px #00000026;padding:var(--spacing-xl) var(--spacing-lg);display:flex;flex-direction:column;gap:.5rem;transition:right .4s cubic-bezier(.4,0,.2,1);z-index:1002;text-align:left;height:auto}.mobile-nav.open{right:0}.mobile-nav-header{display:flex;justify-content:flex-end;margin-bottom:var(--spacing-lg)}.close-menu{background:none;border:none;font-size:2.5rem;line-height:1;color:var(--color-text-secondary);cursor:pointer;padding:0;transition:color var(--transition-fast)}.close-menu:hover{color:var(--color-error)}.mobile-nav .nav-link{font-size:1.1rem;padding:1rem;width:100%;border-bottom:1px solid var(--glass-border);border-radius:0}.mobile-nav .nav-link:last-child{border-bottom:none}@media(max-width:992px){.desktop-nav{display:none}.hamburger{display:flex}.header-container{padding:0 var(--spacing-md)}.brand-title{font-size:1.25rem}}@media(max-width:480px){.brand-title{font-size:1.1rem}.brand-logo{width:32px;height:32px}}input[type=number],input[type=text]{width:100%;height:32px;padding:4px 11px;background:var(--color-bg-tertiary);border:1px solid var(--glass-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-family:inherit;font-size:14px;font-weight:500;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}input[type=number]:focus,input[type=text]:focus{outline:none;border-color:var(--color-accent-primary);box-shadow:0 0 0 3px #5d85c326}input[type=number]:hover,input[type=text]:hover{border-color:#5d85c366}.input-label{color:var(--color-text-secondary);font-weight:500;font-size:.85rem;display:block;margin-bottom:.4rem}.unit-toggle{display:flex;background:var(--color-bg-primary);padding:2px;border-radius:4px;height:20px;align-items:center;border:1px solid var(--glass-border)}.unit-toggle button{background:none;border:none;padding:0 6px;font-size:.7rem;font-weight:600;color:var(--color-text-tertiary);cursor:pointer;border-radius:2px;transition:all var(--transition-fast);height:16px;line-height:16px;box-shadow:none}.unit-toggle button:hover{color:var(--color-text-secondary);background:#00000008;transform:none}.unit-toggle button.active{background:var(--color-accent-primary);color:#fff;box-shadow:0 2px 4px #0000000d}.unit-toggle button:active{transform:none}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;background:var(--color-bg-tertiary);border-radius:3px;outline:none;margin:var(--spacing-sm) 0;cursor:pointer}input[type=range]::-webkit-slider-track{background:linear-gradient(to right,var(--color-accent-primary) 0%,var(--color-accent-primary) var(--range-progress, 50%),var(--color-bg-tertiary) var(--range-progress, 50%),var(--color-bg-tertiary) 100%);height:6px;border-radius:3px}input[type=range]::-moz-range-track{background:var(--color-bg-tertiary);height:6px;border-radius:3px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:var(--color-accent-gradient);border-radius:50%;cursor:pointer;box-shadow:0 2px 6px #00000026;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}input[type=range]::-moz-range-thumb{width:20px;height:20px;background:var(--color-accent-primary);border:none;border-radius:50%;cursor:pointer;box-shadow:0 2px 6px #00000026;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 4px 12px #5d85c366}input[type=range]::-moz-range-thumb:hover{transform:scale(1.15);box-shadow:0 4px 12px #5d85c366}button{padding:.75rem 1.5rem;background:var(--color-bg-tertiary);border:1px solid var(--glass-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-family:inherit;font-size:1rem;font-weight:600;cursor:pointer;transition:all var(--transition-fast);position:relative;overflow:hidden}button:hover{background:var(--color-bg-secondary);border-color:var(--color-accent-primary);transform:translateY(-1px)}button:active{transform:translateY(0)}button.active{background:var(--color-accent-gradient);border-color:transparent;box-shadow:0 4px 12px #5d85c340}.text-gradient{background:var(--color-accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.fade-in{animation:fadeIn var(--transition-normal) ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.payment-breakdown-grid{display:flex;flex-direction:column;gap:2rem}.input-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:.5rem}.input-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:.5rem}@media(max-width:1024px){.input-grid,.input-grid-3{grid-template-columns:repeat(2,1fr)}}@media(max-width:500px){.input-grid,.input-grid-3{grid-template-columns:1fr}}@media(max-width:768px){h1{font-size:2rem}h2{font-size:1.25rem}.glass-card{padding:var(--spacing-md)}.payment-breakdown-grid{grid-template-columns:1fr;gap:1.5rem}}
