:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;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-height:100vh;background:linear-gradient(135deg,#f5f7fa,#e8eef3);color:#2c3e50}#app{min-height:100vh;padding:24px}.container{max-width:800px;margin:0 auto}header{text-align:center;margin-bottom:40px;padding-top:24px}h1{font-size:2.5rem;font-weight:600;color:#1a202c;margin-bottom:8px;line-height:1.2}.subtitle{font-size:1.125rem;color:#64748b;font-weight:400}h2{font-size:1.5rem;font-weight:600;color:#1a202c;margin-bottom:24px;line-height:1.2}.form-card{background:#fff;border-radius:16px;padding:32px;box-shadow:0 4px 6px #0000000d,0 10px 15px #0000000d;margin-bottom:40px}.form-group{margin-bottom:24px}label{display:block;font-weight:500;color:#374151;margin-bottom:8px;font-size:.875rem;text-transform:uppercase;letter-spacing:.5px}input[type=text],textarea{width:100%;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:1rem;font-family:inherit;transition:border-color .2s,box-shadow .2s;background-color:#fff;color:#1a202c}input[type=text]:focus,textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}input[type=text]::placeholder,textarea::placeholder{color:#94a3b8}textarea{resize:vertical;min-height:80px}.severity-input-group{display:flex;align-items:center;gap:16px}input[type=range]{flex:1;height:8px;border-radius:4px;background:linear-gradient(to right,#10b981,#f59e0b,#ef4444);outline:none;-webkit-appearance:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:24px;height:24px;border-radius:50%;background:#fff;cursor:pointer;box-shadow:0 2px 8px #0003;border:3px solid #3b82f6}input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:#fff;cursor:pointer;box-shadow:0 2px 8px #0003;border:3px solid #3b82f6}.severity-display{font-size:1.5rem;font-weight:600;color:#1a202c;min-width:40px;text-align:center}.submit-btn{width:100%;padding:14px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 12px #3b82f64d;font-family:inherit}.submit-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px #3b82f666}.submit-btn:active{transform:translateY(0)}.history-section{margin-bottom:40px}.history-section h2{color:#1a202c;margin-bottom:24px}#history{display:flex;flex-direction:column;gap:16px}.empty-state{text-align:center;color:#64748b;padding:48px 24px;background:#fff;border-radius:12px;font-size:1rem}.entry-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 4px #0000000d,0 4px 8px #0000000d;transition:transform .2s,box-shadow .2s}.entry-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000014,0 8px 16px #00000014}.entry-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #e2e8f0}.entry-date{font-size:.875rem;color:#64748b;font-weight:500}.delete-btn{padding:6px 16px;background:transparent;color:#ef4444;border:1px solid #ef4444;border-radius:6px;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s,color .2s;font-family:inherit}.delete-btn:hover{background:#ef4444;color:#fff}.entry-body{display:flex;flex-direction:column;gap:16px}.entry-symptom{font-size:1.25rem;font-weight:600;color:#1a202c}.entry-severity{display:flex;flex-direction:column;gap:8px}.severity-label{font-size:.875rem;color:#64748b;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.severity-value{font-size:1.125rem;font-weight:600;color:#1a202c}.severity-bar{width:100%;height:8px;background:#e2e8f0;border-radius:4px;overflow:hidden}.severity-fill{height:100%;background:linear-gradient(to right,#10b981,#f59e0b,#ef4444);transition:width .3s ease}.entry-notes{padding:12px 16px;background:#f8fafc;border-left:3px solid #3b82f6;border-radius:4px;color:#475569;font-size:.9375rem;line-height:1.6;white-space:pre-wrap}@media (max-width: 640px){#app{padding:16px}h1{font-size:2rem}.subtitle{font-size:1rem}.form-card{padding:24px}.entry-card{padding:20px}.entry-header{flex-direction:column;align-items:flex-start;gap:12px}.delete-btn{align-self:flex-end}}