.layout{display:flex;flex-direction:column;min-height:100vh}.layout-content{flex:1;padding-bottom:calc(70px + env(safe-area-inset-bottom));overflow-y:auto}.bottom-nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;background:var(--color-bg);border-top:1px solid var(--color-border);padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -2px 10px #0000000d;z-index:100}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 16px;text-decoration:none;color:var(--color-text-secondary);transition:color .2s;min-height:60px;flex:1;-webkit-tap-highlight-color:transparent}.nav-item.active{color:var(--color-primary)}.nav-icon{font-size:24px;margin-bottom:4px}.nav-label{font-size:12px;font-weight:500}.nav-item.active:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:40px;height:3px;background:var(--color-primary);border-radius:0 0 3px 3px}.page-header{background:var(--color-bg);padding:20px var(--spacing-unit);border-bottom:1px solid var(--color-border);margin-bottom:16px}.page-header h1{margin-bottom:4px}.page-header p{font-size:14px}.home-page{padding-bottom:20px}.install-prompt{margin-bottom:24px;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border:none}.install-prompt h3{color:#fff;margin-bottom:8px}.install-prompt p{margin-bottom:12px;opacity:.9}.install-button{width:100%;padding:12px;background:#fff;color:var(--color-primary);font-weight:600}.quick-links{display:grid;gap:16px;margin-bottom:24px}.quick-link-card{text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s;cursor:pointer}.quick-link-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.quick-link-icon{font-size:32px;display:block;margin-bottom:8px}.quick-link-card h3{margin-bottom:4px}.quick-link-card p{font-size:14px;color:var(--color-text-secondary);margin:0}.home-features{margin-top:32px}.home-features h2{margin-bottom:16px}.home-features ul{list-style:none;padding:0}.home-features li{padding:12px;background:var(--color-bg);border-radius:var(--radius);margin-bottom:8px;font-size:16px;border:1px solid var(--color-border)}.tools-page{padding-bottom:20px}.tools-list{display:flex;flex-direction:column;gap:12px}.tool-card{display:flex;align-items:center;gap:16px;text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s;cursor:pointer;padding:16px}.tool-card:hover{transform:translate(4px);box-shadow:var(--shadow)}.tool-card-icon{font-size:36px;flex-shrink:0}.tool-card-content{flex:1}.tool-card-content h3{margin-bottom:4px}.tool-card-content p{font-size:14px;color:var(--color-text-secondary);margin:0}.tool-card-arrow{font-size:24px;color:var(--color-text-secondary);flex-shrink:0}.number-field{margin-bottom:16px}.number-field-label{display:block;font-size:14px;font-weight:500;color:var(--color-text);margin-bottom:6px}.number-field-wrapper{position:relative;display:flex;align-items:center}.number-field-prefix,.number-field-suffix{position:absolute;color:var(--color-text-secondary);font-size:16px;pointer-events:none}.number-field-prefix{left:12px}.number-field-suffix{right:12px}.number-field-wrapper input{flex:1}.number-field-wrapper input:has(+.number-field-suffix){padding-right:40px}.number-field-wrapper:has(.number-field-prefix) input{padding-left:28px}.result-card{margin-bottom:16px}.result-card h3{color:var(--color-primary);margin-bottom:12px}.result-card-content{display:flex;flex-direction:column;gap:8px}.result-item{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--color-border)}.result-item:last-child{border-bottom:none}.result-item-label{font-size:14px;color:var(--color-text-secondary)}.result-item-value{font-size:16px;font-weight:600;color:var(--color-text)}.result-item-highlight{background-color:var(--color-bg-secondary);padding:12px;border-radius:var(--radius);margin-top:8px}.result-item-highlight .result-item-value{font-size:20px;color:var(--color-primary)}.copy-summary-button{width:100%;padding:12px;background:#fff;color:var(--color-primary);border:2px solid var(--color-primary);font-weight:600;margin-top:8px}.copy-summary-button:hover{background:var(--color-bg-secondary)}.copy-summary-button:active{background:var(--color-primary);color:#fff}.calculator-page{padding-bottom:20px}.calculator-inputs{margin-bottom:16px}.calculator-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.calculator-header h3{margin-bottom:0}.reset-link{background:none;border:none;color:var(--color-primary);font-size:14px;font-weight:500;padding:4px 8px;cursor:pointer}.reset-link:hover{text-decoration:underline}.reset-link:active{transform:none}.account-page{padding-bottom:20px}.account-card{margin-bottom:16px}.account-card h3{margin-bottom:12px}.account-card p{color:var(--color-text-secondary);margin-bottom:20px;line-height:1.6}.login-button{width:100%;padding:14px;background:var(--color-primary);color:#fff;font-weight:600;font-size:16px}.login-button:hover{background:var(--color-primary-dark)}.account-info{background:var(--color-bg-secondary);margin-bottom:16px}.account-info h3{margin-bottom:12px}.account-info ul{list-style:none;padding:0}.account-info li{padding:8px 0 8px 24px;position:relative;font-size:14px}.account-info li:before{content:"✓";position:absolute;left:0;color:var(--color-primary);font-weight:700}.account-note{padding:16px;background:#fffbeb;border:1px solid #fcd34d;border-radius:var(--radius)}.account-note p{margin:0;font-size:14px;line-height:1.6}.settings-page{padding-bottom:20px}.settings-card{margin-bottom:16px}.settings-actions{display:flex;flex-direction:column;gap:12px;margin-top:24px}.save-button{width:100%;padding:14px;background:var(--color-primary);color:#fff;font-weight:600;font-size:16px}.save-button:hover{background:var(--color-primary-dark)}.reset-button{width:100%;padding:12px;background:#fff;color:var(--color-text-secondary);border:1px solid var(--color-border);font-weight:500}.reset-button:hover,.settings-info{background:var(--color-bg-secondary)}.settings-info h3{margin-bottom:8px}.settings-info p{margin-bottom:8px;font-size:14px}.settings-info p:last-child{margin-bottom:0}:root{--color-primary: #22c55e;--color-primary-dark: #16a34a;--color-bg: #ffffff;--color-bg-secondary: #f9fafb;--color-border: #e5e7eb;--color-text: #111827;--color-text-secondary: #6b7280;--color-error: #ef4444;--radius: 8px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);--spacing-unit: 16px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--color-bg-secondary);color:var(--color-text);line-height:1.5;min-height:100vh;padding-bottom:env(safe-area-inset-bottom)}#root{min-height:100vh;display:flex;flex-direction:column}h1{font-size:24px;font-weight:700;line-height:1.2;margin-bottom:8px}h2{font-size:20px;font-weight:600;line-height:1.3;margin-bottom:12px}h3{font-size:16px;font-weight:600;line-height:1.4;margin-bottom:8px}button{font-family:inherit;font-size:16px;font-weight:500;border:none;border-radius:var(--radius);cursor:pointer;transition:all .2s;-webkit-tap-highlight-color:transparent}button:active{transform:scale(.98)}button:disabled{opacity:.5;cursor:not-allowed}button:disabled:active{transform:none}input[type=number],input[type=text]{font-family:inherit;font-size:16px;padding:12px;border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-bg);color:var(--color-text);width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none}input[type=number]:focus,input[type=text]:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #22c55e1a}input[type=number].error{border-color:var(--color-error)}.container{max-width:640px;margin:0 auto;padding:0 var(--spacing-unit)}.card{background:var(--color-bg);border-radius:var(--radius);padding:var(--spacing-unit);box-shadow:var(--shadow-sm);border:1px solid var(--color-border)}.text-secondary{color:var(--color-text-secondary)}.text-error{color:var(--color-error);font-size:14px;margin-top:4px}@media (max-width: 640px){:root{--spacing-unit: 12px}}