@import url(https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=DM+Sans:wght@300;400;500;600&display=swap);@import url(https://fonts.googleapis.com/css2?family=Syne:wght@400;700;800&family=Syne+Mono&display=swap);@import url(https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700;900&family=JetBrains+Mono:wght@400;600&display=swap);@import url(https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&family=Share+Tech+Mono&display=swap);@import url(https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600;700&family=DM+Mono:wght@400;500&display=swap);body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*,:after,:before{box-sizing:border-box;margin:0;padding:0}:root{--navy:#0a1628;--navy-mid:#112240;--navy-light:#1d3461;--accent:#c8a96e;--accent-dim:#c8a96e26;--text:#e8edf5;--muted:#8892a4;--border:#c8a96e33;--card:#112240b3}html{scroll-behavior:smooth}body{background:#0a1628;background:var(--navy);color:#e8edf5;color:var(--text);font-family:DM Sans,sans-serif;font-weight:300;overflow-x:hidden}.portfolio-wrapper:before{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)' opacity='.04'/%3E%3C/svg%3E");content:"";inset:0;opacity:.4;pointer-events:none;position:fixed;z-index:999}.port-nav{align-items:center;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0a1628d9;border-bottom:1px solid #c8a96e33;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;left:0;padding:1.25rem 3rem;position:fixed;right:0;top:0;z-index:100}.nav-logo{color:#c8a96e;color:var(--accent);font-family:"DM Serif Display",serif;font-size:1.25rem;letter-spacing:.02em}.nav-links{display:flex;gap:2.5rem}.nav-links a{color:#8892a4;color:var(--muted);font-size:.85rem;font-weight:500;letter-spacing:.12em;text-decoration:none;text-transform:uppercase;transition:color .3s}.nav-links a:hover{color:#c8a96e;color:var(--accent)}.hero-section{align-items:center;display:flex;min-height:100vh;overflow:hidden;padding:8rem 3rem 4rem;position:relative}.hero-section:after{border:1px solid #c8a96e33;border:1px solid var(--border);border-radius:50%;content:"";height:600px;pointer-events:none;position:absolute;right:-10%;top:15%;width:600px}.hero-inner{max-width:900px;position:relative;z-index:1}.hero-tag{animation:fadeUp .7s ease .1s forwards;border:1px solid #c8a96e33;border:1px solid var(--border);border-radius:2px;color:#c8a96e;color:var(--accent);display:inline-block;font-size:.78rem;font-weight:500;letter-spacing:.2em;margin-bottom:2rem;opacity:0;padding:.4rem 1rem;text-transform:uppercase}.hero-h1{animation:fadeUp .7s ease .25s forwards;color:#e8edf5;color:var(--text);font-family:"DM Serif Display",serif;font-size:clamp(3.5rem,8vw,6.5rem);letter-spacing:-.02em;line-height:1;opacity:0}.hero-h1 em{color:#c8a96e;color:var(--accent);font-style:italic}.hero-sub{animation:fadeUp .7s ease .4s forwards;color:#8892a4;color:var(--muted);font-size:1.1rem;line-height:1.7;margin-top:1.75rem;max-width:520px;opacity:0}.hero-cta{animation:fadeUp .7s ease .55s forwards;display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.5rem;opacity:0}.btn{border:none;border-radius:2px;cursor:pointer;display:inline-block;font-size:.85rem;font-weight:500;letter-spacing:.12em;padding:.85rem 2rem;text-decoration:none;text-transform:uppercase;transition:all .3s}.btn-primary{background:#c8a96e;background:var(--accent);color:#0a1628;color:var(--navy)}.btn-primary:hover{background:#dfc07e;box-shadow:0 8px 30px #c8a96e4d;transform:translateY(-2px)}.btn-outline{background:#0000;border:1px solid #c8a96e33;border:1px solid var(--border);color:#e8edf5;color:var(--text)}.btn-outline:hover{border-color:#c8a96e;border-color:var(--accent);color:#c8a96e;color:var(--accent);transform:translateY(-2px)}.scroll-indicator{align-items:center;animation:fadeIn 1s ease 1.2s forwards;bottom:2.5rem;display:flex;flex-direction:column;gap:.5rem;left:50%;opacity:0;position:absolute;transform:translateX(-50%)}.scroll-indicator span{color:#8892a4;color:var(--muted);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase}.scroll-line{animation:scrollPulse 2s ease infinite;background:linear-gradient(180deg,#c8a96e,#0000);background:linear-gradient(to bottom,var(--accent),#0000);height:50px;width:1px}.port-section{padding:6rem 3rem}.section-label{color:#c8a96e;color:var(--accent);display:block;font-size:.75rem;font-weight:500;letter-spacing:.22em;margin-bottom:1rem;text-transform:uppercase}.section-title{color:#e8edf5;color:var(--text);font-family:"DM Serif Display",serif;font-size:clamp(2rem,4vw,3rem);line-height:1.1;margin-bottom:3rem}.about-section{background:#112240;background:var(--navy-mid);border-bottom:1px solid #c8a96e33;border-bottom:1px solid var(--border);border-top:1px solid #c8a96e33;border-top:1px solid var(--border)}.about-grid{grid-gap:5rem;align-items:center;display:grid;gap:5rem;grid-template-columns:1fr 1fr;margin:0 auto;max-width:1100px}.about-text p{color:#8892a4;color:var(--muted);font-size:1.05rem;line-height:1.85;margin-bottom:1.25rem}.about-text p strong{color:#e8edf5;color:var(--text);font-weight:500}.about-stats{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:1fr 1fr}.stat-card{background:#112240b3;background:var(--card);border:1px solid #c8a96e33;border:1px solid var(--border);border-radius:4px;overflow:hidden;padding:1.75rem;position:relative;transition:transform .3s,border-color .3s}.stat-card:hover{border-color:#c8a96e;border-color:var(--accent);transform:translateY(-4px)}.stat-card:before{background:#c8a96e;background:var(--accent);content:"";height:100%;left:0;position:absolute;top:0;width:3px}.stat-number{color:#c8a96e;color:var(--accent);font-family:"DM Serif Display",serif;font-size:2.5rem;line-height:1}.stat-label{color:#8892a4;color:var(--muted);font-size:.8rem;letter-spacing:.1em;margin-top:.4rem;text-transform:uppercase}.skills-inner{margin:0 auto;max-width:1100px}.skills-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.skill-category{background:#112240b3;background:var(--card);border:1px solid #c8a96e33;border:1px solid var(--border);border-radius:4px;padding:2rem;transition:border-color .3s,transform .3s}.skill-category:hover{border-color:#c8a96e;border-color:var(--accent);transform:translateY(-3px)}.skill-cat-title{color:#c8a96e;color:var(--accent);font-size:.75rem;font-weight:500;letter-spacing:.18em;margin-bottom:1.25rem;text-transform:uppercase}.skill-tags{display:flex;flex-wrap:wrap;gap:.6rem}.skill-tag{background:#c8a96e14;border:1px solid #c8a96e33;border:1px solid var(--border);border-radius:2px;color:#e8edf5;color:var(--text);font-size:.82rem;padding:.35rem .85rem;transition:background .2s,border-color .2s}.skill-tag:hover{background:#c8a96e26;background:var(--accent-dim);border-color:#c8a96e;border-color:var(--accent)}.projects-section{background:#112240;background:var(--navy-mid);border-bottom:1px solid #c8a96e33;border-bottom:1px solid var(--border);border-top:1px solid #c8a96e33;border-top:1px solid var(--border)}.projects-inner{margin:0 auto;max-width:1100px}.projects-grid{grid-gap:1.75rem;display:grid;gap:1.75rem;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}.project-card{background:#112240b3;background:var(--card);border:1px solid #c8a96e33;border:1px solid var(--border);border-radius:4px;overflow:hidden;padding:2rem;position:relative;transition:transform .3s,border-color .3s}.project-card:hover{border-color:#c8a96e;border-color:var(--accent);transform:translateY(-5px)}.project-number{color:#c8a96e1f;font-family:"DM Serif Display",serif;font-size:3rem;line-height:1;pointer-events:none;position:absolute;right:1.5rem;top:1rem}.project-tag{color:#c8a96e;color:var(--accent);font-size:.72rem;font-weight:500;letter-spacing:.18em;margin-bottom:.75rem;text-transform:uppercase}.project-title{color:#e8edf5;color:var(--text);font-family:"DM Serif Display",serif;font-size:1.35rem;margin-bottom:.75rem}.project-desc{color:#8892a4;color:var(--muted);font-size:.9rem;line-height:1.7;margin-bottom:1.5rem}.project-links{display:flex;flex-wrap:wrap;gap:.75rem}.project-link{border-bottom:1px solid #c8a96e33;border-bottom:1px solid var(--border);color:#8892a4;color:var(--muted);font-size:.78rem;letter-spacing:.12em;padding-bottom:.1rem;text-decoration:none;text-transform:uppercase;transition:color .2s,border-color .2s}.project-link:hover{border-color:#c8a96e;border-color:var(--accent);color:#c8a96e;color:var(--accent)}.contact-section{text-align:center}.contact-inner{margin:0 auto;max-width:680px}.contact-sub{color:#8892a4;color:var(--muted);font-size:1rem;line-height:1.75;margin-bottom:2.5rem}.contact-email{border-bottom:1px solid #c8a96e33;border-bottom:1px solid var(--border);color:#c8a96e;color:var(--accent);display:inline-block;font-family:"DM Serif Display",serif;font-size:1.5rem;margin-bottom:2.5rem;padding-bottom:.25rem;text-decoration:none;transition:border-color .3s}.contact-email:hover{border-color:#c8a96e;border-color:var(--accent)}.social-links{display:flex;flex-wrap:wrap;gap:1.5rem;justify-content:center}.social-link{align-items:center;border:1px solid #c8a96e33;border:1px solid var(--border);border-radius:2px;color:#8892a4;color:var(--muted);display:inline-flex;font-size:.8rem;gap:.5rem;letter-spacing:.14em;padding:.6rem 1.25rem;text-decoration:none;text-transform:uppercase;transition:color .3s}.social-link:hover{color:#c8a96e;color:var(--accent)}.project-card--featured,.social-link:hover{border-color:#c8a96e;border-color:var(--accent)}.project-card--featured{background:linear-gradient(135deg,#112240e6,#1d346080)}.project-featured-badge{background:#c8a96e;background:var(--accent);border-radius:2px;color:#0a1628;color:var(--navy);display:inline-block;font-size:.62rem;font-weight:600;letter-spacing:.18em;margin-bottom:.6rem;padding:.2rem .65rem;text-transform:uppercase}.project-link--primary{border-bottom-color:#c8a96e!important;border-bottom-color:var(--accent)!important;color:#c8a96e!important;color:var(--accent)!important;font-weight:600}.games-section{background:#0a1628;background:var(--navy);border-top:1px solid #c8a96e33;border-top:1px solid var(--border)}.games-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.game-card{align-items:center;background:#112240b3;background:var(--card);border:1px solid #c8a96e33;border:1px solid var(--border);border-radius:4px;color:#e8edf5;color:var(--text);display:flex;gap:1.25rem;padding:1.5rem;text-decoration:none;transition:transform .25s,border-color .25s,background .25s}.game-card:hover{background:#c8a96e0f;border-color:#c8a96e;border-color:var(--accent);transform:translateY(-3px)}.game-icon{font-size:1.6rem;letter-spacing:-4px;min-width:48px;text-align:center}.game-info{flex:1 1}.game-title{font-family:"DM Serif Display",serif;font-size:1.1rem;margin-bottom:.3rem}.game-desc{color:#8892a4;color:var(--muted);font-size:.8rem;line-height:1.6;margin-bottom:.5rem}.game-tag{color:#c8a96e;color:var(--accent);font-size:.65rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase}.game-arrow{color:#8892a4;color:var(--muted);font-size:1.2rem;transition:color .2s,transform .2s}.game-card:hover .game-arrow{color:#c8a96e;color:var(--accent);transform:translateX(4px)}.port-footer{border-top:1px solid #c8a96e33;border-top:1px solid var(--border);color:#8892a4;color:var(--muted);font-size:.78rem;letter-spacing:.06em;padding:2rem;text-align:center}@keyframes scrollPulse{0%,to{opacity:1}50%{opacity:.3}}.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:translateY(0)}@media (max-width:768px){.port-nav{padding:1rem 1.5rem}.nav-links{gap:1.5rem}.port-section{padding:4rem 1.5rem}.hero-section{padding:7rem 1.5rem 4rem}.about-grid{gap:2.5rem;grid-template-columns:1fr}.hero-section:after{display:none}}.ttt-wrapper{--bg:#0d0d0d;--surface:#161616;--surface2:#1f1f1f;--accent:#e8ff47;--accent-dim:#e8ff471f;--accent-glow:#e8ff4759;--x-color:#e8ff47;--o-color:#ff6b6b;--o-glow:#ff6b6b59;--text:#f0f0f0;--muted:#555;--border:#2a2a2a;--win-line:#e8ff47;align-items:center;background:var(--bg);color:var(--text);display:flex;flex-direction:column;font-family:Syne,sans-serif;justify-content:center;min-height:100vh;overflow:hidden;padding:2rem 1rem;position:relative}.ttt-wrapper:before{background-image:linear-gradient(#e8ff4708 1px,#0000 0),linear-gradient(90deg,#e8ff4708 1px,#0000 0);background-size:40px 40px;content:"";inset:0;pointer-events:none;position:fixed}.ttt-header{animation:fadeDown .6s ease both;margin-bottom:2.5rem;text-align:center}.ttt-title{color:var(--text);font-size:clamp(2.5rem,6vw,4rem);font-weight:800;letter-spacing:-.04em;line-height:1}.ttt-title span{color:var(--accent)}.ttt-subtitle{color:var(--muted);font-family:Syne Mono,monospace;font-size:.72rem;letter-spacing:.22em;margin-top:.5rem;text-transform:uppercase}.score-bar{animation:fadeDown .6s ease .1s both;background:var(--border);border:1px solid var(--border);border-radius:4px;display:flex;gap:1px;margin-bottom:2rem;overflow:hidden}.score-item{background:var(--surface);flex:1 1;padding:1rem 1.5rem;text-align:center;transition:background .3s}.score-item.active{background:var(--surface2)}.score-who{color:var(--muted);font-family:Syne Mono,monospace;font-size:.65rem;letter-spacing:.2em;margin-bottom:.3rem;text-transform:uppercase}.score-num{font-size:1.8rem;font-weight:800;line-height:1}.score-item.you .score-num{color:var(--x-color)}.score-item.draws .score-num{color:var(--muted)}.score-item.ai .score-num{color:var(--o-color)}.status-bar{animation:fadeDown .6s ease .15s both;color:var(--muted);font-family:Syne Mono,monospace;font-size:.8rem;height:1.2em;letter-spacing:.15em;margin-bottom:1.5rem;text-transform:uppercase;transition:color .3s}.status-bar.your-turn{color:var(--x-color)}.status-bar.ai-turn{color:var(--o-color)}.status-bar.win{color:var(--accent)}.status-bar.lose{color:var(--o-color)}.status-bar.draw{color:var(--muted)}.board-container{animation:fadeDown .6s ease .2s both;position:relative}.board{grid-gap:3px;background:var(--border);border:3px solid var(--border);border-radius:8px;display:grid;gap:3px;grid-template-columns:repeat(3,1fr);overflow:hidden}.cell{align-items:center;background:var(--surface);cursor:pointer;display:flex;font-size:clamp(2rem,6vw,3rem);font-weight:800;height:clamp(90px,22vw,130px);justify-content:center;position:relative;transition:background .15s;-webkit-user-select:none;user-select:none;width:clamp(90px,22vw,130px)}.cell:hover:not(.filled):not(.disabled){background:var(--surface2)}.cell.disabled,.cell.filled{cursor:default}.cell-x{color:var(--x-color);text-shadow:0 0 20px var(--accent-glow)}.cell-o,.cell-x{animation:popIn .2s cubic-bezier(.34,1.56,.64,1) both}.cell-o{color:var(--o-color);text-shadow:0 0 20px var(--o-glow)}.cell.winning-cell{background:var(--accent-dim)}.cell.winning-cell .cell-o,.cell.winning-cell .cell-x{animation:winPulse .8s ease infinite alternate}.controls{animation:fadeUp .6s ease .3s both;display:flex;gap:.75rem;margin-top:2rem}.btn-ttt{border:none;border-radius:3px;cursor:pointer;font-family:Syne,sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.14em;padding:.75rem 1.75rem;text-transform:uppercase;transition:all .2s}.btn-primary-ttt{background:var(--accent);color:var(--bg)}.btn-primary-ttt:hover{box-shadow:0 6px 24px var(--accent-glow);transform:translateY(-2px)}.btn-outline-ttt{background:#0000;border:1px solid var(--border);color:var(--muted)}.btn-outline-ttt:hover{border-color:#444;color:var(--text)}.difficulty-row{animation:fadeDown .6s ease .12s both;display:flex;gap:.5rem;margin-bottom:1.5rem}.diff-btn{background:var(--surface);border:1px solid var(--border);border-radius:3px;color:var(--muted);cursor:pointer;font-family:Syne Mono,monospace;font-size:.7rem;letter-spacing:.15em;padding:.45rem 1rem;text-transform:uppercase;transition:all .2s}.diff-btn:hover{border-color:#444;color:var(--text)}.diff-btn.active{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.result-overlay{align-items:center;animation:fadeIn .3s ease both;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0d0d0de0;border-radius:5px;display:flex;flex-direction:column;gap:1rem;inset:0;justify-content:center;position:absolute}.result-text{font-size:1.4rem;font-weight:800;letter-spacing:-.02em;text-align:center}.result-emoji{font-size:3rem;line-height:1}@keyframes popIn{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@media (max-width:480px){.score-item{padding:.75rem .5rem}.controls{flex-wrap:wrap;justify-content:center}}.c4-wrapper{--bg:#070b14;--surface:#0e1520;--surface2:#151e2e;--board-bg:#0a3cff;--board-dark:#0830d4;--player:#ff3d3d;--player-glow:#ff3d3d80;--ai:#ffce00;--ai-glow:#ffce0080;--empty:#07111f;--empty-inner:#050d17;--text:#e8f0ff;--muted:#4a5a7a;--border:#1a2540;--accent:#00d4ff;--accent-glow:#00d4ff4d;--win-glow:#ffffffe6;align-items:center;background:var(--bg);color:var(--text);display:flex;flex-direction:column;font-family:Outfit,sans-serif;justify-content:center;min-height:100vh;overflow:hidden;padding:2rem 1rem;position:relative}.c4-wrapper:before{background:radial-gradient(circle,#003cff1f 0,#0000 70%);height:600px;left:-200px;top:-200px;width:600px}.c4-wrapper:after,.c4-wrapper:before{border-radius:50%;content:"";pointer-events:none;position:fixed}.c4-wrapper:after{background:radial-gradient(circle,#ff3d3d14 0,#0000 70%);bottom:-150px;height:500px;right:-150px;width:500px}.c4-back{align-items:center;color:var(--muted);display:flex;font-family:JetBrains Mono,monospace;font-size:.72rem;gap:.5rem;left:1.5rem;letter-spacing:.12em;position:absolute;text-decoration:none;text-transform:uppercase;top:1.5rem;transition:color .2s;z-index:10}.c4-back:hover{color:var(--accent)}.c4-header{animation:fadeDown .5s ease both;margin-bottom:1.75rem;text-align:center}.c4-title{font-size:clamp(2.2rem,5vw,3.5rem);font-weight:900;letter-spacing:-.03em;line-height:1}.c4-title .red{color:var(--player);text-shadow:0 0 30px var(--player-glow)}.c4-title .sep{color:var(--muted);font-weight:300;margin:0 .2em}.c4-title .yell{color:var(--ai);text-shadow:0 0 30px var(--ai-glow)}.c4-subtitle{color:var(--muted);font-family:JetBrains Mono,monospace;font-size:.68rem;letter-spacing:.22em;margin-top:.5rem;text-transform:uppercase}.c4-score-bar{animation:fadeDown .5s ease .08s both;background:var(--border);border:1px solid var(--border);border-radius:6px;display:flex;gap:1px;margin-bottom:1.25rem;overflow:hidden}.c4-score-item{background:var(--surface);flex:1 1;padding:.85rem 1.5rem;text-align:center;transition:background .3s}.c4-score-item.active{background:var(--surface2)}.c4-score-who{color:var(--muted);font-family:JetBrains Mono,monospace;font-size:.6rem;letter-spacing:.18em;margin-bottom:.25rem;text-transform:uppercase}.c4-score-num{font-size:1.6rem;font-weight:700;line-height:1}.c4-score-item.you .c4-score-num{color:var(--player)}.c4-score-item.draw .c4-score-num{color:var(--muted)}.c4-score-item.ai .c4-score-num{color:var(--ai)}.c4-diff-row{animation:fadeDown .5s ease .1s both;display:flex;gap:.5rem;margin-bottom:1.25rem}.c4-diff-btn{background:var(--surface);border:1px solid var(--border);border-radius:4px;color:var(--muted);cursor:pointer;font-family:JetBrains Mono,monospace;font-size:.65rem;letter-spacing:.15em;padding:.4rem 1rem;text-transform:uppercase;transition:all .2s}.c4-diff-btn:hover{border-color:#2a3a5a;color:var(--text)}.c4-diff-btn.active{background:#00d4ff1a;border-color:var(--accent);color:var(--accent)}.c4-status{animation:fadeDown .5s ease .12s both;color:var(--muted);font-family:JetBrains Mono,monospace;font-size:.75rem;height:1.2em;letter-spacing:.14em;margin-bottom:1rem;text-transform:uppercase;transition:color .3s}.c4-status.your-turn{color:var(--player)}.c4-status.ai-turn{color:var(--ai)}.c4-status.you-win{color:var(--player)}.c4-status.ai-win{color:var(--ai)}.c4-status.draw{color:var(--muted)}.col-arrows{grid-gap:4px;animation:fadeDown .5s ease .15s both;display:grid;gap:4px;grid-template-columns:repeat(7,1fr);margin-bottom:4px;max-width:504px;width:100%}.col-arrow{align-items:center;border-radius:4px;color:#0000;cursor:pointer;display:flex;font-size:1rem;height:28px;justify-content:center;transition:color .15s,background .15s}.col-arrow:hover{background:#ff3d3d14;color:var(--player)}.col-arrow.disabled{cursor:default;pointer-events:none}.c4-board-wrap{animation:fadeDown .5s ease .18s both;position:relative}.c4-board{grid-gap:4px;background:var(--board-bg);border-radius:10px;box-shadow:0 0 0 3px var(--board-dark),0 20px 60px #0028c880,0 0 80px #0028c833;display:grid;gap:4px;grid-template-columns:repeat(7,1fr);padding:8px}.c4-cell{background:var(--empty);border-radius:50%;box-shadow:inset 0 4px 10px #0009;height:clamp(52px,10vw,68px);overflow:hidden;position:relative;width:clamp(52px,10vw,68px)}.c4-cell:before{background:var(--empty-inner);border-radius:50%;content:"";inset:4px;position:absolute;transition:background .1s}.c4-cell.player:before{background:var(--player);box-shadow:0 0 16px var(--player-glow),inset 0 -4px 8px #0000004d}.c4-cell.ai-piece:before,.c4-cell.player:before{animation:dropIn .28s cubic-bezier(.33,1,.68,1) both}.c4-cell.ai-piece:before{background:var(--ai);box-shadow:0 0 16px var(--ai-glow),inset 0 -4px 8px #0000004d}.c4-cell.winning:before{animation:winPulse .6s ease infinite alternate}.c4-cell.player.winning:before{box-shadow:0 0 30px var(--player-glow),0 0 60px var(--player-glow)}.c4-cell.ai-piece.winning:before{box-shadow:0 0 30px var(--ai-glow),0 0 60px var(--ai-glow)}.c4-cell.preview-player:before{background:#ff3d3d40}.c4-overlay{align-items:center;animation:fadeIn .3s ease both;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#070b14e0;border-radius:10px;display:flex;flex-direction:column;gap:.85rem;inset:0;justify-content:center;position:absolute;z-index:10}.c4-overlay-emoji{font-size:3rem;line-height:1}.c4-overlay-text{font-size:1.3rem;font-weight:700;letter-spacing:-.01em;text-align:center}.c4-controls{animation:fadeUp .5s ease .22s both;display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-top:1.25rem}.c4-btn{align-items:center;border:none;border-radius:4px;cursor:pointer;display:inline-flex;font-family:Outfit,sans-serif;font-size:.78rem;font-weight:600;letter-spacing:.1em;padding:.7rem 1.6rem;text-decoration:none;text-transform:uppercase;transition:all .2s}.c4-btn-primary{background:var(--accent);color:var(--bg)}.c4-btn-primary:hover{box-shadow:0 6px 24px var(--accent-glow);transform:translateY(-2px)}.c4-btn-ghost{background:#0000;border:1px solid var(--border);color:var(--muted)}.c4-btn-ghost:hover{border-color:#2a3a5a;color:var(--text)}@keyframes fadeDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes dropIn{0%{opacity:.4;transform:scaleY(.3) translateY(-20px)}to{opacity:1;transform:scaleY(1) translateY(0)}}@keyframes winPulse{0%{transform:scale(.92)}to{transform:scale(1.04)}}@media (max-width:520px){.c4-board{gap:3px;padding:5px}.c4-back{font-size:0}.c4-back svg{display:block}}.tesla-wrapper{--bg:#0d0d0f;--surface:#111114;--surface2:#18181c;--surface3:#202026;--accent:#e82127;--accent-glow:#e8212740;--accent2:#3a7bd5;--green:#1db954;--text:#f2f2f4;--muted:#6b6b75;--border:#ffffff12;--glass:#ffffff0a;--shadow:0 4px 24px #00000080;background:var(--bg);color:var(--text);display:flex;flex-direction:column;font-family:Rajdhani,sans-serif;min-height:100vh;overflow:hidden;-webkit-user-select:none;user-select:none}.tesla-statusbar{align-items:center;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#0d0d0ff2;border-bottom:1px solid var(--border);display:flex;flex-shrink:0;height:48px;justify-content:space-between;padding:0 2rem;position:relative;z-index:10}.tesla-statusbar:after{background:linear-gradient(90deg,#0000,var(--accent),#0000);bottom:0;content:"";height:1px;left:0;opacity:.5;position:absolute;right:0}.tsb-left{align-items:center;display:flex;gap:1rem}.tsb-time{color:var(--text);font-family:Share Tech Mono,monospace;font-size:1rem;letter-spacing:.05em}.tsb-date{color:var(--muted);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}.tsb-battery,.tsb-center{align-items:center;display:flex}.tsb-battery{gap:.6rem}.tsb-bat-pct{color:var(--green);font-family:Share Tech Mono,monospace;font-size:.82rem}.tsb-bat-bar{background:#ffffff1a;border-radius:2px;height:4px;overflow:hidden;width:80px}.tsb-bat-fill{background:linear-gradient(90deg,var(--green),#4ade80);border-radius:2px;height:100%;transition:width .5s}.tsb-range{color:var(--muted);font-size:.72rem}.tsb-right{align-items:center;display:flex;gap:.75rem}.tsb-speed{color:var(--text);font-family:Share Tech Mono,monospace;font-size:1rem}.tsb-speed small{color:var(--muted);font-size:.58rem}.tsb-daynight{background:#0000;border:none;border-radius:4px;cursor:pointer;font-size:1rem;line-height:1;opacity:.7;padding:.15rem .4rem;transition:transform .2s}.tsb-daynight:hover{opacity:1;transform:scale(1.2)}.tesla-main{display:grid;flex:1 1;grid-template-columns:270px 1fr 190px;height:calc(100vh - 48px);min-height:0}.tesla-left{background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;gap:1rem;overflow-y:auto;padding:1.25rem 1rem 1rem;position:relative}.car-viz{height:240px;position:relative;width:100%}.gear-selector{display:flex;gap:.5rem;justify-content:center}.gear-btn{background:#0000;border:1px solid #ffffff1a;border-radius:50%;color:var(--muted);cursor:pointer;font-family:Share Tech Mono,monospace;font-size:.85rem;height:42px;transition:all .2s;width:42px}.gear-btn:hover{background:#e8212714;border-color:var(--accent);color:var(--text)}.gear-btn.active{background:var(--accent);border-color:var(--accent);box-shadow:0 0 20px var(--accent-glow);color:#fff}.climate-panel{background:var(--surface2);border:1px solid var(--border);border-radius:12px;border-top:1px solid #e821274d;padding:1rem}.climate-header{align-items:center;display:flex;gap:.5rem;margin-bottom:.75rem}.climate-icon{font-size:1rem}.climate-label{color:var(--muted);flex:1 1;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase}.climate-toggle{background:#0000;border:1px solid #ffffff1a;border-radius:3px;color:var(--muted);cursor:pointer;font-family:Share Tech Mono,monospace;font-size:.6rem;letter-spacing:.08em;padding:.2rem .55rem;transition:all .2s}.climate-toggle.on{background:#3d7bd526;border-color:var(--accent2);color:var(--accent2)}.temp-control{gap:1rem}.temp-btn,.temp-control{align-items:center;display:flex;justify-content:center}.temp-btn{background:var(--surface3);border:1px solid var(--border);border-radius:50%;color:var(--text);cursor:pointer;font-size:1.1rem;height:30px;transition:all .2s;width:30px}.temp-btn:hover{background:#e8212714;border-color:var(--accent)}.temp-display{color:var(--accent2);font-family:Share Tech Mono,monospace;font-size:1.5rem;min-width:70px;text-align:center}.tesla-center{background:var(--bg);display:flex;flex-direction:column;overflow:hidden;position:relative}.center-tabs{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#0d0d0fe6;border-bottom:1px solid var(--border);display:flex;flex-shrink:0;gap:.25rem;padding:0 .5rem}.center-tab{align-items:center;background:#0000;border:none;border-bottom:2px solid #0000;color:var(--muted);cursor:pointer;display:flex;flex:1 1;flex-direction:column;font-family:Rajdhani,sans-serif;gap:.15rem;padding:.65rem .5rem;position:relative;transition:all .2s}.center-tab:hover{color:var(--text)}.center-tab.active{border-bottom-color:var(--accent);color:var(--accent)}.center-tab.active:after{background:var(--accent);bottom:-1px;content:"";filter:blur(4px);height:2px;left:25%;position:absolute;right:25%}.tab-icon{font-size:1rem}.tab-label{font-size:.6rem;letter-spacing:.14em;text-transform:uppercase}.panel{flex:1 1;overflow-y:auto;padding:1.5rem;scrollbar-color:var(--border) #0000;scrollbar-width:thin}.home-grid{grid-gap:.65rem;display:grid;gap:.65rem;grid-template-columns:1fr 1fr;margin-bottom:1rem}.home-card{background:var(--surface2);border:1px solid var(--border);border-radius:14px;overflow:hidden;padding:1.1rem 1rem;position:relative;transition:all .25s}.home-card:before{background:linear-gradient(90deg,var(--accent),#0000);content:"";height:2px;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .25s}.home-card:hover{background:var(--surface3);box-shadow:0 8px 32px #0000004d;transform:translateY(-1px)}.home-card:hover:before{opacity:1}.hc-label{color:var(--muted);font-size:.62rem;letter-spacing:.18em;margin-bottom:.5rem;text-transform:uppercase}.hc-value{color:var(--text);font-family:Share Tech Mono,monospace;font-size:2.2rem;line-height:1}.hc-value span{color:var(--muted);font-size:.85rem;margin-left:2px}.hc-sub{color:var(--muted);font-size:.7rem;margin-top:.4rem}.battery-bar-full{background:#ffffff14;border-radius:2px;height:3px;margin:.6rem 0 .35rem;overflow:hidden}.battery-bar-fill{background:linear-gradient(90deg,var(--green),#4ade80);border-radius:2px;height:100%;transition:width .5s}.lock-icon{font-size:1.8rem;margin:.3rem 0}.bright-slider{accent-color:var(--accent);cursor:pointer;margin:.5rem 0 .3rem;width:100%}.mini-player{align-items:center;background:var(--surface2);border:1px solid var(--border);border-radius:14px;display:flex;gap:.75rem;padding:.75rem 1rem;transition:all .2s}.mini-player:hover{background:var(--surface3)}.mini-art{border-radius:6px;height:38px;object-fit:cover;width:38px}.mini-info{flex:1 1;min-width:0}.mini-title{font-size:.85rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mini-artist{color:var(--muted);font-size:.7rem}.mini-controls{display:flex;gap:.3rem}.mini-btn{background:#0000;border:none;border-radius:4px;color:var(--muted);cursor:pointer;font-size:.95rem;padding:.25rem .4rem;transition:color .2s}.mini-btn:hover{color:var(--text)}.mini-btn.play{color:var(--green)}.music-panel{height:100%;overflow:hidden;padding:0!important}.music-panel,.spotify-login{display:flex;flex-direction:column}.spotify-login{align-items:center;flex:1 1;gap:1rem;justify-content:center;padding:2rem;text-align:center}.spotify-logo{margin-bottom:.5rem}.spotify-title{font-size:1.4rem;font-weight:700}.spotify-desc{color:var(--muted);font-size:.85rem;line-height:1.6;max-width:260px}.spotify-btn{background:var(--green);border:none;border-radius:25px;color:#000;cursor:pointer;font-family:Rajdhani,sans-serif;font-size:.9rem;font-weight:700;letter-spacing:.08em;margin-top:.5rem;padding:.75rem 2rem;transition:all .2s}.spotify-btn:hover{box-shadow:0 4px 20px #1db95466;transform:scale(1.04)}.nav-panel{flex:0 0 auto;padding:.75rem 1rem}.nav-search-row{display:flex;flex-shrink:0;gap:.6rem}.nav-input{background:var(--surface2);border:1px solid var(--border);border-radius:8px;color:var(--text);flex:1 1;font-family:Rajdhani,sans-serif;font-size:.9rem;outline:none;padding:.6rem 1rem;transition:border-color .2s}.nav-input:focus{background:var(--surface3);border-color:var(--accent)}.nav-go{background:var(--accent);border:none;border-radius:8px;color:#fff;cursor:pointer;font-family:Rajdhani,sans-serif;font-size:.9rem;font-weight:700;letter-spacing:.06em;padding:.6rem 1.4rem;transition:all .2s}.nav-go:hover{box-shadow:0 0 16px var(--accent-glow);transform:translateY(-1px)}.leaflet-map{border:1px solid var(--border);border-radius:12px;flex:1 1;min-height:340px;overflow:hidden;z-index:0}.nav-active-dest{align-items:center;background:#e8212714;border:1px solid #e8212740;border-radius:8px;display:flex;flex-shrink:0;gap:.5rem;padding:.5rem .75rem}.nav-dest-label{color:var(--muted);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase}.nav-dest-name{color:var(--accent);flex:1 1;font-size:.82rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-clear{background:#0000;border:none;color:var(--muted);cursor:pointer;font-size:.8rem;padding:.1rem .3rem;transition:color .2s}.nav-clear:hover{color:var(--accent)}.nav-history{display:flex;flex-direction:column;flex-shrink:0;gap:.3rem}.nav-history-item{align-items:center;background:var(--surface2);border:1px solid var(--border);border-radius:6px;color:var(--muted);cursor:pointer;display:flex;font-family:Rajdhani,sans-serif;font-size:.8rem;gap:.5rem;padding:.5rem .75rem;text-align:left;transition:all .2s}.nav-history-item:hover{background:#e821270d;border-color:var(--accent);color:var(--text)}.settings-panel{display:flex;flex-direction:column;gap:0}.setting-row{align-items:center;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:.9rem 0}.setting-row:last-child{border-bottom:none}.setting-label{color:var(--muted);font-size:.85rem}.setting-value{font-size:.82rem}.setting-mode-btn,.setting-value{color:var(--text);font-family:Share Tech Mono,monospace}.setting-mode-btn{background:var(--surface3);border:1px solid var(--border);border-radius:6px;cursor:pointer;font-size:.78rem;padding:.3rem .75rem;transition:all .2s}.setting-mode-btn:hover{border-color:var(--accent);color:var(--accent)}.tesla-right{align-items:center;background:var(--surface);border-left:1px solid var(--border);display:flex;flex-direction:column;gap:1rem;padding:1.5rem .75rem}.right-time{text-align:center}.rt-time{color:var(--text);font-family:Share Tech Mono,monospace;font-size:1.5rem;letter-spacing:.05em;line-height:1}.rt-date{color:var(--muted);font-size:.65rem;letter-spacing:.08em;margin-top:.2rem;text-transform:uppercase}.right-stats{display:flex;flex-direction:column;gap:.5rem;width:100%}.rstat{background:var(--surface2);border:1px solid var(--border);border-radius:12px;overflow:hidden;padding:.75rem .5rem;position:relative;text-align:center;transition:all .2s}.rstat:before{background:var(--accent);content:"";height:2px;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .2s}.rstat:hover{background:var(--surface3);box-shadow:0 4px 16px #0000004d}.rstat:hover:before{opacity:1}.rstat-icon{font-size:1rem;margin-bottom:.2rem}.rstat-val{color:var(--accent);font-family:Share Tech Mono,monospace;font-size:1.1rem;line-height:1}.rstat-label{color:var(--muted);font-size:.58rem;letter-spacing:.14em;margin-top:.2rem;text-transform:uppercase}.right-gear{width:100%}.gear-display{background:var(--surface2);border:1px solid var(--border);border-radius:12px;padding:.75rem .5rem;text-align:center}.gear-label{color:var(--muted);display:block;font-size:.58rem;letter-spacing:.14em;margin-bottom:.2rem;text-transform:uppercase}.gear-value{color:var(--accent);font-size:2.2rem;line-height:1;text-shadow:0 0 20px var(--accent-glow)}.gear-value,.tesla-back{font-family:Share Tech Mono,monospace}.tesla-back{color:var(--muted);font-size:.65rem;letter-spacing:.12em;margin-top:auto;text-decoration:none;text-transform:uppercase;transition:color .2s}.tesla-back:hover{color:var(--accent)}.tesla-loading{align-items:center;display:flex;flex-direction:column;gap:1.5rem;justify-content:center}.loading-spinner{animation:spin .8s linear infinite;border:2px solid #ffffff14;border-radius:50%;border-top:2px solid var(--accent);height:48px;width:48px}.loading-text{color:var(--muted);font-family:Share Tech Mono,monospace;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase}.leaflet-popup-content-wrapper{border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:0 8px 32px #0009!important;color:var(--text)!important}.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--surface2)!important}.leaflet-popup-content{font-family:Rajdhani,sans-serif!important;font-size:.85rem!important}.tesla-wrapper:after{background:#000;content:"";inset:0;opacity:0;opacity:var(--brightness-overlay,0);pointer-events:none;position:fixed;transition:opacity .2s ease;z-index:998}.tesla-wrapper.day-mode{--bg:#e8eaed;--surface:#f0f2f5;--surface2:#fff;--surface3:#f8f9fa;--text:#0d0d0f;--muted:#6b7280;--border:#00000014;--glass:#00000008;--shadow:0 4px 24px #0000001f}.tesla-wrapper.day-mode .tesla-statusbar{background:#e8eaedf2;border-bottom-color:#00000014}.tesla-wrapper.day-mode .tesla-statusbar:after{opacity:.3}.tesla-wrapper.day-mode .center-tabs{background:#e8eaedf2;border-bottom-color:#00000014}.tesla-wrapper.day-mode .home-card{box-shadow:0 2px 12px #0000000f}.tesla-wrapper.day-mode .home-card:hover{box-shadow:0 8px 24px #0000001f}.tesla-wrapper.day-mode .rstat{box-shadow:0 2px 8px #0000000f}.tesla-wrapper.day-mode .nav-input{background:#fff;border-color:#0000001f;color:var(--text)}.tesla-wrapper.day-mode .nav-input:focus{border-color:var(--accent)}.tesla-wrapper.day-mode .nav-history-item{background:#fff;border-color:#00000014}.tesla-wrapper.day-mode .leaflet-map{filter:invert(.88) hue-rotate(180deg) brightness(1.05)}.tesla-wrapper.day-mode .tsb-speed,.tesla-wrapper.day-mode .tsb-time{color:var(--text)}.tesla-wrapper.day-mode .gear-btn{border-color:#0000001f;color:var(--muted)}.tesla-wrapper.day-mode .gear-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}@media (max-width:900px){.tesla-main{grid-template-columns:1fr}.tesla-left,.tesla-right{display:none}}.sp-root{--green:#1db954;--bg:#121212;--surface:#181818;--surface2:#242424;--text:#fff;--muted:#b3b3b3;--subtle:#535353;background:var(--bg);color:var(--text);display:grid;font-family:Rajdhani,sans-serif;font-size:14px;grid-template-columns:240px 1fr;grid-template-rows:1fr 72px;height:100%;overflow:hidden}.sp-sidebar{background:#000;display:flex;flex-direction:column;grid-row:1/2;overflow:hidden;padding:8px}.sp-lib-top{padding:8px 8px 4px}.sp-lib-title{align-items:center;color:var(--muted);cursor:default;display:flex;font-size:.9rem;font-weight:700;gap:8px}.sp-lib-title:hover{color:var(--text)}.sp-lib-filters{display:flex;flex-shrink:0;gap:6px;padding:8px 8px 4px}.sp-filter-chip{background:var(--surface2);border:none;border-radius:20px;color:var(--text);cursor:pointer;font-family:inherit;font-size:.78rem;font-weight:600;padding:4px 12px;transition:background .15s}.sp-filter-chip:hover{background:#3a3a3a}.sp-filter-chip.active{background:var(--text);color:#000}.sp-playlist-list{flex:1 1;overflow-y:auto;padding:4px 0}.sp-playlist-list::-webkit-scrollbar{width:4px}.sp-playlist-list::-webkit-scrollbar-thumb{background:#444;border-radius:2px}.sp-lib-item{align-items:center;background:#0000;border:none;border-radius:6px;cursor:pointer;display:flex;font-family:inherit;gap:10px;padding:6px 8px;text-align:left;transition:background .15s;width:100%}.sp-lib-item.active,.sp-lib-item:hover{background:var(--surface2)}.sp-lib-thumb{border-radius:4px;flex-shrink:0;height:44px;object-fit:cover;width:44px}.sp-lib-thumb--empty{background:var(--surface2)}.sp-lib-thumb--empty,.sp-liked-thumb{align-items:center;display:flex;justify-content:center}.sp-liked-thumb{background:linear-gradient(135deg,#450af5,#c4efd9);border-radius:4px;flex-shrink:0;height:44px;width:44px}.sp-lib-item-info{min-width:0}.sp-lib-item-name{color:var(--text);font-size:.85rem;font-weight:600}.sp-lib-item-name,.sp-lib-item-sub{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-lib-item-sub{color:var(--muted);font-size:.72rem}.sp-lib-item.active .sp-lib-item-name{color:var(--green)}.sp-logout{background:#0000;border:none;color:var(--muted);cursor:pointer;flex-shrink:0;font-family:inherit;font-size:.78rem;margin:4px 0;padding:8px;text-align:left;transition:color .15s}.sp-logout:hover{color:var(--text)}.sp-main{background:var(--bg);display:flex;flex-direction:column;grid-row:1/2;overflow:hidden}.sp-topbar{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0000004d;gap:12px;padding:12px 16px 8px}.sp-nav-btns,.sp-topbar{display:flex;flex-shrink:0}.sp-nav-btns{gap:4px}.sp-nav-btn{align-items:center;background:#000000b3;border:none;border-radius:50%;color:var(--text);cursor:pointer;display:flex;height:28px;justify-content:center;transition:background .15s;width:28px}.sp-nav-btn:hover{background:#ffffff1a}.sp-nav-btn--disabled{cursor:default;opacity:.4}.sp-topbar-search{align-items:center;background:var(--text);border-radius:20px;display:flex;flex:1 1;gap:8px;height:36px;max-width:360px;padding:0 12px}.sp-topbar-input{background:#0000;border:none;color:#000;flex:1 1;font-family:inherit;font-size:.85rem;font-weight:600;outline:none}.sp-topbar-input::placeholder{color:#555}.sp-search-x{background:#0000;border:none;color:#555;cursor:pointer;font-size:.8rem;padding:0}.sp-user-badge{flex-shrink:0;margin-left:auto}.sp-avatar{border-radius:50%;height:28px;object-fit:cover;width:28px}.sp-avatar--letter{align-items:center;background:#535353;color:var(--text);display:flex;font-size:.8rem;font-weight:700;justify-content:center}.sp-content{flex:1 1;overflow-y:auto;padding:0}.sp-content::-webkit-scrollbar{width:4px}.sp-content::-webkit-scrollbar-thumb{background:#444;border-radius:2px}.sp-view{padding:16px}.sp-greeting{font-size:1.6rem;font-weight:700;margin:0 0 16px}.sp-recent-grid{grid-gap:8px;display:grid;gap:8px;grid-template-columns:repeat(3,1fr);margin-bottom:24px}.sp-recent-item{align-items:center;background:var(--surface2);border:none;border-radius:6px;cursor:pointer;display:flex;font-family:inherit;gap:0;height:56px;overflow:hidden;position:relative;transition:background .15s}.sp-recent-item:hover{background:#2a2a2a}.sp-recent-item:hover .sp-recent-play-btn{opacity:1;transform:translateY(0)}.sp-recent-img{flex-shrink:0;height:56px;object-fit:cover;width:56px}.sp-recent-img--empty{background:var(--surface)}.sp-recent-img--empty,.sp-recent-img--liked{align-items:center;display:flex;justify-content:center}.sp-recent-img--liked{background:linear-gradient(135deg,#450af5,#c4efd9);flex-shrink:0;height:56px;width:56px}.sp-recent-name{color:var(--text);flex:1 1;font-size:.82rem;font-weight:700;overflow:hidden;padding:0 12px;text-overflow:ellipsis;white-space:nowrap}.sp-recent-play-btn{align-items:center;background:var(--green);border:none;border-radius:50%;box-shadow:0 4px 12px #0006;cursor:pointer;display:flex;height:36px;justify-content:center;opacity:0;position:absolute;right:8px;transform:translateY(4px);transition:opacity .2s,transform .2s;width:36px}.sp-section-title{font-size:1.2rem;font-weight:700;margin:0 0 12px}.sp-cards-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.sp-card{background:var(--surface);border:none;border-radius:8px;cursor:pointer;font-family:inherit;padding:14px;position:relative;text-align:left;transition:background .2s}.sp-card:hover{background:var(--surface2)}.sp-card-img{aspect-ratio:1;border-radius:4px;box-shadow:0 8px 24px #00000080;display:block;margin-bottom:10px;object-fit:cover;width:100%}.sp-card-img--empty{background:var(--surface2)}.sp-card-img--empty,.sp-card-img--liked{align-items:center;display:flex;justify-content:center}.sp-card-img--liked{background:linear-gradient(135deg,#450af5,#c4efd9)}.sp-card-name{color:var(--text);font-size:.85rem;font-weight:700;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-card-meta{color:var(--muted);font-size:.75rem}.sp-hero{align-items:flex-end;background:linear-gradient(180deg,#2a2a4a 0,var(--bg) 100%);display:flex;gap:20px;margin:-16px -16px 0;padding:24px 16px 16px}.sp-hero--liked{background:linear-gradient(180deg,#450af5 0,var(--bg) 100%)}.sp-hero-img{border-radius:4px;box-shadow:0 8px 40px #0009;flex-shrink:0;height:180px;object-fit:cover;width:180px}.sp-hero-img--empty{background:var(--surface2)}.sp-hero-img--empty,.sp-hero-img--liked{align-items:center;display:flex;justify-content:center}.sp-hero-img--liked{background:linear-gradient(135deg,#450af5,#c4efd9)}.sp-hero-info{padding-bottom:16px}.sp-hero-label{font-size:.72rem;font-weight:700;letter-spacing:.1em;margin-bottom:8px;text-transform:uppercase}.sp-hero-title{font-size:2rem;font-weight:900;line-height:1.1;margin-bottom:8px}.sp-hero-desc{margin-bottom:6px}.sp-hero-desc,.sp-hero-meta{color:var(--muted);font-size:.8rem}.sp-actions{gap:16px;padding:20px 0 8px}.sp-actions,.sp-play-btn{align-items:center;display:flex}.sp-play-btn{background:var(--green);border:none;border-radius:50%;box-shadow:0 4px 16px #1db95466;cursor:pointer;height:52px;justify-content:center;transition:transform .1s,background .1s;width:52px}.sp-play-btn:hover{background:#1ed760;transform:scale(1.04)}.sp-action-btn{background:#0000;border:none;color:var(--muted);cursor:pointer;font-family:inherit;padding:4px;transition:color .15s}.sp-action-btn:hover{color:var(--text)}.sp-action-btn--active{color:var(--green)!important}.sp-track-header{border-bottom:1px solid #282828;color:var(--muted);display:grid;font-size:.72rem;grid-template-columns:32px 40px 1fr 1fr 50px;letter-spacing:.08em;margin-bottom:4px;padding:0 8px 8px;text-transform:uppercase}.sp-th-num{text-align:center}.sp-th-title{grid-column:3}.sp-th-album{grid-column:4}.sp-th-dur{display:flex;grid-column:5;justify-content:flex-end}.sp-track-list{display:flex;flex-direction:column}.sp-track{grid-gap:0;align-items:center;background:#0000;border:none;border-radius:4px;color:var(--text);cursor:pointer;display:grid;font-family:inherit;gap:0;grid-template-columns:32px 40px 1fr 1fr 50px;padding:6px 8px;transition:background .1s;width:100%}.sp-track:hover{background:#ffffff12}.sp-track.playing{background:#ffffff0a}.sp-track-num{align-items:center;color:var(--muted);display:flex;font-size:.82rem;justify-content:center}.sp-eq-icon{color:var(--green);font-size:.9rem}.sp-track-img{border-radius:2px;height:36px;object-fit:cover;width:36px}.sp-track-info{min-width:0;padding:0 12px;text-align:left}.sp-track-name{font-size:.85rem;font-weight:600;margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-track-artist{font-size:.75rem}.sp-track-album,.sp-track-artist{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-track-album{font-size:.78rem;text-align:left}.sp-track-duration{color:var(--muted);font-family:Share Tech Mono,monospace;font-size:.78rem;text-align:right}.sp-loading{display:flex;justify-content:center;padding:40px}.sp-spinner{animation:spin .8s linear infinite;border:3px solid #333;border-radius:50%;border-top:3px solid var(--green);height:32px;width:32px}@keyframes spin{to{transform:rotate(1turn)}}.sp-empty{color:var(--muted);display:flex;flex-direction:column;font-size:.9rem;gap:12px;justify-content:center;padding:60px 20px}.sp-bar,.sp-empty{align-items:center}.sp-bar{grid-gap:8px;background:#181818;border-top:1px solid #282828;display:grid;gap:8px;grid-column:1/3;grid-row:2/3;grid-template-columns:1fr 2fr 1fr;padding:0 12px}.sp-bar-left{align-items:center;display:flex;gap:10px;min-width:0}.sp-bar-img{border-radius:4px;flex-shrink:0;height:52px;object-fit:cover;width:52px}.sp-bar-info{min-width:0}.sp-bar-title{color:var(--text);font-size:.82rem;font-weight:600}.sp-bar-artist,.sp-bar-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-bar-artist{color:var(--muted);font-size:.72rem}.sp-bar-heart{background:#0000;border:none;cursor:pointer;flex-shrink:0;padding:4px}.sp-bar-center{align-items:center;display:flex;flex-direction:column;gap:6px}.sp-bar-controls{gap:12px}.sp-bar-controls,.sp-bc{align-items:center;display:flex}.sp-bc{background:#0000;border:none;border-radius:50%;color:var(--muted);cursor:pointer;justify-content:center;padding:4px;position:relative;transition:color .15s,transform .1s}.sp-bc:hover{color:var(--text);transform:scale(1.06)}.sp-bc--active{color:var(--green)!important}.sp-bc--play{background:var(--text)!important;border-radius:50%;color:#000!important;height:34px;width:34px}.sp-bc--play:hover{background:#f0f0f0!important;transform:scale(1.06)!important}.sp-repeat-dot{background:var(--green);border-radius:50%;bottom:0;height:4px;left:50%;position:absolute;transform:translateX(-50%);width:4px}.sp-bar-progress{align-items:center;display:flex;gap:8px;width:100%}.sp-bar-time{color:var(--muted);flex-shrink:0;font-family:Share Tech Mono,monospace;font-size:.65rem;width:32px}.sp-bar-time:last-child{text-align:right}.sp-bar-track{background:#535353;border-radius:2px;cursor:pointer;flex:1 1;height:4px;position:relative;transition:height .1s}.sp-bar-track:hover{height:6px}.sp-bar-fill{background:var(--text);border-radius:2px;height:100%;pointer-events:none;transition:width .3s linear}.sp-bar-track:hover .sp-bar-fill{background:var(--green)}.sp-bar-thumb{background:var(--text);border-radius:50%;height:12px;opacity:0;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);transition:opacity .1s;width:12px}.sp-bar-track:hover .sp-bar-thumb{opacity:1}.sp-bar-right{align-items:center;display:flex;gap:8px;justify-content:flex-end}.sp-vol{accent-color:var(--green);cursor:pointer;width:80px}.sp-day,.sp-day .sp-bar,.sp-day .sp-main,.sp-day .sp-sidebar{background:#f0f2f5;border-color:#00000014;color:#0d0d0f}.sp-day .sp-lib-item:hover,.sp-day .sp-track:hover{background:#0000000d}.sp-day .sp-bar,.sp-day .sp-topbar{background:#e8eaed;border-color:#00000014}.sp-day .sp-topbar-input{background:#fff;color:#0d0d0f}.sp-day .sp-card,.sp-day .sp-recent-item{background:#fff}.sp-day .sp-bar-artist,.sp-day .sp-bar-time,.sp-day .sp-bar-title,.sp-day .sp-card-meta,.sp-day .sp-card-name,.sp-day .sp-greeting,.sp-day .sp-hero-desc,.sp-day .sp-hero-label,.sp-day .sp-hero-meta,.sp-day .sp-hero-title,.sp-day .sp-lib-item-name,.sp-day .sp-lib-item-sub,.sp-day .sp-lib-title,.sp-day .sp-recent-name,.sp-day .sp-section-title,.sp-day .sp-th-album,.sp-day .sp-th-title,.sp-day .sp-topbar-input,.sp-day .sp-topbar-input::placeholder,.sp-day .sp-track-album,.sp-day .sp-track-artist,.sp-day .sp-track-duration,.sp-day .sp-track-name,.sp-day .sp-track-num{color:#0d0d0f!important}.sp-day .sp-topbar-input::placeholder{color:#6b7280!important}.rt-root{background:#f1f5f9;color:#0f172a;display:flex;flex-direction:column;font-family:DM Sans,sans-serif;min-height:100vh}.rt-header{background:#fff;border-bottom:1px solid #e2e8f0;box-shadow:0 1px 3px #0000000f;flex-shrink:0;height:56px;justify-content:space-between;padding:0 1.5rem;position:relative;z-index:100}.rt-header,.rt-header-left{align-items:center;display:flex}.rt-header-left{gap:1rem}.rt-logo{align-items:center;color:#0f172a;display:flex;gap:.5rem}.rt-logo svg{color:#0ea5e9}.rt-logo-text{font-size:1rem;font-weight:300;letter-spacing:.06em;text-transform:uppercase}.rt-logo-text strong{color:#0ea5e9;font-weight:700}.rt-live-badge{align-items:center;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:20px;color:#16a34a;display:flex;font-family:DM Mono,monospace;font-size:.62rem;font-weight:700;gap:.35rem;letter-spacing:.1em;padding:.2rem .65rem}.rt-live-dot{animation:pulse-green 1.5s infinite;background:#22c55e;border-radius:50%;height:6px;width:6px}@keyframes pulse-green{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.7)}}.rt-stats-row{gap:.5rem}.rt-stat-pill,.rt-stats-row{align-items:center;display:flex}.rt-stat-pill{border:1px solid #0000;border-radius:20px;gap:.4rem;padding:.3rem .75rem}.rt-stat-pill--blue{background:#eff6ff;border-color:#bfdbfe}.rt-stat-pill--green{background:#f0fdf4;border-color:#bbf7d0}.rt-stat-pill--amber{background:#fffbeb;border-color:#fde68a}.rt-stat-pill--gray{background:#f8fafc;border-color:#e2e8f0}.rt-stat-val{color:#0f172a;font-family:DM Mono,monospace;font-size:.9rem;font-weight:500}.rt-stat-lbl{color:#64748b;font-size:.68rem;font-weight:500}.rt-back-btn{color:#64748b;font-family:DM Mono,monospace;font-size:.75rem;letter-spacing:.04em;text-decoration:none;transition:color .2s}.rt-back-btn:hover{color:#0ea5e9}.rt-alerts{background:#fff;border-bottom:1px solid #e2e8f0;display:flex;flex-direction:column;gap:.3rem;padding:.5rem 1.5rem}.rt-alert{align-items:center;background:#fff7ed;border:1px solid #fed7aa;border-radius:6px;color:#9a3412;display:flex;font-size:.78rem;gap:.6rem;padding:.45rem .75rem}.rt-alert-icon{font-size:.85rem}.rt-alert-msg{flex:1 1;font-weight:500}.rt-alert-dismiss{background:#0000;border:none;color:#9a3412;cursor:pointer;font-size:.7rem;opacity:.6;padding:.1rem .3rem;transition:opacity .2s}.rt-alert-dismiss:hover{opacity:1}.rt-body{display:grid;flex:1 1;grid-template-columns:280px 1fr 260px;height:calc(100vh - 56px);min-height:0;overflow:hidden}.rt-sidebar{background:#fff;border-right:1px solid #e2e8f0;display:flex;flex-direction:column;overflow:hidden}.rt-sidebar-top{border-bottom:1px solid #e2e8f0;flex-shrink:0;padding:1rem}.rt-sidebar-title{color:#94a3b8;display:block;font-family:DM Mono,monospace;font-size:.7rem;font-weight:600;letter-spacing:.1em;margin-bottom:.65rem;text-transform:uppercase}.rt-filters{display:flex;flex-wrap:wrap;gap:.3rem}.rt-filter-btn{background:#0000;border:1px solid #e2e8f0;border-radius:6px;color:#64748b;cursor:pointer;font-family:DM Sans,sans-serif;font-size:.7rem;font-weight:500;padding:.25rem .6rem;transition:all .15s}.rt-filter-btn:hover{border-color:#0ea5e9;color:#0ea5e9}.rt-filter-btn.active{background:#0ea5e9;border-color:#0ea5e9;color:#fff}.rt-vehicle-list{flex:1 1;overflow-y:auto;scrollbar-color:#e2e8f0 #0000;scrollbar-width:thin}.rt-vehicle-row{align-items:center;background:#0000;border:none;border-bottom:1px solid #f1f5f9;cursor:pointer;display:flex;gap:.5rem;justify-content:space-between;padding:.75rem 1rem;text-align:left;transition:background .15s;width:100%}.rt-vehicle-row:hover{background:#f8fafc}.rt-vehicle-row.selected{background:#eff6ff;border-left:3px solid #0ea5e9}.rt-vr-left{align-items:center;display:flex;gap:.6rem;min-width:0}.rt-vr-status-dot{border-radius:50%;flex-shrink:0;height:8px;width:8px}.rt-vr-info{min-width:0}.rt-vr-id{color:#0f172a;font-family:DM Mono,monospace;font-size:.82rem;font-weight:500}.rt-vr-sub{color:#64748b;font-size:.7rem;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rt-vr-right{align-items:flex-end;display:flex;flex-direction:column;flex-shrink:0;gap:.2rem}.rt-vr-battery{align-items:center;display:flex;gap:.35rem}.rt-vr-bat-bar{background:#e2e8f0;border-radius:2px;height:4px;overflow:hidden;width:44px}.rt-vr-bat-fill{border-radius:2px;height:100%;transition:width .5s}.rt-vr-bat-pct{font-size:.68rem;font-weight:500;min-width:30px;text-align:right}.rt-vr-bat-pct,.rt-vr-speed{font-family:DM Mono,monospace}.rt-vr-speed{color:#94a3b8;font-size:.65rem}.rt-map-container{overflow:hidden;position:relative}.rt-map{height:100%;width:100%}.rt-marker{align-items:center;display:flex;height:40px;justify-content:center;position:relative;width:40px}.rt-marker-dot{background:#0ea5e9;background:var(--mc,#0ea5e9);border:2px solid #fff;border-radius:50%;box-shadow:0 2px 8px #0003;height:12px;position:relative;transition:transform .2s;width:12px;z-index:2}.rt-marker--selected .rt-marker-dot{box-shadow:0 0 0 3px #0ea5e94d,0 2px 8px #0000004d;transform:scale(1.5)}.rt-marker-pulse{animation:marker-pulse 2s infinite;background:#0ea5e9;background:var(--mc,#0ea5e9);border-radius:50%;height:24px;opacity:0;position:absolute;width:24px;z-index:1}@keyframes marker-pulse{0%{opacity:.6;transform:scale(.5)}to{opacity:0;transform:scale(2)}}.rt-marker-label{background:#fff;border:1px solid #e2e8f0;border-radius:4px;box-shadow:0 1px 4px #0000001a;color:#334155;font-family:DM Mono,monospace;font-size:9px;font-weight:500;left:50%;padding:1px 5px;pointer-events:none;position:absolute;top:-18px;transform:translateX(-50%);white-space:nowrap}.rt-detail{background:#fff;border-left:1px solid #e2e8f0;display:flex;flex-direction:column;gap:1.25rem;overflow-y:auto;padding:1.25rem}.rt-detail-empty{align-items:center;display:flex;flex:1 1;flex-direction:column;gap:.75rem;justify-content:center;padding:2rem;text-align:center}.rt-detail-empty-icon{opacity:.4}.rt-detail-empty-text{color:#94a3b8;font-size:.9rem;font-weight:600}.rt-detail-empty-sub{color:#cbd5e1;font-size:.75rem;line-height:1.5}.rt-detail-header{align-items:flex-start;display:flex;justify-content:space-between}.rt-detail-id{color:#0f172a;font-family:DM Mono,monospace;font-size:1.3rem;font-weight:500}.rt-detail-status{font-size:.75rem;font-weight:600;margin-top:.2rem}.rt-detail-close{align-items:center;background:#f1f5f9;border:none;border-radius:6px;color:#64748b;cursor:pointer;display:flex;font-size:.75rem;height:28px;justify-content:center;transition:all .15s;width:28px}.rt-detail-close:hover{background:#fee2e2;color:#ef4444}.rt-detail-battery{display:flex;flex-direction:column;gap:.4rem}.rt-db-label{color:#64748b;display:flex;font-size:.72rem;font-weight:500;justify-content:space-between;letter-spacing:.08em;text-transform:uppercase}.rt-db-bar{background:#e2e8f0;border-radius:3px;height:6px;overflow:hidden}.rt-db-fill{border-radius:3px;height:100%;transition:width .5s,background .5s}.rt-db-charging{color:#f59e0b;font-size:.7rem;font-weight:500}.rt-detail-grid{grid-gap:.6rem;display:grid;gap:.6rem;grid-template-columns:1fr 1fr}.rt-dg-cell{background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;padding:.75rem}.rt-dg-label{color:#94a3b8;font-size:.62rem;font-weight:600;letter-spacing:.1em;margin-bottom:.3rem;text-transform:uppercase}.rt-dg-val{color:#0f172a;font-family:DM Mono,monospace;font-size:1.1rem;font-weight:500}.rt-dg-val span{color:#94a3b8;font-size:.65rem;margin-left:2px}.rt-detail-trip{background:#f0f9ff;border:1px solid #bae6fd;border-radius:12px;display:flex;flex-direction:column;gap:.75rem;padding:1rem}.rt-trip-label{color:#0284c7;font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.rt-trip-passenger{align-items:center;display:flex;gap:.65rem}.rt-trip-avatar{align-items:center;background:#0ea5e9;border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:.9rem;font-weight:700;height:34px;justify-content:center;width:34px}.rt-trip-name{color:#0f172a;font-size:.85rem;font-weight:600}.rt-trip-dest{color:#0284c7;font-size:.72rem;margin-top:.1rem}.rt-trip-eta{align-items:center;border-top:1px solid #bae6fd;display:flex;justify-content:space-between;padding-top:.5rem}.rt-trip-eta-label{color:#0284c7;font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}.rt-trip-eta-val{color:#0f172a;font-family:DM Mono,monospace;font-size:1rem;font-weight:500}.rt-detail-idle{align-items:center;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:12px;display:flex;flex-direction:column;gap:.4rem;padding:1.25rem;text-align:center}.rt-idle-icon{font-size:1.5rem}.rt-idle-text{color:#15803d;font-size:.85rem;font-weight:600}.rt-idle-sub{color:#86efac;font-size:.72rem}.rt-map .leaflet-popup-content-wrapper{border-radius:10px!important;box-shadow:0 4px 20px #0000001f!important;font-family:DM Sans,sans-serif!important}
/*# sourceMappingURL=main.69420cd6.css.map*/