*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth}body{font-family:Helvetica Neue,Arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Meiryo,sans-serif;line-height:1.6;color:#333;background-color:#f5f7fa;overflow-x:hidden}.app-container{min-height:100vh;display:flex;flex-direction:column}.main-content{flex:1;padding:20px;max-width:1200px;margin:0 auto;width:100%}.app-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:1rem 2rem;box-shadow:0 2px 10px #0000001a}.app-title{font-size:1.5rem;font-weight:600;display:flex;align-items:center;gap:.5rem}.app-title:before{content:"🧭";font-size:1.8rem}.card{background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000001a;padding:2rem;margin-bottom:1.5rem;border:1px solid #e1e8ed}.card-header{margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid #f0f2f5}.card-title{font-size:1.25rem;font-weight:600;color:#2d3748;margin-bottom:.5rem}.card-subtitle{color:#718096;font-size:.9rem}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;border:none;border-radius:8px;font-size:1rem;font-weight:500;text-decoration:none;cursor:pointer;transition:all .2s ease;min-height:44px;gap:.5rem}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 15px #667eea66}.btn-secondary{background:#f7fafc;color:#4a5568;border:2px solid #e2e8f0}.btn-secondary:hover:not(:disabled){background:#edf2f7;border-color:#cbd5e0}.btn-success{background:linear-gradient(135deg,#48bb78,#38a169);color:#fff}.btn-warning{background:linear-gradient(135deg,#ed8936,#dd6b20);color:#fff}.btn-full{width:100%}.form-group{margin-bottom:1.5rem}.form-label{display:block;margin-bottom:.5rem;font-weight:500;color:#2d3748;font-size:.95rem}.form-label.required:after{content:" *";color:#e53e3e}.form-input{width:100%;padding:.75rem 1rem;border:2px solid #e2e8f0;border-radius:8px;font-size:1rem;transition:all .2s ease;background:#fff}.form-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-input:invalid{border-color:#e53e3e}.form-select{width:100%;padding:.75rem 1rem;border:2px solid #e2e8f0;border-radius:8px;font-size:1rem;background:#fff;cursor:pointer}.form-checkbox{display:flex;align-items:center;gap:.5rem;cursor:pointer}.form-checkbox input[type=checkbox]{width:18px;height:18px;accent-color:#667eea}.grid{display:grid;gap:1.5rem}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.text-center{text-align:center}.text-right{text-align:right}.text-muted{color:#718096}.text-success{color:#38a169}.text-warning{color:#dd6b20}.text-error{color:#e53e3e}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.mt-0{margin-top:0}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.hidden{display:none}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.fade-in{animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.loading{position:relative;overflow:hidden}.loading:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);animation:loading 1.5s infinite}@keyframes loading{0%{left:-100%}to{left:100%}}@media screen and (max-width: 767px){html{font-size:14px}.main-content,.app-header{padding:1rem}.app-title{font-size:1.3rem}.card{padding:1.5rem;margin-bottom:1rem;border-radius:8px}.card-title{font-size:1.1rem}.form-input,.form-select{padding:1rem;font-size:16px;border-radius:6px}.btn{padding:1rem 1.5rem;font-size:1rem;min-height:48px;border-radius:6px}.grid-2,.grid-3{grid-template-columns:1fr;gap:1rem}.mobile-hidden{display:none}.mobile-full{width:100%}.mobile-text-center{text-align:center}.calculator-layout{display:flex;flex-direction:column;gap:1rem}.result-panel{order:2}.input-panel{order:1}}@media screen and (min-width: 768px) and (max-width: 1023px){html{font-size:15px}.main-content{padding:1.5rem}.card{padding:1.75rem}.calculator-layout{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}.grid-3{grid-template-columns:repeat(2,1fr)}.tablet-hidden{display:none}}@media screen and (min-width: 1024px){html{font-size:16px}.main-content{padding:2rem}.calculator-layout{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}.card{padding:2rem}.btn:hover{transform:translateY(-1px)}.form-input:hover{border-color:#cbd5e0}.desktop-hidden{display:none}.main-content{max-width:1200px}}@media screen and (min-width: 1440px){.main-content{max-width:1400px;padding:2.5rem}.calculator-layout{gap:3rem}.card{padding:2.5rem}}@media print{.app-header,.btn,.mobile-hidden,.no-print{display:none!important}.card{box-shadow:none;border:1px solid #000;page-break-inside:avoid}body{background:#fff;color:#000}.main-content{padding:0;max-width:none}}@media (prefers-color-scheme: dark){body{background-color:#1a202c;color:#e2e8f0}.card{background:#2d3748;border-color:#4a5568}.form-input,.form-select{background:#2d3748;border-color:#4a5568;color:#e2e8f0}.form-input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea33}.text-muted{color:#a0aec0}}@media (prefers-contrast: high){.btn,.form-input,.form-select,.card{border:2px solid currentColor}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (any-hover: none){.btn:focus-visible,.form-input:focus-visible,.form-select:focus-visible{outline:3px solid #667eea;outline-offset:2px}}.input-form-container{background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000001a;padding:2rem;position:sticky;top:2rem}.input-form-header{text-align:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #f0f2f5}.input-form-title{font-size:1.5rem;font-weight:600;color:#2d3748;margin-bottom:.5rem}.input-form-subtitle{color:#718096;font-size:.9rem}.mode-switch{display:flex;background:#f7fafc;border-radius:8px;padding:4px;margin-bottom:2rem}.mode-switch-button{flex:1;padding:.75rem 1rem;border:none;background:transparent;border-radius:6px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease;color:#4a5568}.mode-switch-button.active{background:#fff;color:#667eea;box-shadow:0 2px 8px #0000001a}.input-group{margin-bottom:1.5rem}.input-group-inline{display:flex;gap:1rem;align-items:end}.input-with-unit{position:relative}.input-with-unit .form-input{padding-right:3rem}.input-unit{position:absolute;right:1rem;top:50%;transform:translateY(-50%);color:#718096;font-size:.9rem;font-weight:500;pointer-events:none}.range-input-group{margin-bottom:1.5rem}.range-input{width:100%;height:6px;border-radius:3px;background:#e2e8f0;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.range-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#667eea;cursor:pointer;box-shadow:0 2px 6px #0003}.range-input::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#667eea;cursor:pointer;border:none;box-shadow:0 2px 6px #0003}.range-value{display:flex;justify-content:space-between;margin-top:.5rem;font-size:.85rem;color:#718096}.checkbox-group{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem}.checkbox-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:#f7fafc;border-radius:8px;cursor:pointer;transition:all .2s ease}.checkbox-item:hover{background:#edf2f7}.checkbox-item input[type=checkbox]{width:18px;height:18px;accent-color:#667eea}.checkbox-label{font-size:.95rem;color:#2d3748;cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-description{font-size:.8rem;color:#718096;margin-top:.25rem}.button-group{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.75rem;margin-bottom:1.5rem}.button-group-item{padding:1rem;border:2px solid #e2e8f0;border-radius:8px;background:#fff;cursor:pointer;text-align:center;transition:all .2s ease;font-size:.9rem;font-weight:500}.button-group-item:hover{border-color:#cbd5e0;background:#f7fafc}.button-group-item.selected{border-color:#667eea;background:#f0f4ff;color:#667eea}.button-group-item.selected:before{content:"✓ ";font-weight:700}.calculate-button{width:100%;padding:1.25rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.calculate-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.calculate-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.calculate-button.loading{pointer-events:none}.calculate-button.loading:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:loading 1.5s infinite}.form-error{background:#fed7d7;color:#9b2c2c;padding:.75rem 1rem;border-radius:6px;margin-bottom:1rem;font-size:.9rem;border-left:4px solid #e53e3e}.field-error{color:#e53e3e;font-size:.8rem;margin-top:.25rem}.form-success{background:#c6f6d5;color:#22543d;padding:.75rem 1rem;border-radius:6px;margin-bottom:1rem;font-size:.9rem;border-left:4px solid #38a169}.form-help{background:#e6fffa;color:#234e52;padding:.75rem 1rem;border-radius:6px;margin-top:.5rem;font-size:.85rem;border-left:4px solid #4fd1c7}@media screen and (max-width: 767px){.input-form-container{padding:1.5rem;position:static;border-radius:8px}.input-group-inline{flex-direction:column;gap:1rem;align-items:stretch}.button-group{grid-template-columns:1fr}.calculate-button{padding:1.5rem 2rem;font-size:1.2rem}.mode-switch{margin-bottom:1.5rem}.mode-switch-button{padding:1rem;font-size:1rem}}.result-panel-container{background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000001a;padding:2rem;height:fit-content}.result-panel-header{text-align:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #f0f2f5}.result-panel-title{font-size:1.5rem;font-weight:600;color:#2d3748;margin-bottom:.5rem}.result-panel-subtitle{color:#718096;font-size:.9rem}.empty-state{text-align:center;padding:3rem 2rem;color:#a0aec0}.empty-state-icon{font-size:4rem;margin-bottom:1rem;opacity:.6}.loading-animation{text-align:center;padding:3rem 2rem}.loading-spinner{width:40px;height:40px;border:4px solid #e2e8f0;border-top:4px solid #667eea;border-radius:50%;margin:0 auto 1rem;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.result-summary{background:linear-gradient(135deg,#f7fafc,#edf2f7);border-radius:12px;padding:1.5rem;margin-bottom:2rem;border:1px solid #e2e8f0}.summary-item{text-align:center}.summary-item.main-result{margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid #e2e8f0}.summary-label{font-size:.9rem;color:#718096;margin-bottom:.5rem;font-weight:500}.summary-value{font-size:1.8rem;font-weight:700;color:#2d3748;margin-bottom:.5rem}.summary-value.main{font-size:2.5rem;color:#667eea;text-shadow:0 2px 4px rgba(102,126,234,.2)}.summary-detail{font-size:.8rem;color:#a0aec0}.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.summary-grid .summary-value{font-size:1.4rem}.deduction-details{margin-bottom:2rem}.section-title{font-size:1.2rem;font-weight:600;color:#2d3748;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px solid #e2e8f0}.deduction-list{background:#f7fafc;border-radius:8px;padding:1rem;margin-bottom:1rem}.deduction-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem 0;border-bottom:1px solid #e2e8f0}.deduction-item:last-child{border-bottom:none}.deduction-info{display:flex;flex-direction:column;gap:.25rem}.deduction-name{font-weight:500;color:#2d3748;font-size:.95rem}.deduction-name.total{font-weight:600;color:#667eea}.deduction-rate{font-size:.8rem;color:#718096}.deduction-amounts{text-align:right;display:flex;flex-direction:column;gap:.25rem}.deduction-amount{font-weight:500}.deduction-amount.monthly{font-size:1rem;color:#e53e3e}.deduction-amount.monthly.total{font-size:1.1rem;color:#c53030;font-weight:600}.deduction-amount.yearly{font-size:.8rem;color:#a0aec0}.deduction-total{background:#fff;border-radius:8px;padding:1rem;border:2px solid #667eea;display:flex;justify-content:space-between;align-items:center}.period-comparison{margin-bottom:2rem}.comparison-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.comparison-item{background:#f7fafc;border-radius:8px;padding:1.5rem 1rem;text-align:center;border:2px solid #e2e8f0;transition:all .2s ease}.comparison-item.highlight{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-color:#667eea;transform:scale(1.05);box-shadow:0 4px 15px #667eea4d}.comparison-item:hover:not(.highlight){border-color:#cbd5e0;transform:translateY(-2px);box-shadow:0 4px 10px #0000001a}.period-label{font-size:.85rem;font-weight:500;margin-bottom:.5rem;opacity:.8}.period-gross{font-size:1rem;font-weight:500;margin-bottom:.5rem;opacity:.7}.period-arrow{font-size:1.2rem;margin:.5rem 0;opacity:.6}.period-net{font-size:1.3rem;font-weight:700;margin-bottom:.5rem}.comparison-item.highlight .period-net{font-size:1.5rem}.period-rate{font-size:.8rem;opacity:.8;font-weight:500}.result-actions{display:flex;gap:1rem;margin-bottom:2rem}.result-actions .btn{flex:1;padding:1rem;font-size:.9rem;font-weight:500}.disclaimer{background:#fff5f5;border:1px solid #fed7d7;border-radius:8px;padding:1.5rem;margin-top:2rem}.disclaimer-title{font-size:1rem;font-weight:600;color:#c53030;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.disclaimer-list{margin:0;padding-left:1.5rem;color:#744210}.disclaimer-list li{margin-bottom:.5rem;font-size:.85rem;line-height:1.4}.disclaimer-list li:last-child{margin-bottom:0}@media screen and (max-width: 767px){.result-panel-container{padding:1.5rem;border-radius:8px}.result-summary{padding:1rem}.summary-value.main{font-size:2rem}.summary-grid{grid-template-columns:1fr;gap:.5rem}.comparison-grid{grid-template-columns:1fr;gap:.75rem}.comparison-item.highlight{transform:none;order:-1}.deduction-item{flex-direction:column;align-items:flex-start;gap:.5rem}.deduction-amounts{align-self:stretch;text-align:left}.deduction-total{flex-direction:column;align-items:flex-start;gap:.5rem}.result-actions{flex-direction:column}.disclaimer{padding:1rem}.disclaimer-list{padding-left:1rem}}@media screen and (min-width: 768px) and (max-width: 1023px){.comparison-grid{grid-template-columns:1fr 1fr}.comparison-item.highlight{grid-column:1 / -1;transform:none}.result-actions .btn{padding:.875rem}}@media print{.result-panel-container{box-shadow:none;border:1px solid #000;padding:1rem}.result-actions,.disclaimer{display:none}.comparison-item.highlight{background:#f0f0f0!important;color:#000!important;border:2px solid #000!important}.section-title{page-break-after:avoid}.deduction-item{page-break-inside:avoid}}.calculation-history{position:relative;margin-bottom:1rem}.history-toggle-button{background:linear-gradient(135deg,#48bb78,#38a169);color:#fff;border:none;border-radius:8px;padding:.75rem 1rem;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #48bb784d}.history-toggle-button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #48bb7866}.history-panel{position:absolute;top:100%;left:0;right:0;z-index:1000;background:#fff;border-radius:12px;box-shadow:0 8px 30px #00000026;border:1px solid #e2e8f0;max-height:400px;overflow:hidden;animation:slideDown .3s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.history-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;border-bottom:2px solid #f0f2f5;background:#f7fafc}.history-title{font-size:1.1rem;font-weight:600;color:#2d3748;margin:0}.history-actions{display:flex;gap:.5rem}.history-actions .btn{padding:.5rem .75rem;font-size:.8rem}.history-list{max-height:300px;overflow-y:auto;padding:.5rem}.history-item{padding:1rem;border-radius:8px;border:1px solid #e2e8f0;margin-bottom:.5rem;cursor:pointer;transition:all .2s ease;background:#fff}.history-item:hover{border-color:#667eea;background:#f0f4ff;transform:translateY(-1px);box-shadow:0 2px 8px #667eea1a}.history-item:last-child{margin-bottom:0}.history-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.history-basic-info{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.history-wage{font-weight:600;color:#2d3748;font-size:.95rem}.history-days{color:#667eea;font-weight:500;font-size:.9rem}.history-employment-type{background:#edf2f7;color:#4a5568;padding:.25rem .5rem;border-radius:4px;font-size:.8rem;font-weight:500}.history-delete-button{background:none;border:none;color:#e53e3e;font-size:1rem;cursor:pointer;padding:.25rem;border-radius:4px;transition:all .2s ease;opacity:.7}.history-delete-button:hover{opacity:1;background:#fed7d7}.history-item-body{display:flex;justify-content:space-between;align-items:end}.history-result{flex:1}.history-amount{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.25rem}.history-amount-label{font-size:.8rem;color:#718096}.history-amount-value{font-size:1.1rem;font-weight:600;color:#38a169}.history-rate{font-size:.8rem;color:#4a5568}.history-meta{display:flex;flex-direction:column;align-items:end;gap:.25rem;text-align:right}.history-mode{background:#667eea;color:#fff;padding:.25rem .5rem;border-radius:4px;font-size:.7rem;font-weight:500}.history-date{font-size:.75rem;color:#a0aec0}.history-empty{text-align:center;padding:2rem;color:#a0aec0}.save-status{background:#c6f6d5;color:#22543d;padding:.5rem 1rem;border-radius:6px;margin-top:.5rem;font-size:.85rem;text-align:center;border-left:4px solid #38a169}.sample-data-section{margin-bottom:1.5rem;padding:1rem;background:#f0f4ff;border-radius:8px;border:1px solid #e0e7ff}.sample-data-section .button-group{display:flex;gap:.5rem;flex-wrap:wrap}.sample-data-section .btn-sm{padding:.5rem .75rem;font-size:.8rem;border-radius:6px}.form-actions{display:flex;flex-direction:column;gap:1rem}.form-actions-secondary{display:flex;justify-content:center}.form-actions-secondary .btn{min-width:120px}@media screen and (max-width: 767px){.history-panel{position:fixed;top:0;left:0;right:0;bottom:0;max-height:none;border-radius:0;animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.history-header{padding:1rem;position:sticky;top:0;z-index:1}.history-list{max-height:none;padding:1rem}.history-item-header{flex-direction:column;align-items:flex-start;gap:.5rem}.history-basic-info{flex-direction:column;align-items:flex-start;gap:.25rem}.history-delete-button{align-self:flex-end}.history-item-body{flex-direction:column;align-items:flex-start;gap:.5rem}.history-meta{align-items:flex-start;text-align:left}.sample-data-section .button-group{flex-direction:column}.form-actions-secondary{margin-top:.5rem}}@media screen and (min-width: 768px) and (max-width: 1023px){.history-panel{max-height:350px}.history-list{max-height:250px}.sample-data-section .button-group{justify-content:center}}.debug-panel-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;z-index:9999;display:flex;align-items:center;justify-content:center;padding:2rem}.debug-panel{background:#fff;border-radius:12px;max-width:800px;max-height:90vh;width:100%;overflow:hidden;box-shadow:0 20px 60px #0000004d;display:flex;flex-direction:column}.debug-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.debug-header h3{margin:0;font-size:1.3rem;font-weight:600}.debug-content{flex:1;overflow-y:auto;padding:1.5rem 2rem}.debug-section{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid #e2e8f0}.debug-section:last-child{border-bottom:none;margin-bottom:0}.debug-section h4{margin:0 0 1rem;font-size:1.1rem;font-weight:600;color:#2d3748}.debug-section h5{margin:1rem 0 .5rem;font-size:1rem;font-weight:600;color:#4a5568}.debug-section h6{margin:.75rem 0 .5rem;font-size:.9rem;font-weight:600;color:#718096}.debug-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1rem}.debug-actions .btn{padding:.5rem 1rem;font-size:.85rem}.storage-info{background:#f7fafc;padding:1rem;border-radius:8px;border:1px solid #e2e8f0}.storage-stat{display:flex;justify-content:space-between;margin-bottom:.5rem;font-size:.9rem}.storage-stat:last-child{margin-bottom:1rem}.storage-bar{width:100%;height:8px;background:#e2e8f0;border-radius:4px;overflow:hidden}.storage-bar-fill{height:100%;background:linear-gradient(135deg,#48bb78,#38a169);transition:width .3s ease}.import-label{cursor:pointer;display:inline-flex;align-items:center;gap:.5rem}.test-results{background:#f0f4ff;padding:1rem;border-radius:8px;border:1px solid #e0e7ff;margin-top:1rem}.test-summary{display:flex;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}.test-stat{padding:.5rem .75rem;border-radius:6px;font-size:.85rem;font-weight:500;min-width:80px;text-align:center}.test-stat.success{background:#c6f6d5;color:#22543d}.test-stat.fail{background:#fed7d7;color:#9b2c2c}.test-stat.error{background:#feebc8;color:#c05621}.failed-tests{background:#fff;padding:1rem;border-radius:6px;border:1px solid #fed7d7}.failed-test{margin-bottom:.5rem;padding:.5rem;background:#fff5f5;border-radius:4px;font-size:.85rem}.failed-test:last-child{margin-bottom:0}.performance-results{background:#f0fff4;padding:1rem;border-radius:8px;border:1px solid #c6f6d5;margin-top:1rem}.performance-stats{display:flex;flex-direction:column;gap:.5rem}.perf-stat{display:flex;justify-content:space-between;font-size:.9rem;padding:.25rem 0}.system-info{background:#f7fafc;padding:1rem;border-radius:8px;border:1px solid #e2e8f0}.system-stat{display:flex;justify-content:space-between;margin-bottom:.5rem;font-size:.9rem}.system-stat:last-child{margin-bottom:0}.console-commands{background:#1a202c;color:#e2e8f0;padding:1rem;border-radius:8px;font-family:Courier New,monospace;margin-bottom:.75rem}.console-commands code{display:block;margin-bottom:.5rem;color:#68d391;font-size:.85rem}.console-commands code:last-child{margin-bottom:0}.console-note{font-size:.85rem;color:#718096;margin:0;font-style:italic}.result-actions-extra{margin-top:1rem;padding-top:1rem;border-top:1px solid #e2e8f0}.result-actions-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}@media screen and (max-width: 767px){.debug-panel-overlay{padding:1rem}.debug-panel{max-height:95vh}.debug-header,.debug-content{padding:1rem}.debug-actions{flex-direction:column}.test-summary{flex-direction:column;gap:.5rem}.performance-stats{font-size:.85rem}.console-commands{font-size:.8rem;padding:.75rem}.result-actions-grid{grid-template-columns:1fr;gap:.5rem}}@media (prefers-color-scheme: dark){.debug-panel{background:#2d3748;color:#e2e8f0}.debug-section{border-bottom-color:#4a5568}.storage-info,.system-info{background:#4a5568;border-color:#718096;color:#e2e8f0}.test-results{background:#3c366b;border-color:#5a67d8}.performance-results{background:#22543d;border-color:#38a169}.failed-tests{background:#742a2a;border-color:#e53e3e}.failed-test{background:#9b2c2c;color:#fed7d7}}