:root{color-scheme:dark;font-family:Avenir Next,Segoe UI,sans-serif;background:radial-gradient(circle at top left,rgba(255,122,24,.2),transparent 28%),radial-gradient(circle at top right,rgba(155,229,100,.17),transparent 22%),linear-gradient(180deg,#101217,#161b25);color:#f3efe7}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:transparent}button,input,select{font:inherit}.app-shell{max-width:1380px;margin:0 auto;padding:32px 24px 56px}.hero-card,.panel{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#0e1118b3;border:1px solid rgba(255,255,255,.08);border-radius:28px;box-shadow:0 24px 60px #00000047}.hero-card{display:grid;grid-template-columns:1.3fr 1fr;gap:24px;padding:32px;margin-bottom:24px}.eyebrow{margin:0 0 10px;text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;color:#ffcf4d}.hero-copy h1,.panel-header h2{margin:0;font-family:Georgia,Times New Roman,serif}.hero-copy h1{font-size:clamp(2.2rem,4vw,4.5rem);line-height:.98;max-width:10ch}.hero-text{max-width:54ch;color:#f3efe7c2;font-size:1.02rem;line-height:1.6}.hero-stats{display:grid;gap:14px}.hero-stats div,.status-chip,.inline-note,.error-note,.course-summary div,.totals-row{background:#ffffff0d;border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:16px 18px}.hero-stats span,.map-overlay span,.song-row span,.field span,.inline-note,.status-chip,.error-note,.course-summary span,.totals-row span{display:block;color:#f3efe7a8;font-size:.83rem}.hero-stats strong,.map-overlay strong,.song-row strong,.course-summary strong,.totals-row strong{display:block;margin-top:6px;font-size:1.2rem}.stack-layout{display:grid;gap:24px}.panel{padding:24px}.panel-header{display:flex;justify-content:space-between;gap:16px;align-items:start;margin-bottom:18px}.field{display:grid;gap:8px;margin-bottom:16px}.field input,.field select{width:100%;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);color:#f3efe7;padding:13px 14px;border-radius:14px}.goal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.button-row{display:flex;flex-wrap:wrap;gap:12px}.ghost-button{border:1px solid rgba(255,255,255,.14);background:linear-gradient(135deg,#ff7a182e,#ffcf4d2e);color:#f3efe7;border-radius:999px;padding:14px 18px;font-weight:700;cursor:pointer;transition:transform .14s ease,background .14s ease,border-color .14s ease,box-shadow .14s ease}.ghost-button:hover{background:linear-gradient(135deg,#ff7a1847,#ffcf4d47);border-color:#ffcf4d6b;box-shadow:0 10px 24px #0000002e;transform:translateY(-1px)}.ghost-button:active{transform:translateY(0);background:linear-gradient(135deg,#ff7a1857,#ffcf4d57);box-shadow:inset 0 2px 8px #00000038}.ghost-button:focus-visible{outline:2px solid rgba(255,207,77,.7);outline-offset:2px}.ghost-button-secondary{background:linear-gradient(135deg,#ff7a182e,#ffcf4d2e);color:#f3efe7;border:1px solid rgba(255,255,255,.14)}.error-note{color:#ffd7dd;border-color:#ff4d6d52}.empty-state{display:grid;gap:8px;padding:28px;border-radius:24px;background:#ffffff0a;border:1px dashed rgba(255,255,255,.16);color:#f3efe7cc}.course-summary{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:16px}.map-card,.elevation-card{position:relative;overflow:hidden;border-radius:26px;background:#ffffff09;border:1px solid rgba(255,255,255,.08)}.map-card{min-height:360px;padding:12px}.course-svg,.elevation-svg{width:100%;display:block}.course-bg{fill:#ffffff08}.marker-dot{fill:#101217;stroke:#f3efe7;stroke-width:1.5}.marker-label{fill:#f3efe7;font-size:7px;font-weight:700;pointer-events:none}.elevation-grid{stroke:#ffffff14;stroke-width:1;stroke-dasharray:4 6}.elevation-axis-label{fill:#f3efe7ad;font-size:10px;font-weight:600}.highlighted-polyline{filter:drop-shadow(0 0 6px rgba(255,207,77,.28))}.map-overlay{position:absolute;left:18px;right:18px;bottom:18px;display:flex;justify-content:space-between;gap:12px}.map-overlay div{background:#080a0eb3;border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:14px 16px}.elevation-card{margin-top:16px;padding:18px 14px 14px}.mile-plan-panel{display:grid;grid-template-columns:176px minmax(0,1fr);gap:14px;align-items:stretch;margin-top:16px}.mile-plan-elevation-strip{position:relative;overflow:hidden;border-radius:22px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08)}.mile-plan-content{min-width:0}.mile-plan-list{display:grid;grid-template-columns:1fr;gap:12px}.mile-row-header,.mile-row{display:grid;grid-template-columns:minmax(90px,1.1fr) .8fr .8fr .9fr 120px .9fr;gap:12px;align-items:center}.mile-row-header{padding:0 14px;color:#f3efe785;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}.mile-row{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:12px 14px}.mile-row-active{border-color:#ffcf4da6;background:#ffcf4d1f;box-shadow:inset 0 0 0 1px #ffcf4d3d}.mile-target-input{min-width:0;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);color:#f3efe7;padding:10px 12px;border-radius:12px}.mile-cell{color:#f3efe7db}.mile-label{font-weight:700}.pace-cell{color:#9be564}.delta-up{color:#ffcf4d}.delta-down{color:#72efdd}.totals-row{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:16px}.timeline-panel{display:grid;gap:14px}.timeline-panel-note{color:#f3efe7a3;font-size:.86rem;line-height:1.5}.timeline-audio-note{margin-top:12px}.timeline{--timeline-gutter: 12px;--timeline-elevation-width: 176px;--timeline-lane-gap: 14px;position:relative;border-radius:22px;padding:0 12px;background:#ffffff0a;overflow:hidden;border:1px solid rgba(255,255,255,.08)}.timeline-vertical{min-height:960px}.timeline-full{margin-top:16px}.timeline-guide{position:absolute;left:calc(var(--timeline-gutter) + var(--timeline-elevation-width) + var(--timeline-lane-gap));right:12px;height:1px;border-top:1px dashed rgba(255,255,255,.1);z-index:0}.timeline-guide span{position:absolute;top:-10px;left:calc((var(--timeline-elevation-width) + var(--timeline-lane-gap) - 8px) * -1);width:calc(var(--timeline-elevation-width) - 16px);padding:0 8px;background:#0e1118e0;color:#f3efe7a8;font-size:.72rem;text-align:left}.timeline-elevation-strip{position:absolute;top:0;left:var(--timeline-gutter);width:var(--timeline-elevation-width);height:100%;z-index:0}.timeline-elevation-svg{width:100%;height:100%;display:block}.timeline-elevation-title{position:absolute;top:10px;left:8px;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:#f3efe77a}.timeline-elevation-baseline{stroke:#ffffff24;stroke-width:1}.timeline-elevation-fill{fill:#72efdd14}.timeline-elevation-line{filter:drop-shadow(0 0 6px rgba(114,239,221,.16))}.timeline-block{position:absolute;left:calc(var(--timeline-gutter) + var(--timeline-elevation-width) + var(--timeline-lane-gap));right:18px;display:flex;gap:12px;align-items:flex-start;z-index:1;border-radius:18px;padding:12px 14px 16px;overflow:hidden;cursor:grab;border:1px solid rgba(255,255,255,.14);background:#0c0f15c7;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 12px 28px #00000029}.timeline-artwork-link,.timeline-title-link{color:inherit;text-decoration:none}.timeline-artwork{width:54px;height:54px;flex:0 0 54px;border-radius:12px;object-fit:contain;background:#0a0c102e;border:1px solid rgba(255,255,255,.14)}.timeline-artwork-fallback{display:grid;place-items:center;padding:6px;font-size:.66rem;font-weight:700;text-align:center}.timeline-block-copy{min-width:0;flex:1;display:grid;gap:6px;align-content:start}.timeline-block span,.timeline-block strong,.timeline-block small,.timeline-block em{display:block;overflow:hidden;text-overflow:ellipsis}.timeline-song-title{margin:0;font-size:.92rem;font-weight:700}.timeline-artist{margin:0;font-size:.8rem;color:#f3efe7c7}.timeline-time-row,.timeline-meta-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.timeline-time-row small,.timeline-meta-row em{font-size:.72rem;opacity:.72;font-style:normal}.timeline-meta-row{margin-top:0}.timeline-telemetry-panel{position:relative;padding:10px 10px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:radial-gradient(circle at top right,rgba(255,207,77,.16),transparent 38%),linear-gradient(135deg,#ffffff0f,#ffffff08);overflow:hidden}.timeline-telemetry-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.timeline-telemetry-card{min-width:0;padding:8px 9px;border-radius:12px;background:#080a0e6b;border:1px solid rgba(255,255,255,.08)}.timeline-telemetry-card-energy{background:linear-gradient(135deg,#ff7a1824,#ffcf4d14)}.timeline-telemetry-label{margin:0;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:#f3efe78a}.timeline-telemetry-value{margin-top:4px;font-size:.9rem;font-weight:700;line-height:1.05;color:#f9f5eb}.timeline-telemetry-unit{margin-top:5px;font-size:.62rem;color:#f3efe78f}.timeline-telemetry-meter{margin-top:8px;height:4px;border-radius:999px;background:#ffffff14;overflow:hidden}.timeline-telemetry-meter-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#72efdd,#ffcf4d 55%,#ff7a18);box-shadow:0 0 10px #ffcf4d47}.timeline-metadata-panel{position:relative;padding:10px 10px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:radial-gradient(circle at top left,rgba(114,239,221,.12),transparent 34%),linear-gradient(135deg,#ffffff0f,#ffffff08);overflow:hidden}.timeline-metadata-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.timeline-metadata-card{min-width:0;padding:8px 9px;border-radius:12px;background:#080a0e6b;border:1px solid rgba(255,255,255,.08)}.timeline-metadata-card-explicit{background:linear-gradient(135deg,#ff7a181f,#ffffff08)}.timeline-metadata-card-isrc{background:linear-gradient(135deg,#72efdd1a,#ffffff08)}.timeline-metadata-code{font-family:SFMono-Regular,Menlo,monospace;font-size:.72rem;letter-spacing:.05em}.timeline-metadata-footer{margin-top:8px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#f3efe79e;font-size:.68rem}.timeline-metadata-footer span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.timeline-title-link:hover span,.timeline-artwork-link:hover+.timeline-block-copy .timeline-title-link span{text-decoration:underline}.timeline-block-dragging{opacity:.45}.energy-warm{border-color:#72efdd38;box-shadow:inset 3px 0 #72efdd75,0 12px 28px #00000029;color:#e5f8f4}.energy-steady{border-color:#ffcf4d38;box-shadow:inset 3px 0 #ffcf4d75,0 12px 28px #00000029;color:#fff4d5}.energy-surge{border-color:#ff7a183d;box-shadow:inset 3px 0 #ff7a187a,0 12px 28px #00000029;color:#ffe9df}@media (max-width: 1120px){.hero-card{grid-template-columns:1fr}}@media (max-width: 720px){.app-shell{padding:18px 14px 40px}.goal-grid,.mile-plan-list,.course-summary{grid-template-columns:1fr}.mile-row-header{display:none}.mile-plan-panel{grid-template-columns:1fr}.mile-plan-elevation-strip{display:none}.mile-row{grid-template-columns:1fr 1fr}.timeline-block{left:18px}.timeline{--timeline-gutter: 0px;--timeline-elevation-width: 0px;--timeline-lane-gap: 0px}.timeline-guide{left:18px}.timeline-guide span{left:8px;width:auto;padding:0 6px;text-align:left}.timeline-elevation-strip{display:none}.timeline-time-row,.timeline-meta-row{flex-direction:column;align-items:flex-start;gap:2px}.timeline-telemetry-grid,.timeline-metadata-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.timeline-metadata-footer{flex-direction:column;align-items:flex-start;gap:4px}}
