*{box-sizing:border-box}body{margin:0;background-color:#03060D;background-image:linear-gradient(rgba(78,205,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(78,205,255,.05) 1px,transparent 1px);background-size:32px 32px;color:#DCEAF7;font:14px 'Chakra Petch',system-ui,sans-serif}header{height:66px;border-bottom:1px solid rgba(120,200,255,.26);display:flex;justify-content:space-between;align-items:center;padding:0 4vw;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:2px;color:#7E97B7;background:linear-gradient(180deg,rgba(78,205,255,.06),transparent)}a{color:#DCEAF7;text-decoration:none;font-weight:800}a span{color:#4ECDFF;margin-left:18px}main{max-width:1600px;margin:auto;padding:26px 3vw}.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}h1{font-size:clamp(32px,4vw,56px);letter-spacing:-1px;margin:5px 0;text-shadow:0 0 18px rgba(78,205,255,.35)}h1 span{color:#4ECDFF}.eyebrow{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:2px;color:#4ECDFF!important}p{color:#7E97B7;line-height:1.65}h2{font-size:36px;line-height:1.2}h3{font-size:20px}.layout{display:grid;grid-template-columns:230px minmax(400px,800px) 230px;gap:20px;align-items:start}.panel{position:relative;border:1px solid rgba(120,200,255,.26);background-color:rgba(10,19,32,.78);background-image:linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF);background-repeat:no-repeat;background-size:12px 2px,2px 12px,12px 2px,2px 12px,12px 2px,2px 12px,12px 2px,2px 12px;background-position:top left,top left,top right,top right,bottom left,bottom left,bottom right,bottom right;backdrop-filter:blur(3px);box-shadow:0 0 36px rgba(78,205,255,.06),inset 0 0 30px rgba(78,205,255,.02);padding:18px;margin-bottom:16px;border-radius:2px}.panel p{font-size:12px}button,select{font:inherit;color:#DCEAF7;background:rgba(78,205,255,.04);border:1px solid rgba(120,200,255,.26);border-radius:2px;padding:10px;cursor:pointer}button:hover:not(:disabled){border-color:#4ECDFF;color:#4ECDFF}button:disabled{opacity:.4;cursor:default}label{display:block;color:#7E97B7;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.08em;margin:12px 0 6px}select{width:100%}.panel button{width:100%;margin-top:10px}.row{display:flex;gap:6px}button.selected{border-color:#4ECDFF;background:rgba(78,205,255,.14);box-shadow:0 0 10px rgba(78,205,255,.35)}#gold{display:block;color:#FFB23D;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:28px;margin-top:18px}.arena{position:relative;border:1px solid rgba(120,200,255,.26);border-radius:2px;overflow:hidden;background-color:#0A0F1A;background-image:linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF),linear-gradient(#4ECDFF,#4ECDFF);background-repeat:no-repeat;background-size:14px 2px,2px 14px,14px 2px,2px 14px,14px 2px,2px 14px,14px 2px,2px 14px;background-position:top left,top left,top right,top right,bottom left,bottom left,bottom right,bottom right;box-shadow:0 0 40px rgba(78,205,255,.08)}.bar{display:flex;justify-content:space-between;align-items:center;padding:15px;gap:8px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:1px}#phase{color:#4ECDFF}#timer{font-size:23px}.board{position:relative}canvas{display:block;width:100%;aspect-ratio:1;outline:none}#intro{position:absolute;inset:0;background:#03060Ddf;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px}#start{background:#4ECDFF;color:#03060D;padding:15px 30px;font-weight:800;box-shadow:0 0 18px rgba(78,205,255,.45)}.footer{font-size:10px;letter-spacing:0}#notice{max-width:60%;text-align:center;color:#9db3c9}dt{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;color:#FFB23D;font-weight:800}dd{margin:3px 0 16px;color:#7E97B7;font-size:12px}#stats{color:#FFB23D}@media(max-width:1100px){.layout{grid-template-columns:190px minmax(350px,1fr)}.layout>aside:last-child{grid-column:1/-1;display:flex;gap:16px}.layout>aside:last-child .panel{flex:1}}@media(max-width:650px){header>span{display:none}.layout{display:flex;flex-direction:column}.layout>aside,.arena{width:100%}.layout>aside:first-child{display:flex;gap:10px}.panel{padding:12px;flex:1}.layout>aside:last-child{display:block}.heading{margin-bottom:12px}main{padding:15px}h2{font-size:25px}}

.command-strip{display:flex;align-items:center;gap:14px;padding:12px 16px;background:rgba(78,205,255,.05);border-top:1px solid rgba(120,200,255,.26)}.command-strip button{background:#4ECDFF;color:#03060D;font-weight:800;min-width:200px;box-shadow:0 0 14px rgba(78,205,255,.4)}.command-strip span{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;color:#9db3c9}#timer{font-size:16px}.board canvas{cursor:crosshair}#cooldowns{color:#FFB23D}@media(max-width:650px){.command-strip{flex-direction:column}.command-strip button{width:100%}}

.phase-track{display:grid;grid-template-columns:repeat(3,1fr);background:#06091A;border-bottom:1px solid rgba(120,200,255,.2)}.phase-track span{padding:13px 8px;text-align:center;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:1.5px;color:#4A607E;border-bottom:2px solid transparent}.phase-track[data-phase=observe] span:nth-child(1){color:#FF9AAA;border-color:#FF5577;background:rgba(255,85,119,.1)}.phase-track[data-phase=strategy] span:nth-child(2){color:#FFB23D;border-color:#FFB23D;background:rgba(255,178,61,.1)}.phase-track[data-phase=action] span:nth-child(3){color:#4ECDFF;border-color:#4ECDFF;background:rgba(78,205,255,.1)}.view-tools{display:flex;align-items:center;justify-content:space-between;padding:9px 14px;background:rgba(78,205,255,.03);gap:8px}.view-tools strong{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:1.3px;color:#9db3c9}.view-tools button{font-size:10px;padding:6px 9px}.board{aspect-ratio:1;background:#03060D}#scene3d{width:100%;height:100%;position:absolute;inset:0}#scene3d[hidden]{display:none}#scene3d canvas{width:100%;height:100%;outline:none;cursor:crosshair}#intro{z-index:3}.layout{grid-template-columns:210px minmax(400px,900px) 210px;gap:16px}main{max-width:1640px}.heading h1{font-size:42px}.heading{margin-bottom:16px}#phaseHint{max-width:60%}@media(max-width:1100px){.layout{grid-template-columns:190px minmax(350px,1fr)}}

[hidden]{display:none!important}
.attack-preview{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;max-width:168px;margin:14px auto}.attack-preview span{min-width:0;min-height:0;aspect-ratio:1;background:rgba(78,205,255,.05);border:1px solid rgba(120,200,255,.2);display:grid;place-items:center;font-size:10px}.attack-preview .strike{background:#8a5f2e;border-color:#FFB23D}.attack-preview .origin{color:#03060D;background:#4ECDFF}.facing{display:flex;gap:5px;justify-content:center}.facing button{flex:1;padding:8px}#attackRule{color:#FFB23D}

.attack-controls{border-top:1px solid rgba(120,200,255,.2);margin-top:12px;padding-top:6px}.attack-controls .attack-preview{max-width:112px;margin:8px auto}.attack-controls p{font-size:10px;line-height:1.4}.attack-controls .facing button{margin-top:0}

.army-status{display:flex;justify-content:space-between;padding:12px 16px;border-top:1px solid rgba(120,200,255,.2);font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;color:#9db3c9;gap:12px}.army-status span:last-child{color:#FF9AAA}.shop #gold{margin-top:0}.shop button{font-size:12px}.mission #planStatus{color:#FFB23D}.panel details{font-size:12px;color:#9db3c9}.panel summary{cursor:pointer;margin:12px 0;color:#B8ECFF}.panel dl{margin-top:18px}.mission .attack-preview{max-width:100px}.row button{font-size:11px;line-height:1.5}.shop p{font-size:11px}.layout{grid-template-columns:230px minmax(400px,880px) 230px}.heading p:not(.eyebrow){margin:6px 0}main{padding-top:18px}@media(max-width:1100px){.layout{grid-template-columns:210px minmax(350px,1fr)}}

/* Contrôles tactiles — phase d'action uniquement, écrans tactiles uniquement. */
.touch-controls{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:space-between;padding:14px;pointer-events:none;z-index:6}
.touch-btn{pointer-events:auto;-webkit-user-select:none;user-select:none;touch-action:none;display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:rgba(10,19,32,.72);border:1px solid rgba(120,200,255,.4);color:#DCEAF7;font-size:18px;backdrop-filter:blur(2px)}
.touch-btn:active{background:rgba(78,205,255,.28);border-color:#4ECDFF}
.touch-dpad{display:grid;grid-template-columns:repeat(3,52px);grid-template-rows:repeat(3,52px);gap:4px}
.dpad-up{grid-area:1/2}.dpad-left{grid-area:2/1}.dpad-down{grid-area:3/2}.dpad-right{grid-area:2/3}
.touch-actions{display:grid;grid-template-columns:repeat(2,52px);gap:10px;align-items:end}
.touch-attack{grid-column:1/-1;width:64px;height:64px;margin:0 auto;border-color:#FF5577;color:#FF5577;font-size:22px}
@media not (pointer:coarse){.touch-controls{display:none!important}}