body{background:linear-gradient(180deg,#eef2ff 0%,#ffffff 100%)}.att-app-wrapper{--att-bg-light:#f3f7ff;--att-card-bg:#ffffff;--att-border-color:#e2e8f0;--att-text-primary:#0f172a;--att-text-secondary:#475569;--att-accent-indigo:#4f46e5;--att-accent-purple:#8b5cf6;--att-grad-success-start:#10b981;--att-grad-success-end:#059669;--att-grad-warning-start:#f59e0b;--att-grad-warning-end:#d97706;--att-grad-danger-start:#ef4444;--att-grad-danger-end:#dc2626;width:100%;padding:30px 8px;display:flex;align-items:center;justify-content:center;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;box-sizing:border-box}.att-app{width:100%;max-width:620px;color:var(--att-text-primary)}.att-app *{box-sizing:border-box;max-width:100%}.att-header{margin-bottom:28px}.att-title{font-size:2.2rem;background:linear-gradient(135deg,var(--att-accent-indigo) 0%,var(--att-accent-purple) 100%);-webkit-background-clip:text;-webkit-text-fill-color:#fff0;margin:0 0 8px 0;font-weight:800;letter-spacing:-.5px;text-align:center}.att-subtitle{color:var(--att-text-secondary);margin:0;font-size:.95rem;line-height:1.5}.att-card{border:1.5px solid var(--att-accent-indigo);box-shadow:0 0 10px rgb(99 102 241 / .25),0 0 20px rgb(99 102 241 / .15);padding:8px;border-radius:12px}.att-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:24px}.att-row{display:flex;flex-direction:column;gap:6px}.att-row-full{grid-column:span 2;display:flex;flex-direction:column;gap:6px}.att-row label,.att-row-full label{font-size:.75rem;font-weight:700;color:var(--att-text-secondary);text-transform:uppercase;letter-spacing:.75px}.att-input-group{display:flex;align-items:center;background:#f1f5f9;border:1px solid var(--att-border-color);border-radius:12px;overflow:hidden;transition:all 0.25s ease}.att-input-group:focus-within{border-color:var(--att-accent-indigo);background:#fff;box-shadow:0 0 0 3px rgb(99 102 241 / .15)}.att-app-wrapper .att-input{width:100%;padding:12px;border:none!important;background:transparent!important;font-size:1rem;font-weight:600;color:var(--att-text-primary)!important;outline:none!important;text-align:center;box-shadow:none!important;margin:0!important}.att-app-wrapper .att-input::-webkit-outer-spin-button,.att-app-wrapper .att-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.att-step-btn{background:#fff0;border:none;color:var(--att-text-secondary);font-size:1.25rem;font-weight:700;cursor:pointer;padding:0 16px;height:100%;display:flex;align-items:center;justify-content:center;transition:all 0.2s ease;user-select:none}.att-step-btn:hover{color:var(--att-text-primary);background:rgb(0 0 0 / .05)}.att-presets{display:flex;gap:8px;margin-top:6px}.att-preset-btn{flex:1;background:#f8fafc;border:1px solid var(--att-border-color);color:var(--att-text-secondary);padding:6px 10px;border-radius:8px;font-size:.75rem;font-weight:600;cursor:pointer;transition:all 0.2s}.att-preset-btn:hover,.att-preset-btn.active{background:var(--att-accent-indigo);border-color:var(--att-accent-indigo);color:#fff;box-shadow:0 4px 12px rgb(99 102 241 / .15)}.att-onboarding-box{padding:28px 20px;border-radius:14px;background:linear-gradient(180deg,#f0fdf4,#ffffff);text-align:center;color:var(--att-text-secondary);font-size:.9rem;line-height:1.5}.att-output-box{margin-top:10px;flex-direction:column;gap:10px}.att-stats-row{display:flex;flex-direction:column;align-items:center;gap:10px;padding:10px 8px;border-radius:14px;background:#f8fafc;border:1px solid var(--att-border-color)}@media (min-width:480px){.att-stats-row{flex-direction:row;justify-content:space-around;text-align:left}}.att-gauge-container{position:relative;width:130px;height:130px;flex-shrink:0}.att-gauge{width:100%;height:100%}.att-gauge-bg{stroke:#e2e8f0}.att-gauge-bar{transition:stroke-dashoffset 0.5s cubic-bezier(.4,0,.2,1)}.att-gauge-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:100%}.att-percentage{font-size:1.2rem;font-weight:700;color:var(--att-text-primary);line-height:1.1;margin-bottom:2px}.att-pct-label{font-size:.65rem;font-weight:700;color:var(--att-text-secondary);text-transform:uppercase;letter-spacing:1px}.att-verdict-column{display:flex;flex-direction:column;justify-content:center;gap:8px}.att-status-badge{align-self:center;padding:5px 12px;border-radius:30px;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.75px}@media (min-width:480px){.att-status-badge{align-self:flex-start}}.att-verdict{font-size:.9rem;line-height:1.5;font-weight:600;color:var(--att-text-primary);margin:0}.att-metrics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.att-metric-card{background:#fff;border:1px solid var(--att-border-color);border-radius:12px;padding:14px 8px;text-align:center;display:flex;flex-direction:column;justify-content:center;gap:4px;box-shadow:0 4px 6px -1px rgb(0 0 0 / .02)}.att-metric-val{font-size:1.2rem;font-weight:800;color:var(--att-text-primary)}.att-metric-lbl{font-size:.65rem;font-weight:700;color:var(--att-text-secondary);text-transform:uppercase;letter-spacing:.5px}.att-sandbox-container{padding:18px 8px;background:#fff;border-radius:14px;border:1px solid var(--att-border-color);box-shadow:0 4px 6px -1px rgb(0 0 0 / .02)}.att-sandbox-title{font-size:.8rem;font-weight:800;text-transform:uppercase;letter-spacing:.75px;color:var(--att-accent-indigo);margin-bottom:4px}.att-sandbox-subtitle{font-size:.8rem;color:var(--att-text-secondary);margin:0 0 14px 0;line-height:1.4}.att-sandbox-controls{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:14px}@media (min-width:480px){.att-sandbox-controls{grid-template-columns:1fr 1fr}}.att-sandbox-control{display:flex;flex-direction:column;gap:6px}.att-sandbox-control label{font-size:.85rem;font-weight:600;color:var(--att-text-secondary);display:flex;justify-content:space-between}.att-sandbox-control b{color:var(--att-text-primary)}.att-slider{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:10px;background:#e2e8f0;outline:none}.att-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:linear-gradient(135deg,var(--att-accent-indigo),var(--att-accent-purple));cursor:pointer;box-shadow:0 2px 6px rgb(99 102 241 / .3);transition:transform 0.1s ease}.att-slider::-webkit-slider-thumb:hover{transform:scale(1.25)}.att-slider::-moz-range-thumb{width:16px;height:16px;border:none;border-radius:50%;background:linear-gradient(135deg,var(--att-accent-indigo),var(--att-accent-purple));cursor:pointer;box-shadow:0 2px 6px rgb(99 102 241 / .3);transition:transform 0.1s ease}.att-slider::-moz-range-thumb:hover{transform:scale(1.25)}.att-sandbox-result{display:flex;align-items:center;justify-content:space-between;padding-top:12px;border-top:1px solid var(--att-border-color);font-size:.8rem;font-weight:700;color:var(--att-text-secondary)}.att-sandbox-pct{font-size:1.15rem;font-weight:800;color:var(--att-text-primary);margin-right:8px}.att-sandbox-indicator{padding:3px 8px;border-radius:12px;font-size:.7rem;font-weight:800;text-transform:uppercase}