/* Espace client ASILISK. Reprend les couleurs, les polices et les boutons de style.css. */
.panel-page{min-height:100vh;display:flex;flex-direction:column;
 --good:#b8f65a;--warn:#f1d27a;--bad:#f08a75;--card:#131a16;--card-line:#2a332b;--ink-2:#a9b3a8;--ink-3:#7a857a}
.panel-main{flex:1;padding:48px 0 96px}
.panel-crumb{margin-right:auto;padding-left:18px;border-left:1px solid var(--line);font-size:13px;color:var(--muted)}
.panel-main h1{font-size:34px;line-height:1.15;letter-spacing:-1.4px}
.panel-main h2{font-family:Inter,Arial,sans-serif;font-size:13px;font-weight:600;letter-spacing:0;line-height:1.4;color:var(--ink-2)}

/* Formulaires */
.panel-page label,.panel-page legend{display:block;font-size:12.5px;font-weight:500;color:#bac8b0;margin:18px 0 7px;padding:0}
.panel-page input:not([type=checkbox]):not([type=radio]){width:100%;min-height:44px;padding:10px 13px;background:#131e11;border:1px solid #35472c;border-radius:6px;color:var(--text);font-size:14px}
.panel-page input::placeholder{color:#62705a}
.form-error{margin-top:14px;padding:10px 13px;border-radius:6px;background:#a4463818;border:1px solid #73433590;color:#f0b9ad;font-size:13px}
.button.stop{border-color:#73433590;color:#f0b9ad}
.button.stop:hover{border-color:var(--bad);background:#a4463812}
.panel-page .button:disabled{cursor:not-allowed;opacity:.35;transform:none}
.panel-page .button-small{gap:8px}

/* Compte */
.account-email{font-size:13px;color:var(--muted);max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.form-ok{margin-bottom:6px;padding:11px 14px;border-radius:6px;background:#b8f65a12;border:1px solid #b8f65a40;color:#d5efae;font-size:13.5px;line-height:1.6}
.auth-help{font-size:13.5px;color:var(--ink-2);line-height:1.6}
.auth-links{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:20px;font-size:13px}
.auth-links a{color:var(--lime)}
.auth-links a:hover{text-decoration:underline}
.banner{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:0 0 22px}
.banner-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
#d-pending{margin-top:16px;margin-bottom:0}
.heading-actions{display:flex;gap:10px;flex-wrap:wrap}
.billing-price{font-family:Space,Inter,sans-serif;font-size:20px;letter-spacing:-.5px;margin-bottom:6px}
#d-billing .mini{margin-top:14px}
.order-total{margin-top:20px;padding-top:16px;border-top:1px solid var(--card-line);font-size:14px!important;color:var(--text)!important}
.order-total b{font-family:Space,Inter,sans-serif;font-size:20px;letter-spacing:-.5px}
.create-dialog{max-width:600px!important}
.plan-choices{grid-template-columns:repeat(4,1fr)!important}

/* Connexion */
.login-card{max-width:420px;margin:8vh auto 0;background:#10180f;border:1px solid #3e4e34;border-radius:var(--radius);padding:36px}
.login-card h1{font-size:28px;margin-bottom:22px}
.login-card .button{width:100%;margin-top:24px}

/* Liste */
.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:30px}
.panel-heading .button{gap:10px}
.empty-state{padding:40px;border:1px dashed #3a433b;border-radius:var(--radius);color:var(--muted);text-align:center;font-size:14px}
.server-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.server-card{display:flex;flex-direction:column;gap:6px;text-align:left;padding:20px 22px;background:var(--card);border:1px solid var(--card-line);border-radius:var(--radius);transition:border-color .2s}
.server-card:hover{border-color:var(--lime)}
.server-card b{font-family:Space,Inter,sans-serif;font-size:18px;letter-spacing:-.4px;overflow-wrap:anywhere}
.server-card .addr{font-size:13px;color:#a5c890;overflow-wrap:anywhere}
.server-card .meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);margin-top:8px}

/* Pastille d'état : toujours une couleur ET un libellé */
.status-chip{display:inline-flex;align-items:center;gap:7px;padding:5px 10px;border-radius:999px;font-size:12.5px;font-weight:500;background:#ffffff0a;color:#c3ccc0;white-space:nowrap}
.status-chip i{width:7px;height:7px;border-radius:50%;background:currentColor}
.status-chip.ok{background:#b8f65a14;color:var(--good)}
.status-chip.wait{background:#f6d35a14;color:var(--warn)}
.status-chip.bad{background:#a4463820;color:var(--bad)}
.status-chip.wait i{animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.25}}

/* Page d'un serveur */
.back-link{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-bottom:22px}
.back-link:hover{color:var(--lime)}
.back-link .icon{width:16px;height:16px}
.srv-head{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.srv-head .server-avatar{width:52px;height:52px;border-radius:10px}
.srv-title{min-width:0;margin-right:auto}
.srv-title h1{overflow-wrap:anywhere}
.srv-title p{font-size:13.5px;color:var(--muted);margin-top:4px}
.srv-power{display:flex;gap:8px;flex-wrap:wrap}
.address-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:24px;padding:14px 16px 14px 20px;background:#0f150f;border:1px solid var(--card-line);border-radius:var(--radius)}
.address-row>span{font-size:13px;color:var(--muted)}
.address-row code{font-family:Space,Inter,sans-serif;font-size:19px;letter-spacing:-.3px;color:var(--lime);margin-right:auto;overflow-wrap:anywhere}
.detail-notice{margin-top:16px;padding:13px 16px;border-radius:var(--radius);background:#f6d35a10;border:1px solid #f6d35a35;color:var(--warn);font-size:13.5px}
.detail-notice.bad{background:#a4463818;border-color:#73433590;color:#f0b9ad}

/* Mesures */
.tiles{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:14px;margin-top:16px}
.tile,.card{background:var(--card);border:1px solid var(--card-line);border-radius:var(--radius);padding:20px 22px}
.tile{display:flex;flex-direction:column;gap:12px;min-width:0}
.tile-top,.card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:28px}
.big{font-family:Space,Inter,sans-serif;font-size:38px;line-height:1;letter-spacing:-1.4px;font-variant-numeric:tabular-nums;white-space:nowrap}
.big small{font-family:Inter,Arial,sans-serif;font-size:14px;font-weight:400;letter-spacing:0;color:var(--ink-3);margin-left:7px}
.tile-tick .big{font-size:56px;letter-spacing:-2.4px}
.tick-main{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.spark{width:100%;height:40px;margin-top:auto;overflow:visible}
.tick-main .spark{max-width:200px;margin:0}
.spark polyline{fill:none;stroke:#7fae45;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.meter-bar,.budget-bar{height:8px;border-radius:4px;background:#232b24;overflow:hidden;margin-top:auto}
.meter-bar span,.budget-bar span{display:block;height:100%;width:0;border-radius:4px;background:#7fae45;transition:width .4s}
/* La barre de budget : chaque tick a 50 ms pour être calculé. Au-delà, le jeu ralentit. */
.budget{margin-top:4px}
.budget-label{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--ink-2);margin-bottom:8px}
.budget-label b{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}
.budget-bar{height:10px;border-radius:5px}
.budget-bar.warn span{background:var(--warn)}
.budget-bar.bad span{background:var(--bad)}
.tile-note{font-size:12.5px;color:var(--ink-3);margin-top:9px;min-height:19px}

/* Console et joueurs */
.cols{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr);gap:14px;margin-top:14px;align-items:start}
.side{display:grid;gap:14px}
.card-top{margin-bottom:14px}
.card-hint{font-size:12.5px;color:var(--ink-3);text-align:right}
.card-empty{font-size:13px;color:var(--ink-3);line-height:1.6}
.card .console-output{height:380px;font-size:12.5px;line-height:1.7;font-family:ui-monospace,Menlo,Consolas,monospace;margin:0 0 10px;border-radius:8px}
.card .console-form input{min-height:44px!important}
.card .console-form .button{min-height:44px;padding:9px 18px}
.people{display:grid}
.people li{display:flex;align-items:center;gap:8px;padding:10px 0;border-top:1px solid var(--card-line)}
.people li:first-child{border-top:0;padding-top:0}
.people .who{min-width:0;margin-right:auto}
.people .who b{display:block;font-weight:600;font-size:14px;overflow-wrap:anywhere}
.people .who small{display:block;font-size:12px;color:var(--ink-3);margin-top:1px;overflow-wrap:anywhere}
.mini{border:1px solid #35412f;background:#1a2418;border-radius:6px;padding:6px 10px;font-size:12.5px;white-space:nowrap}
.mini:hover{border-color:var(--lime)}
.mini.stop{border-color:#73433590;color:#f0b9ad;background:#a4463812}
.mini.stop:hover{border-color:var(--bad)}
.mini:disabled{cursor:not-allowed;opacity:.35}

.danger{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:40px;padding-top:24px;border-top:1px solid var(--card-line)}
.danger h2{color:var(--text);font-size:14px}
.danger p{font-size:13px;color:var(--ink-3);margin-top:3px}

/* Fenêtres */
.panel-page .site-dialog{max-width:540px}
.panel-page .site-dialog h2{font-family:Space,Inter,sans-serif;font-size:24px;letter-spacing:-.8px;color:var(--text);overflow-wrap:anywhere}
.panel-page .site-dialog p{color:#c3ccc0;font-size:13.5px;line-height:1.7}
.dialog-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:26px}
.button-danger{background:#b3402f;color:#fff}
.button-danger:hover{background:#c94e3b}
.create-form fieldset{border:0;margin:0;padding:0}
.address-input{display:flex;align-items:center;background:#131e11;border:1px solid #35472c;border-radius:6px}
.address-input:focus-within{outline:2px solid var(--lime);outline-offset:2px}
.address-input input{border:0!important;background:none!important;outline:none!important;min-width:0}
.address-input span{padding:0 13px 0 2px;color:var(--muted);font-size:13px;white-space:nowrap}
.field-hint{font-size:12px!important;color:var(--ink-3)!important;margin-top:6px}
.optional{font-weight:400;color:var(--ink-3);margin-left:6px}
.plan-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.duration-choices{display:flex;flex-wrap:wrap;gap:8px}
.plan-choices label,.duration-choices label{margin:0;padding:11px 13px;border:1px solid #35472c;border-radius:8px;cursor:pointer;display:flex;flex-direction:column;gap:2px;color:var(--text)}
.duration-choices label{padding:9px 14px;font-size:13.5px;font-weight:500}
.plan-choices label:has(input:checked),.duration-choices label:has(input:checked){border-color:var(--lime);background:#b8f65a0e}
.plan-choices label:has(input:focus-visible),.duration-choices label:has(input:focus-visible){outline:2px solid var(--lime);outline-offset:2px}
.plan-choices input,.duration-choices input{position:absolute;opacity:0;width:1px;height:1px}
.plan-choices b{font-family:Space,Inter,sans-serif;font-size:15px}
.plan-choices small{font-size:12px;color:var(--muted);font-weight:400}
.plan-choices .plan-price{font-size:12.5px;color:var(--lime);margin-top:4px;font-weight:500}
.panel-page .checkbox-label{font-size:13px;margin-top:20px;color:#c3ccc0}
.panel-page .checkbox-label input{width:16px;height:16px;margin-top:2px}
.panel-page .checkbox-label a{color:var(--lime);text-decoration:underline}

@media(max-width:1100px){
 .tiles{grid-template-columns:repeat(3,1fr)}
 .tile-tick{grid-column:1/-1}
 .cols{grid-template-columns:1fr}
}
@media(max-width:650px){
 .panel-main{padding:28px 0 64px}
 .panel-main h1{font-size:27px}
 .panel-crumb{display:none}
 .login-card{padding:26px;margin-top:3vh}
 .srv-power{width:100%}
 .srv-power .button{flex:1}
 .tiles{grid-template-columns:1fr 1fr}
 .tile,.card{padding:16px 16px}
 .tile-tick .big{font-size:46px}
 .big{font-size:30px}
 .tiles .tile:last-child{grid-column:1/-1}
 .card .console-output{height:280px}
 .plan-choices{grid-template-columns:1fr 1fr!important}
 .account-email{display:none}
 .dialog-actions .button{flex:1}
}
@media(prefers-reduced-motion:reduce){.status-chip.wait i{animation:none}.meter-bar span,.budget-bar span{transition:none}}

/* Serveur suspendu ou en échec : seuls l'abonnement et les explications restent affichés */
.is-off .tiles,.is-off .cols>.card,.is-off .side>.card:not(#d-billing){display:none}
.is-off .cols{grid-template-columns:minmax(0,420px)}
.panel-page .checkbox-label{display:flex;margin-top:16px}
.create-dialog{max-height:94vh!important;padding:28px 30px!important}
.create-dialog label,.create-dialog legend{margin-top:14px}
.create-dialog .order-total{margin-top:16px;padding-top:14px}
.create-dialog .dialog-actions{margin-top:18px}

.panel-page .version-select{width:100%;min-height:44px;padding:10px 40px 10px 13px;background:#131e11 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23b8f65a' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 14px center;border:1px solid #35472c;border-radius:6px;color:var(--text);font:inherit;font-size:14px;appearance:none;cursor:pointer}
.panel-page .version-select:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
.panel-page .version-select option{background:#131e11;color:var(--text)}