[data-skin="illustrated-fleet"]{--board-active-your:var(--art-pen);--board-active-opponent:var(--art-orange);}
[data-skin="illustrated-fleet"]{--art-paper:#fffaf0;--art-pen:#38249b;--art-soft:#746dbc;--art-red:#c32632;--art-orange:#b85d2b;--art-green:#267c50;--art-grid:#a4c9ea5c}
[data-skin="illustrated-fleet"] body{background-color:var(--art-paper);background-image:linear-gradient(var(--art-grid) 1px,transparent 1px),linear-gradient(90deg,var(--art-grid) 1px,transparent 1px);background-size:23px 23px;color:#30247c;font-family:"Comic Sans MS","Segoe Print","Bradley Hand",cursive}
[data-skin="illustrated-fleet"] body:before{content:"";position:fixed;left:max(38px,calc((100vw - 1180px)/2));inset-block:0;border-left:2px solid #cc667277;pointer-events:none}
[data-skin="illustrated-fleet"] .app-shell,[data-skin="illustrated-fleet"] .game{position:relative;background:transparent;color:#30247c}
[data-skin="illustrated-fleet"] .app-shell{background-color:#fffaf0df;background-image:linear-gradient(var(--art-grid) 1px,transparent 1px),linear-gradient(90deg,var(--art-grid) 1px,transparent 1px);background-size:23px 23px}
[data-skin="illustrated-fleet"] .welcome form,[data-skin="illustrated-fleet"] .leave-dialog,[data-skin="illustrated-fleet"] .result-dialog,[data-skin="illustrated-fleet"] .skin-dialog{background:#fffaf0f5;color:#30247c;border:4px double var(--art-pen);border-radius:7px;box-shadow:3px 4px 0 #38249b22}
[data-skin="illustrated-fleet"] .brand,[data-skin="illustrated-fleet"] .welcome h1,[data-skin="illustrated-fleet"] .welcome h1 em,[data-skin="illustrated-fleet"] .eyebrow{color:var(--art-pen)}
[data-skin="illustrated-fleet"] .lead,[data-skin="illustrated-fleet"] .rules,[data-skin="illustrated-fleet"] .or,[data-skin="illustrated-fleet"] .leave-dialog p,[data-skin="illustrated-fleet"] .result-dialog p{color:#514890}
[data-skin="illustrated-fleet"] .welcome input,[data-skin="illustrated-fleet"] .join button,[data-skin="illustrated-fleet"] .primary{background:#fffdf5;color:var(--art-pen);border:3px double var(--art-pen);border-radius:5px;box-shadow:2px 2px 0 #38249b20}
[data-skin="illustrated-fleet"] .logo{background:#fffaf0;color:var(--art-pen);border:3px double var(--art-pen);box-shadow:none}
[data-skin="illustrated-fleet"] .radar,[data-skin="illustrated-fleet"] .sonar{border:3px double var(--art-pen);background:repeating-radial-gradient(circle,transparent 0 18px,#38249b1c 19px 20px)}
[data-skin="illustrated-fleet"] .radar span,[data-skin="illustrated-fleet"] .sonar span{background:conic-gradient(#38249b1d,transparent 24%)}
[data-skin="illustrated-fleet"] .radar b,[data-skin="illustrated-fleet"] .sonar b{color:var(--art-pen)}
[data-skin="illustrated-fleet"] .game header{background:#fffaf0ed;color:var(--art-pen);border-bottom:4px double var(--art-pen);box-shadow:none}
[data-skin="illustrated-fleet"] .room,[data-skin="illustrated-fleet"] .room b,[data-skin="illustrated-fleet"] .room button{color:var(--art-pen)}
[data-skin="illustrated-fleet"] #leave-room{border:2px solid var(--art-red)!important;color:var(--art-red)!important;background:transparent!important}
[data-skin="illustrated-fleet"] .skin-launch,[data-skin="illustrated-fleet"] #skin-close{border:2px solid var(--art-pen)!important;background:#fffaf0!important;color:var(--art-pen)!important;border-radius:5px}
[data-skin="illustrated-fleet"] .turn-banner{background:#fffaf0f4;color:var(--art-pen);border:4px double var(--art-pen);border-radius:6px;box-shadow:3px 4px 0 #38249b20}
[data-skin="illustrated-fleet"] .status-opponent-turn,[data-skin="illustrated-fleet"] .status-waiting-ready{color:#a95626;border-color:#b76931}
[data-skin="illustrated-fleet"] .status-shot-hit,[data-skin="illustrated-fleet"] .status-shot-sunk,[data-skin="illustrated-fleet"] .status-lost{color:var(--art-red);border-color:var(--art-red)}
[data-skin="illustrated-fleet"] .board-viewport{position:relative;isolation:isolate;overflow:visible;background-color:rgba(255,252,242,.97)}
[data-skin="illustrated-fleet"] .board-cells{position:relative;z-index:1;background:transparent;outline:0;box-shadow:none}
[data-skin="illustrated-fleet"] .board-cells>b{color:var(--art-pen);font-size:12px;font-weight:900;text-shadow:.4px .3px var(--art-pen)}
[data-skin="illustrated-fleet"] .board-cells>.row-coord{font-size:13px}
[data-skin="illustrated-fleet"] .board-cells>.coord-0{transform:translate(-1px,1px) rotate(-4deg)}[data-skin="illustrated-fleet"] .board-cells>.coord-1{transform:translate(1px,-1px) rotate(3deg);font-weight:700}[data-skin="illustrated-fleet"] .board-cells>.coord-2{transform:translate(0,1px) rotate(-1deg);font-weight:900}
[data-skin="illustrated-fleet"] .cell,[data-skin="illustrated-fleet"] .cell.ship,[data-skin="illustrated-fleet"] .cell.hit,[data-skin="illustrated-fleet"] .cell.sunk,[data-skin="illustrated-fleet"] .cell.miss,[data-skin="illustrated-fleet"] .cell.auto-miss{position:relative;border-color:transparent!important;background:transparent!important;color:transparent;font-size:0;box-shadow:none!important}
[data-skin="illustrated-fleet"] .illustrated-grid-layer,[data-skin="illustrated-fleet"] .illustrated-ship-layer,[data-skin="illustrated-fleet"] .illustrated-shot-layer{display:block;position:absolute;left:28px;top:28px;right:0;bottom:0;pointer-events:none;overflow:hidden}
[data-skin="illustrated-fleet"] .illustrated-grid-layer{z-index:2}[data-skin="illustrated-fleet"] .illustrated-grid-layer>img{display:block;width:100%;height:100%;pointer-events:none;image-rendering:auto}
[data-skin="illustrated-fleet"] .illustrated-ship-layer{z-index:3}[data-skin="illustrated-fleet"] .illustrated-shot-layer{z-index:5}
[data-skin="illustrated-fleet"] .illustrated-ship-overlay{display:block;position:absolute;left:calc(var(--ship-x) * var(--cell-share,10%));top:calc(var(--ship-y) * var(--cell-share,10%));width:calc(var(--ship-length) * var(--cell-share,10%));height:var(--cell-share,10%);pointer-events:none;overflow:visible}
[data-skin="illustrated-fleet"] .illustrated-ship-overlay.illustrated-vertical{width:var(--cell-share,10%);height:calc(var(--ship-length) * var(--cell-share,10%))}
[data-skin="illustrated-fleet"] .illustrated-ship{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none;user-select:none;-webkit-user-drag:none;filter:saturate(1.45) contrast(1.25) brightness(.92)}
[data-skin="illustrated-fleet"] .illustrated-vertical>.illustrated-ship{position:absolute;left:50%;top:50%;width:calc(100% * var(--ship-length));height:calc(100% / var(--ship-length));transform:translate(-50%,-50%) rotate(90deg);transform-origin:center}
[data-skin="illustrated-fleet"] .illustrated-sunk-strokes{position:absolute;z-index:2;left:-2%;top:9%;width:104%;height:82%;object-fit:fill;opacity:.8;pointer-events:none;user-select:none}
[data-skin="illustrated-fleet"] .illustrated-smoke{display:none}
[data-skin="illustrated-fleet"] .hit-smoke{height:calc(var(--cell-share,10%)*1.5);transform:translate(-50%,-67%);filter:none;background:none;overflow:visible}
[data-skin="illustrated-fleet"] .hit-smoke b{display:block;left:40%;bottom:33%;width:22%;height:auto;aspect-ratio:1;border:0;border-radius:0;background:url("assets/effects/smoke.webp?v=1.12.0") center/contain no-repeat;box-shadow:none;filter:saturate(.68) contrast(1.1) blur(.45px);animation:illustrated-smoke-puff 5.8s linear var(--smoke-delay,0s) infinite;transform-origin:50% 82%;will-change:transform,opacity}
[data-skin="illustrated-fleet"] .hit-smoke b:nth-child(2){left:46%;bottom:32%;width:19%;animation-delay:calc(var(--smoke-delay,0s) - 1.93s)}
[data-skin="illustrated-fleet"] .hit-smoke b:nth-child(3){left:36%;bottom:34%;width:24%;animation-delay:calc(var(--smoke-delay,0s) - 3.86s)}
@keyframes illustrated-smoke-puff{0%{opacity:0;transform:translate3d(0,5%,0) scale(.42) rotate(-2deg)}8%{opacity:.2;transform:translate3d(-1%,-7%,0) scale(.46) rotate(-1.6deg)}18%{opacity:.48;transform:translate3d(-4%,-23%,0) scale(.52) rotate(-.8deg)}32%{opacity:.64;transform:translate3d(-7%,-47%,0) scale(.61) rotate(.2deg)}48%{opacity:.58;transform:translate3d(1%,-75%,0) scale(.72) rotate(1.4deg)}64%{opacity:.46;transform:translate3d(6%,-104%,0) scale(.83) rotate(1.2deg)}80%{opacity:.27;transform:translate3d(-2%,-134%,0) scale(.94) rotate(.2deg)}92%{opacity:.1;transform:translate3d(-5%,-156%,0) scale(1.01) rotate(-.6deg)}100%{opacity:0;transform:translate3d(-3%,-170%,0) scale(1.06) rotate(-1deg)}}
[data-skin="illustrated-fleet"] .illustrated-vertical>.illustrated-sunk-strokes{left:50%;top:50%;width:calc(110% * var(--ship-length));height:calc(82% / var(--ship-length));transform:translate(-50%,-50%) rotate(90deg)}
[data-skin="illustrated-fleet"] .illustrated-shot{position:absolute;left:calc(var(--shot-x) * var(--cell-share,10%));top:calc(var(--shot-y) * var(--cell-share,10%));width:var(--cell-share,10%);height:var(--cell-share,10%);pointer-events:none;display:grid;place-items:center}
[data-skin="illustrated-fleet"] .illustrated-shot img{display:block;width:82%;height:82%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
[data-skin="illustrated-fleet"] .illustrated-shot-miss img,[data-skin="illustrated-fleet"] .illustrated-shot-auto-miss img{width:62%;height:62%;opacity:var(--shot-pressure,1);transform:rotate(var(--shot-rotation,0deg)) scale(var(--shot-scale,1));transform-origin:center}[data-skin="illustrated-fleet"] .illustrated-shot-auto-miss{opacity:.46}
[data-skin="illustrated-fleet"].illustrated-assets-loading .illustrated-ship-layer{opacity:0}[data-skin="illustrated-fleet"] .illustrated-ship-layer{transition:opacity .12s ease}
[data-skin="illustrated-fleet"] .illustrated-asset-error{border:2px dashed var(--art-pen);border-radius:45%;background:#38249b12}
[data-skin="illustrated-fleet"] .board.field-dimmed{opacity:1;filter:none}[data-skin="illustrated-fleet"] .board-viewport.field-dimmed{opacity:.73;filter:saturate(.75)}[data-skin="illustrated-fleet"] .board.field-pulse{animation:none}[data-skin="illustrated-fleet"] .game.modal-open .board-viewport{opacity:.68;filter:saturate(.72)}
[data-skin="illustrated-fleet"] .cell.target:hover{background:#7771bd20!important;box-shadow:inset 0 0 0 2px #38249b55!important}
[data-skin="illustrated-fleet"] .cell.ship-selected{z-index:2;box-shadow:inset 0 0 0 3px var(--art-green)!important}[data-skin="illustrated-fleet"] .cell.forbidden{background:repeating-linear-gradient(135deg,#c638483d 0 3px,#fffaf000 4px 8px)!important}[data-skin="illustrated-fleet"] .cell.preview-valid{background:#63b37a40!important;box-shadow:inset 0 0 0 3px var(--art-green)!important}[data-skin="illustrated-fleet"] .cell.preview-invalid{background:#d9586240!important;box-shadow:inset 0 0 0 3px var(--art-red)!important}
[data-skin="illustrated-fleet"] .illustrated-drag-preview{z-index:4;opacity:.82}[data-skin="illustrated-fleet"] .illustrated-preview-valid{filter:sepia(.2) hue-rotate(75deg) saturate(1.8)}[data-skin="illustrated-fleet"] .illustrated-preview-invalid{filter:sepia(.55) hue-rotate(300deg) saturate(2)}
[data-skin="illustrated-fleet"] .skin-card{background:#fffdf5;border:2px solid #777bb5;color:var(--art-pen)}[data-skin="illustrated-fleet"] .skin-card[aria-pressed="true"]{border:4px double var(--art-pen);box-shadow:2px 3px 0 #38249b28}[data-skin="illustrated-fleet"] .skin-card mark{background:transparent;color:var(--art-pen);text-decoration:underline}
[data-skin="illustrated-fleet"] .leave-modal,[data-skin="illustrated-fleet"] .result-modal,[data-skin="illustrated-fleet"] .skin-modal{background:#38426b4d}[data-skin="illustrated-fleet"] .leave-dialog button,[data-skin="illustrated-fleet"] .result-dialog button{border:2px solid var(--art-pen);background:var(--art-paper);color:var(--art-pen);border-radius:5px}[data-skin="illustrated-fleet"] .leave-dialog button:last-child{border-color:var(--art-red);color:var(--art-red);background:var(--art-paper)}[data-skin="illustrated-fleet"] .result-dialog #result-close{background:var(--art-paper);color:var(--art-pen);border:2px solid var(--art-pen)}[data-skin="illustrated-fleet"] #toast{background:var(--art-paper);color:var(--art-pen);border:3px double var(--art-pen)}
.preview-illustrated-fleet{background:#fffaf0 url("assets/preview/preview.webp?v=1.10.0") center/cover no-repeat!important}.preview-illustrated-fleet i,.preview-illustrated-fleet b,.preview-illustrated-fleet em{display:none!important}
@media(max-width:760px){[data-skin="illustrated-fleet"] body:before{display:none}[data-skin="illustrated-fleet"] .game header{background:#fffaf0}[data-skin="illustrated-fleet"] .board-viewport{max-width:100%}}
@media(prefers-reduced-motion:reduce){[data-skin="illustrated-fleet"] .illustrated-ship-layer{transition:none}[data-skin="illustrated-fleet"] .illustrated-ship-overlay,[data-skin="illustrated-fleet"] .illustrated-shot,[data-skin="illustrated-fleet"] .illustrated-smoke,[data-skin="illustrated-fleet"] .hit-smoke{transition:none;animation:none}}
[data-skin="illustrated-fleet"] .sound-launch,[data-skin="illustrated-fleet"] .sound-actions button{background:var(--art-paper);color:var(--art-pen);border:2px solid var(--art-pen)}[data-skin="illustrated-fleet"] .sound-modal{background:#38426b4d}[data-skin="illustrated-fleet"] .sound-dialog,[data-skin="illustrated-fleet"] .sound-pack-card{background:#fffaf0f4;color:var(--art-pen);border:4px double var(--art-pen);border-radius:7px}[data-skin="illustrated-fleet"] .sound-pack-card[aria-pressed="true"]{background:#fffdf5;box-shadow:2px 3px 0 #38249b28}[data-skin="illustrated-fleet"] .sound-pack-card mark{background:transparent;color:var(--art-pen);text-decoration:underline}

/* Shared UI semantic palette, owned by the active skin. */
[data-skin="illustrated-fleet"]{--ui-bg:#fffaf0;--ui-paper:#fffaf0f2;--ui-text:#102866;--ui-muted:#364d77;--ui-border:#29446b;--ui-accent:#174d9b;--ui-button-bg:#fffaf0;--ui-button-text:#102866;--ui-input-bg:#fffdf5;--ui-shadow:3px 4px 0 #253a6420;--ui-heading-font:ZarubaHand,"Segoe Print",cursive;--ui-body-font:system-ui,sans-serif;--ui-radius:5px;--ui-line:double;--ui-grid:#91b9d621;--ui-margin:#c955604d;--ui-decor-display:block;--ui-decor-filter:none;--ui-error:#a72d3b}