.page-container{max-width:760px;margin:0 auto;padding:var(--spacing-xl) var(--spacing-md)}@media (min-width: 1024px){.page-container{padding:var(--spacing-2xl) var(--spacing-xl)}}.page-header{text-align:center;margin-bottom:var(--spacing-2xl)}.page-title{font-size:var(--font-size-2xl);font-weight:700;color:var(--color-text);margin-bottom:var(--spacing-sm)}@media (min-width: 768px){.page-title{font-size:var(--font-size-3xl)}}.page-subtitle{font-size:var(--font-size-lg);color:var(--color-text-secondary);margin-bottom:var(--spacing-lg)}.page-divider{height:1px;background-color:var(--color-border);max-width:200px;margin:0 auto}.input-section{display:flex;flex-direction:column;gap:var(--spacing-xl)}.input-group{display:flex;flex-direction:column;gap:var(--spacing-sm)}.city-comparison-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-lg);margin-bottom:var(--spacing-lg)}.city-column{background-color:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);padding:var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-md)}.city-column-header{padding-bottom:var(--spacing-sm);border-bottom:2px solid var(--color-border);margin-bottom:var(--spacing-xs)}.city-column-label{font-size:var(--font-size-sm);font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary)}.current-column .city-column-header{border-bottom-color:var(--color-primary)}.target-column .city-column-header{border-bottom-color:var(--color-accent)}.current-column{border-top:3px solid var(--color-primary)}.target-column{border-top:3px solid var(--color-accent)}@media (max-width: 767px){.city-comparison-grid{grid-template-columns:1fr;gap:var(--spacing-md)}}.city-column .input-group{margin-bottom:0}.input-label{font-size:var(--font-size-base);font-weight:600;color:var(--color-text)}.input-error{font-size:var(--font-size-sm);color:var(--color-error);display:none}.input-error.visible{display:block}.scottish-notice{display:none;padding:var(--spacing-sm) var(--spacing-md);background-color:#dbeafe;border:1px solid #93c5fd;border-radius:var(--border-radius);font-size:var(--font-size-sm);color:#1e40af;animation:fadeIn .2s ease}.scottish-notice.visible{display:block}.salary-input-wrapper{position:relative;display:flex;align-items:center}.salary-prefix{position:absolute;left:var(--spacing-md);font-size:var(--font-size-base);color:var(--color-text-secondary);font-weight:500;pointer-events:none}.salary-input{width:100%;padding:var(--spacing-md);padding-left:calc(var(--spacing-md) + 16px);font-size:var(--font-size-base);font-family:inherit;border:1px solid var(--color-border);border-radius:var(--border-radius);background-color:var(--color-bg);color:var(--color-text);transition:border-color var(--transition),box-shadow var(--transition);min-height:52px}.salary-input:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #2563eb1a}.salary-input.error{border-color:var(--color-error)}.city-dropdown{position:relative}.city-input{width:100%;padding:var(--spacing-md);padding-right:calc(var(--spacing-md) + 24px);font-size:var(--font-size-base);font-family:inherit;border:1px solid var(--color-border);border-radius:var(--border-radius);background-color:var(--color-bg);color:var(--color-text);cursor:pointer;transition:border-color var(--transition),box-shadow var(--transition);min-height:52px}.city-input:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #2563eb1a}.city-input.error{border-color:var(--color-error)}.city-dropdown-arrow{position:absolute;right:var(--spacing-md);top:50%;transform:translateY(-50%);width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid var(--color-text-secondary);pointer-events:none;transition:transform var(--transition)}.city-dropdown.open .city-dropdown-arrow{transform:translateY(-50%) rotate(180deg)}.city-dropdown-menu{position:absolute;top:calc(100% + var(--spacing-xs));left:0;right:0;background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--border-radius);box-shadow:0 4px 12px #0000001a;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity var(--transition),transform var(--transition),visibility var(--transition);z-index:50;max-height:280px;overflow:hidden}.city-dropdown.open .city-dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}.city-search-wrapper{padding:var(--spacing-sm);border-bottom:1px solid var(--color-border)}.city-search{width:100%;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-base);font-family:inherit;border:1px solid var(--color-border);border-radius:var(--border-radius);background-color:var(--color-card-bg)}.city-search:focus{outline:none;border-color:var(--color-accent)}.city-list{max-height:220px;overflow-y:auto}.city-option{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-base);cursor:pointer;transition:background-color var(--transition),color var(--transition);min-height:44px;display:flex;align-items:center}.city-option:hover{background-color:var(--color-card-bg);color:var(--color-accent)}.city-option.selected{background-color:var(--color-card-bg);color:var(--color-accent);font-weight:500}.city-option.hidden{display:none}.food-options{display:flex;flex-direction:column;gap:var(--spacing-sm)}@media (min-width: 768px){.food-options{flex-direction:row;gap:var(--spacing-md)}}.food-card{flex:1;cursor:pointer}.food-radio{position:absolute;opacity:0;pointer-events:none}.food-card-content{display:flex;flex-direction:column;padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);background-color:var(--color-bg);transition:border-color var(--transition),background-color var(--transition),box-shadow var(--transition)}.food-card:hover .food-card-content{border-color:var(--color-text-secondary)}.food-radio:checked+.food-card-content{border-color:var(--color-accent);background-color:#2563eb0d}.food-card-title{font-size:var(--font-size-base);font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-xs)}.food-card-desc{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-sm)}.food-card-price{font-size:var(--font-size-base);font-weight:600;color:var(--color-accent)}.calculate-btn{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);width:100%;height:52px;padding:0 var(--spacing-xl);font-size:var(--font-size-base);font-family:inherit;font-weight:600;color:#fff;background-color:var(--color-accent);border:none;border-radius:var(--border-radius);cursor:pointer;transition:background-color var(--transition),transform var(--transition)}.calculate-btn:hover{background-color:#1d4ed8}.calculate-btn:active{transform:scale(.98)}.calculate-btn:disabled{background-color:var(--color-text-secondary);cursor:not-allowed}.btn-arrow{transition:transform var(--transition)}.calculate-btn:hover .btn-arrow{transform:translate(4px)}.results-section{display:none;opacity:0;margin-top:var(--spacing-2xl)}.results-section.visible{display:block;animation:fadeIn .3s ease forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.result-card{margin-bottom:var(--spacing-lg);padding:var(--spacing-lg);border-radius:var(--border-radius-lg);opacity:0;animation:slideIn .3s ease forwards}.result-card-1{animation-delay:0s;margin-bottom:var(--spacing-lg)}.result-card-2{animation-delay:.1s}.result-card-3{animation-delay:.2s}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.ad-placeholder{display:flex;align-items:center;justify-content:center;height:90px;background-color:var(--color-card-bg);border:1px dashed var(--color-border);border-radius:var(--border-radius);margin-bottom:var(--spacing-lg)}.ad-placeholder p{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0}.action-buttons{display:flex;flex-direction:column;gap:var(--spacing-sm)}@media (min-width: 768px){.action-buttons{flex-direction:row;gap:var(--spacing-md)}}.action-btn{flex:1;display:flex;align-items:center;justify-content:center;height:48px;padding:0 var(--spacing-lg);font-size:var(--font-size-base);font-family:inherit;font-weight:500;border-radius:var(--border-radius);cursor:pointer;transition:background-color var(--transition),color var(--transition),border-color var(--transition);min-height:48px}.action-btn-outline{background-color:transparent;color:var(--color-text);border:1px solid var(--color-border)}.action-btn-outline:hover{background-color:var(--color-card-bg);border-color:var(--color-text-secondary)}.action-btn-primary{background-color:var(--color-accent);color:#fff;border:1px solid var(--color-accent)}.action-btn-primary:hover{background-color:#1d4ed8;border-color:#1d4ed8}.modal-overlay{position:fixed;inset:0;background-color:#00000080!important;display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease;padding:var(--spacing-md)}.modal-overlay.open{opacity:1;visibility:visible}.modal{background-color:#fff!important;border-radius:var(--border-radius-lg);padding:var(--spacing-lg);max-width:480px;width:100%;max-height:90vh;overflow-y:auto}.modal-container{background-color:var(--color-bg);border-radius:var(--border-radius-lg);padding:var(--spacing-lg);max-width:480px;width:100%;max-height:90vh;overflow-y:auto;transform:scale(.95);transition:transform .2s ease}.modal-overlay.open .modal-container{transform:scale(1)}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-md);border-bottom:1px solid var(--color-border)}.modal-header h3{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text);margin:0}.modal-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:none;border:none;font-size:24px;color:var(--color-text-secondary);cursor:pointer;border-radius:var(--border-radius);transition:background-color var(--transition),color var(--transition)}.modal-close:hover{background-color:var(--color-card-bg);color:var(--color-text)}.modal-content{font-size:var(--font-size-base)}.disclaimer{margin-top:var(--spacing-2xl);padding-top:var(--spacing-lg);border-top:1px solid var(--color-border);text-align:center}.disclaimer p{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:1.6;margin-bottom:var(--spacing-sm)}.disclaimer-final{font-weight:600;margin-top:var(--spacing-sm)}.tax-summary-header{background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--spacing-md);margin-bottom:var(--spacing-lg)}.tax-summary-row.salary{font-size:var(--font-size-lg);font-weight:700;color:var(--color-primary);margin-bottom:var(--spacing-xs)}.tax-summary-row.region{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.tax-band{margin-bottom:var(--spacing-sm)}.tax-band-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.tax-band-label{display:inline-flex;align-items:center;gap:var(--spacing-xs)}.tax-band-rate{display:inline-block;background-color:var(--color-primary);color:#fff;font-size:11px;font-weight:700;padding:2px 7px;border-radius:20px}.tax-band-rate.zero{background-color:#16a34a}.tax-band-rate.basic{background-color:#2563eb}.tax-band-rate.higher{background-color:#d97706}.tax-band-rate.additional{background-color:#dc2626}.tax-band-rate.scottish-starter{background-color:#16a34a}.tax-band-rate.scottish-intermediate{background-color:#0891b2}.tax-band-rate.scottish-higher{background-color:#d97706}.tax-band-rate.scottish-advanced{background-color:#ea580c}.tax-band-rate.scottish-top{background-color:#dc2626}.tax-band-name{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text)}.tax-band-row{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-xs) var(--spacing-sm);background-color:var(--color-card-bg);border-radius:var(--border-radius);font-size:var(--font-size-sm);color:var(--color-text-secondary)}.tax-band-row .amount{color:var(--color-text);font-weight:600}.tax-divider{height:1px;background-color:var(--color-border);margin:var(--spacing-md) 0}.tax-total-block{background-color:var(--color-primary);color:#fff;border-radius:var(--border-radius);padding:var(--spacing-md);margin-top:var(--spacing-md)}.tax-total-row{display:flex;justify-content:space-between;align-items:center}.tax-total-row.main{font-size:var(--font-size-lg);font-weight:700;margin-bottom:var(--spacing-xs)}.tax-total-row.secondary{font-size:var(--font-size-sm);opacity:.8}.tax-note{margin-top:var(--spacing-md);font-size:12px;color:var(--color-text-secondary);text-align:center}.comparison-table{width:100%}.comparison-header{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--spacing-sm);padding-bottom:var(--spacing-sm);border-bottom:2px solid var(--color-border);margin-bottom:var(--spacing-sm)}.comparison-label{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-secondary)}.comparison-city{font-size:var(--font-size-sm);font-weight:600;text-align:right}.comparison-city.current{color:var(--color-primary)}.comparison-city.target{color:var(--color-text)}.comparison-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--spacing-sm);padding:var(--spacing-xs) 0;border-bottom:1px solid var(--color-border);font-size:var(--font-size-sm);color:var(--color-text-secondary);align-items:center}.comparison-row:last-child{border-bottom:none}.comparison-row.total{font-weight:700;color:var(--color-text);border-top:2px solid var(--color-border);margin-top:var(--spacing-xs);padding-top:var(--spacing-sm)}.comparison-row.disposable{font-weight:700;font-size:var(--font-size-base)}.comparison-row.disposable.good{color:#16a34a}.comparison-row.disposable.ok{color:#d97706}.comparison-row.disposable.bad{color:#dc2626}.comparison-row-final{background-color:var(--color-card-bg);font-weight:700;padding-top:var(--spacing-sm);padding-bottom:var(--spacing-sm);border-bottom:none}.comparison-row-final .row-label{font-weight:700;color:var(--color-text)}.comparison-city{text-align:center}.cost-cell{text-align:center;vertical-align:middle;font-size:var(--font-size-base)}.cost-value{font-weight:inherit;font-size:var(--font-size-base)}.cell-currency{font-size:var(--font-size-base);color:var(--color-text-secondary);margin-right:2px}.cost-input{width:90px;text-align:center;background-color:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--border-radius);font-size:var(--font-size-base);font-weight:500;color:var(--color-text);padding:4px 8px;font-family:inherit;transition:border-color var(--transition);-moz-appearance:textfield}.cost-input::-webkit-outer-spin-button,.cost-input::-webkit-inner-spin-button{-webkit-appearance:none}.cost-input:hover{border-color:var(--color-accent)}.cost-input:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 2px #2563eb26}.disposable-value{font-weight:700;font-size:var(--font-size-base)}.tax-breakdown-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-lg);margin-bottom:var(--spacing-lg);background-color:var(--color-card-bg);border-radius:var(--border-radius-lg);padding:var(--spacing-lg);border:none}.current-card{background:transparent;border:none;padding-top:var(--spacing-md);padding-right:0}.target-card{background:transparent;border:none;padding-top:var(--spacing-md)}.tax-info-btn{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;border:1.5px solid var(--color-text-secondary);background:transparent;color:var(--color-text-secondary);font-size:11px;font-weight:700;font-style:italic;font-family:Georgia,serif;cursor:pointer;padding:0;line-height:1;transition:all var(--transition);vertical-align:middle;margin-left:4px}.tax-info-btn:hover{border-color:var(--color-accent);color:var(--color-accent)}@media (max-width: 767px){.tax-breakdown-grid{grid-template-columns:1fr}.current-card{border-right:none;border-bottom:1px solid var(--color-border);padding-right:0;padding-bottom:var(--spacing-lg)}.target-card{padding-top:var(--spacing-lg)}}.headline-text{font-size:var(--font-size-xl);font-weight:700;color:var(--color-text);margin-bottom:var(--spacing-md)}@media (min-width: 768px){.headline-text{font-size:var(--font-size-2xl)}}.headline-stats{display:flex;flex-direction:column;gap:var(--spacing-sm)}@media (min-width: 640px){.headline-stats{flex-direction:row;gap:var(--spacing-xl)}}.headline-stat{display:flex;flex-direction:column;gap:2px}.headline-stat-value{font-size:var(--font-size-lg);font-weight:700;color:var(--color-text)}.headline-stat-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:400}.headline-stat.warning,.headline-stat.warning .headline-stat-value{color:#d97706}.result-card-1.positive{border-left:4px solid #16a34a}.result-card-1.negative-small{border-left:4px solid #d97706}.result-card-1.negative{border-left:4px solid #dc2626}.tax-detail-row{display:flex;justify-content:space-between;padding:var(--spacing-xs) 0;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.tax-detail-row span:last-child{font-weight:600;color:var(--color-text)}.tax-detail-row.takehome{border-top:1px solid var(--color-border);margin-top:var(--spacing-xs);padding-top:var(--spacing-sm);font-weight:600;color:var(--color-text)}.tax-detail-row.takehome span:last-child{color:var(--color-primary)}.tax-info-btn{cursor:pointer;color:var(--color-accent);font-size:var(--font-size-sm)}.cost-value-input{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text);width:70px;padding:2px 4px;border:1px solid var(--color-accent);border-radius:4px;text-align:right;font-family:inherit}.cost-value-input:focus{outline:none;box-shadow:0 0 0 2px #2563eb33}