:root{--cyan:#55e9ff;--violet:#9c7cff;--gold:#ffd86a;--glass:rgba(4,12,29,.50);--line:rgba(118,220,255,.32);--safe-b:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#01040c;color:#eafaff;font-family:Inter,Segoe UI,Arial,sans-serif}button,input{font:inherit}button{color:#eaffff;background:linear-gradient(180deg,rgba(38,82,123,.86),rgba(8,24,48,.9));border:1px solid rgba(95,229,255,.48);border-radius:10px;padding:.58rem .8rem;cursor:pointer;box-shadow:0 0 18px rgba(35,201,255,.1);transition:.2s}button:hover,button.active{border-color:#7ff5ff;box-shadow:0 0 20px rgba(51,223,255,.32);transform:translateY(-1px)}.app{position:fixed;inset:0;overflow:hidden;background:radial-gradient(circle at 50% 35%,#0a1d3a 0,#020714 44%,#000 100%)}#spaceCanvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none}.vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle,transparent 52%,rgba(0,0,0,.54) 100%)}.glass{background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px) saturate(130%);-webkit-backdrop-filter:blur(14px) saturate(130%);box-shadow:0 12px 36px rgba(0,0,0,.3),inset 0 0 26px rgba(56,197,255,.035)}
.topbar{position:fixed;z-index:20;top:max(8px,env(safe-area-inset-top));left:10px;right:10px;min-height:68px;border-radius:16px;display:flex;align-items:center;gap:14px;padding:8px 12px}.brand{display:flex;align-items:center;min-width:250px}.brand img{width:46px;height:46px;margin-right:9px;filter:drop-shadow(0 0 10px var(--cyan))}.brand h1{font-size:1.03rem;letter-spacing:.16em;margin:0}.brand small{font-size:.68rem;opacity:.7}.modebar{display:flex;gap:6px;flex:1;justify-content:center}.modeBtn{white-space:nowrap}.actions{display:flex;gap:6px}
.hud{font-size:.76rem}.panel{position:fixed;z-index:15;width:min(300px,calc(100vw - 20px));padding:13px 14px;border-radius:15px;transition:opacity .25s,transform .25s;opacity:.86}.panel:hover{opacity:1}.panel h2{font-size:.82rem;margin:0 0 7px;color:#9eefff;letter-spacing:.08em}.panel p{display:flex;justify-content:space-between;gap:12px;margin:5px 0;border-bottom:1px solid rgba(255,255,255,.055);padding-bottom:4px}.panel p span{opacity:.68}.panel strong{text-align:right;font-weight:600}.panelClose{display:none;position:absolute;right:6px;top:5px;padding:2px 8px;border-radius:50%}.panel-position{left:12px;top:94px}.panel-astres{right:12px;top:94px}.panel-motion{left:50%;bottom:75px;transform:translateX(-50%);width:min(580px,calc(100vw - 24px));display:grid;grid-template-columns:repeat(2,1fr);column-gap:18px}.panel-motion h2{grid-column:1/-1}.panel-motion p{margin:3px 0}.panelTabs{display:none}.bottomDock{position:fixed;z-index:18;left:50%;bottom:max(10px,var(--safe-b));transform:translateX(-50%);border-radius:15px;padding:7px 9px;display:flex;align-items:center;gap:7px;max-width:calc(100vw - 20px)}.bottomDock label{font-size:.72rem;display:flex;align-items:center;gap:5px}.bottomDock input{width:110px}.notice{position:fixed;z-index:12;left:50%;top:82px;transform:translateX(-50%);max-width:min(720px,70vw);padding:6px 12px;border-radius:10px;font-size:.69rem;text-align:center;opacity:.72;pointer-events:none}.permanentCopyright{position:fixed;z-index:30;right:12px;bottom:8px;font-size:.66rem;letter-spacing:.04em;color:rgba(210,246,255,.76);text-shadow:0 0 8px #000,0 0 8px #000;pointer-events:none;user-select:none}.manual{color:#eaffff;border-radius:16px;max-width:380px}.manual::backdrop{background:rgba(0,0,0,.7)}.manual form{display:grid;gap:12px}.manual label{display:grid;gap:5px}.manual input{padding:10px;background:#071329;border:1px solid #3e9fbc;color:white;border-radius:9px}.dialogActions{display:flex;justify-content:flex-end;gap:8px}.celestHelp{display:none;position:fixed;z-index:16;right:14px;bottom:88px;width:260px;padding:10px;border-radius:12px;font-size:.7rem}.celestHelp b,.celestHelp span{display:block}.celestHelp span{opacity:.72;margin-top:4px}.app[data-mode="celest"] .celestHelp{display:block}.joysticks{display:none}.ok{color:#76ffc7}.warn{color:#ffe174}.bad{color:#ff7594}
@media(max-width:900px){.topbar{align-items:flex-start;flex-wrap:wrap}.brand{min-width:180px;flex:1}.brand small{display:none}.modebar{order:3;width:100%;overflow-x:auto;justify-content:flex-start}.actions #fullscreenBtn{display:none}.notice{top:128px;max-width:88vw}.panelClose{display:block}.panel{top:auto;bottom:126px;width:calc(100vw - 20px);left:10px;right:auto;max-height:32vh;overflow:auto;opacity:.88;transform:none}.panel-position{z-index:17}.panel-astres{z-index:16}.panel-motion{z-index:15;display:block}.panel:not(.open){opacity:0;pointer-events:none;transform:translateY(25px)}.panelTabs{display:flex;position:fixed;z-index:19;left:10px;bottom:74px;gap:5px}.panelTabs button{padding:.42rem .62rem;font-size:.69rem}.bottomDock{left:8px;right:8px;transform:none;bottom:max(8px,var(--safe-b));overflow-x:auto;justify-content:flex-start}.bottomDock button{white-space:nowrap;padding:.46rem .62rem}.bottomDock label{display:none}.permanentCopyright{left:10px;right:10px;bottom:58px;text-align:right;font-size:.58rem}.app[data-mode="celest"] .joysticks{display:block}.joystick{position:fixed;z-index:20;bottom:116px;width:112px;height:112px;border:1px solid rgba(89,230,255,.45);border-radius:50%;background:radial-gradient(circle,rgba(42,132,181,.18),rgba(2,9,20,.36));box-shadow:inset 0 0 24px rgba(78,228,255,.13);touch-action:none}.joystick i{position:absolute;width:44px;height:44px;left:34px;top:34px;border-radius:50%;border:1px solid #72edff;background:rgba(39,117,164,.48);box-shadow:0 0 20px rgba(85,232,255,.35)}.joystick span{position:absolute;top:116px;width:100%;text-align:center;font-size:.58rem;opacity:.65}.joystick#moveJoy{left:16px}.joystick#lookJoy{right:16px}.flyBtn{position:fixed;z-index:21;right:138px;width:42px;height:42px;padding:0;border-radius:50%}.flyBtn.up{bottom:172px}.flyBtn.down{bottom:120px}.celestHelp{display:none!important}}
@media(max-width:520px){.topbar{left:5px;right:5px;padding:6px}.brand img{width:35px;height:35px}.brand h1{font-size:.82rem}.actions button{font-size:.65rem;padding:.45rem .55rem}.modeBtn{font-size:.66rem;padding:.43rem .58rem}.notice{font-size:.58rem;top:115px}.panel{bottom:116px;max-height:34vh;font-size:.68rem}.panel p{gap:6px}.permanentCopyright{text-align:center;bottom:57px}.joystick{bottom:110px;width:96px;height:96px}.joystick i{width:38px;height:38px;left:29px;top:29px}.joystick span{top:99px}.flyBtn{right:120px}.flyBtn.up{bottom:160px}.flyBtn.down{bottom:112px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.fpsBadge{display:none;position:fixed;z-index:14;left:50%;top:50%;transform:translate(-50%,54px);padding:7px 12px;border:1px solid rgba(106,237,255,.45);border-radius:9px;background:rgba(2,10,22,.58);backdrop-filter:blur(8px);font-size:.68rem;letter-spacing:.09em;color:#bdf7ff;pointer-events:none;text-shadow:0 0 8px #000}.app[data-mode="celest"] .fpsBadge{display:block}.fpsLocked .fpsBadge{opacity:0}.app[data-mode="celest"] #spaceCanvas{cursor:crosshair}.fpsLocked .app[data-mode="celest"] #spaceCanvas{cursor:none}@media(max-width:900px),(pointer:coarse){.fpsBadge{display:none!important}}
#spaceCanvas{outline:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.app[data-mode="celest"] .bottomDock,.app[data-mode="celest"] .topbar{user-select:none}.fpsLocked button{pointer-events:none}.fpsLocked .panel,.fpsLocked .bottomDock,.fpsLocked .topbar{opacity:.62}.fpsLocked #spaceCanvas{pointer-events:auto}
.celestTools{display:grid;grid-template-columns:1fr auto;gap:6px;margin-top:9px}.celestTools input,.celestTools select{min-width:0;color:#eaffff;background:rgba(4,15,34,.9);border:1px solid rgba(95,229,255,.45);border-radius:8px;padding:.48rem .55rem}.celestTools #warpBtn{grid-column:1/2}.celestTools select{grid-column:2/3}.celestHelp{width:min(420px,calc(100vw - 28px))}.app[data-mode="celest"] .celestHelp{display:block}.app[data-mode="celest"] .celestHelp input,.app[data-mode="celest"] .celestHelp button,.app[data-mode="celest"] .celestHelp select{pointer-events:auto}.fpsLocked .celestHelp{opacity:.2;pointer-events:none}
@media(max-width:900px){.celestHelp{display:block!important;left:10px;right:10px;bottom:225px;width:auto}.celestTools{grid-template-columns:1fr auto}.celestTools input{font-size:.72rem}.celestTools button,.celestTools select{font-size:.68rem;padding:.42rem .5rem}}

/* Extension catalogue scientifique non destructive */
.bodyDialog{width:min(760px,calc(100vw - 24px));max-height:88vh;color:#eaffff;border-radius:18px;border:1px solid rgba(91,235,255,.55);padding:0;background:linear-gradient(145deg,rgba(3,12,29,.96),rgba(8,17,43,.94));box-shadow:0 0 60px rgba(54,213,255,.22),inset 0 0 50px rgba(118,92,255,.08)}
.bodyDialog::backdrop{background:rgba(0,2,10,.82);backdrop-filter:blur(8px)}.bodyDialog form{padding:16px}.bodyDialog header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(99,226,255,.22);padding-bottom:10px;margin-bottom:12px}.bodyDialog header b{display:block;letter-spacing:.11em;color:#9ef4ff}.bodyDialog header small{display:block;opacity:.64;margin-top:4px}.bodyDialog header button{font-size:1.2rem;padding:.15rem .6rem}.formGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.formGrid label{display:grid;gap:5px;font-size:.72rem;color:#b9efff}.formGrid input,.formGrid select{width:100%;padding:.65rem .72rem;color:#ecfdff;background:rgba(3,13,32,.86);border:1px solid rgba(91,220,255,.36);border-radius:10px}.formGrid .wide{grid-column:1/-1}.formGrid .check{display:flex;grid-template-columns:auto 1fr;align-items:center}.formGrid .check input{width:auto}.bodyDialog .dialogActions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:14px}.importBtn{display:inline-flex;align-items:center;color:#eaffff;background:linear-gradient(180deg,rgba(38,82,123,.86),rgba(8,24,48,.9));border:1px solid rgba(95,229,255,.48);border-radius:10px;padding:.58rem .8rem;cursor:pointer}.importBtn input{display:none}.dialogNote{font-size:.68rem;line-height:1.45;opacity:.65;margin:12px 0 0}.celestTools{grid-template-columns:minmax(120px,1fr) repeat(2,auto)}.celestTools #warpBtn{grid-column:auto}.celestTools select{grid-column:auto}.celestTools button{white-space:nowrap}
@media(max-width:700px){.formGrid{grid-template-columns:1fr}.formGrid .wide{grid-column:auto}.bodyDialog{max-height:92vh}.bodyDialog form{overflow:auto;max-height:92vh}.celestTools{grid-template-columns:1fr 1fr}.celestTools input{grid-column:1/-1}.celestTools #starSearchBtn,.celestTools #followBtn,.celestTools #addBodyBtn{min-width:0}.celestTools #warpBtn{grid-column:1/2}}
