:root{--bg-primary:#f8f9fa;--bg-card:#fff;--bg-input:#f0f2f5;--text-primary:#1a1a2e;--text-secondary:#6c757d;--accent:#4361ee;--accent-hover:#3a56d4;--border:#dee2e6;--shadow:rgba(0,0,0,.08);--result-bg:#eef2ff;--error:#ef4444}[data-theme=dark]{--bg-primary:#1a1a2e;--bg-card:#16213e;--bg-input:#0f3460;--text-primary:#e8e8e8;--text-secondary:#a0a0b0;--accent:#4cc9f0;--accent-hover:#72d6f5;--border:#2a2a4a;--shadow:rgba(0,0,0,.3);--result-bg:#1a2744}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{margin:0;font-family:Pretendard,sans-serif;background-color:var(--bg-primary);color:var(--text-primary);transition:background-color .3s ease,color .3s ease}.app-wrapper{min-height:100vh;padding:20px 0}.container{max-width:420px;margin:0 auto;padding:0 20px}.app-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.app-title{font-size:1.5rem;font-weight:800;margin:0;background:linear-gradient(135deg,var(--accent),#7209b7);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.theme-toggle{background:var(--bg-card);border:1px solid var(--border);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px var(--shadow);font-size:1.2rem;transition:all .2s}.theme-toggle:active{transform:scale(.95)}.card{background:var(--bg-card);border-radius:16px;padding:20px;margin-bottom:20px;box-shadow:0 4px 12px var(--shadow);transition:background-color .3s ease}.card-label{font-size:.9rem;font-weight:700;color:var(--text-secondary);margin-bottom:12px}.segmented-control{display:flex;background:var(--bg-input);border-radius:12px;padding:4px}.segment-btn{flex:1;border:none;background:transparent;padding:8px;font-size:.9rem;font-weight:600;color:var(--text-secondary);cursor:pointer;border-radius:8px;transition:all .2s}.segment-btn.active{background:var(--bg-card);color:var(--accent);box-shadow:0 2px 6px var(--shadow)}.distance-presets{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}.preset-btn{flex:1;min-width:60px;background:var(--bg-input);border:1px solid var(--border);border-radius:8px;padding:6px 4px;font-size:.8rem;font-weight:600;color:var(--text-secondary);cursor:pointer;transition:all .2s}.preset-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}.input-group{margin-bottom:16px}.input-group:last-child{margin-bottom:0}.input-group label{display:block;font-size:.85rem;margin-bottom:6px;color:var(--text-secondary)}.input-wrapper{position:relative}input{width:100%;background:var(--bg-input);border:2px solid transparent;border-radius:10px;padding:12px 14px;font-size:1.1rem;font-family:inherit;color:var(--text-primary);text-align:right;transition:all .2s}input:focus{outline:none;border-color:var(--accent);background:var(--bg-card)}.result-highlight{background:var(--result-bg);margin:0 -20px;padding:16px 20px}.result-value{font-size:1.5rem;font-weight:800;color:var(--accent);text-align:right}.error-msg{color:var(--error);font-size:.75rem;margin-top:4px}.input-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.guide-text{font-size:.8rem;color:var(--text-secondary);line-height:1.5;margin-top:0;margin-bottom:16px}.save-btn{width:100%;background:var(--accent);color:#fff;border:none;border-radius:12px;padding:14px;font-size:1rem;font-weight:700;cursor:pointer;margin-bottom:24px;box-shadow:0 4px 12px rgba(67,97,238,.3);transition:all .2s}.save-btn:active{transform:translateY(2px);box-shadow:0 2px 6px rgba(67,97,238,.3)}.history-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer}.history-header .card-label{margin-bottom:0}.history-list{margin-top:16px;max-height:300px;overflow-y:auto}.history-item{display:flex;justify-content:space-between;align-items:center;padding:12px;border-bottom:1px solid var(--border);cursor:pointer;transition:background .2s}.history-item:hover{background:var(--bg-input)}.history-info{flex:1}.history-date{display:block;font-size:.75rem;color:var(--text-secondary);margin-bottom:4px}.history-values{font-size:.9rem}.delete-btn{background:transparent;border:none;color:var(--text-secondary);font-size:1.2rem;padding:4px 8px;cursor:pointer}.delete-btn:hover{color:var(--error)}.empty-msg{padding:20px;font-size:.9rem}.app-footer,.empty-msg{text-align:center;color:var(--text-secondary)}.app-footer{font-size:.8rem;margin-top:20px;margin-bottom:40px}