/* Island Raid (raid-ui.mjs, raid-result.mjs; the owner-approved mockups design/island-raid/raid.css, 10 Oct 2026): the raid
   trip's RAID button (owner, 12 Oct 2026: only on the RAID tile's island), the Island Raid window and its confirm, the Defense Tower window, the HUD's Shield chip and its "+" with the
   Shield window (K6, 11 Oct 2026), the raids' notice, the result's card and veil, the tower's bubble and the leaderboard's
   shield on protected islands. The game's cream window (pc-storage.css .pcs-dialog, island-hall.css) and frames (preview/ui/frames). Text never
   under 13 px on a phone. */
.raid-dialog,.raid-dock,.raid-badge-row,.raid-notice,.raid-result{
  --ink:#3e211d;--soft:#6b4a33;--muted:#94683f;--rule:#ecd9ae;--paper:#fffaf0;
  --green:#2f7a2b;--green-fill:#6cbf4a;--gold:#ffd23f;--gold-ink:#7a3e00;--gold-edge:#e0a92a;
  --blue:#4f88d8;--blue-soft:#9cc3e3;--blue-tint:#e9f3fc;--blue-ink:#24476a;--red:#e0503a;--red-ink:#b23a1f;--none:#cdbfa6}
.raid-icon,.raid-title-icon,.raid-card-icon,.raid-coin,.raid-big-star,.raid-badge-icon,.raid-button-icon,.raid-big-shield,.raid-change-icon,.raid-job-icon{
  display:block;flex:none;width:24px;height:24px;image-rendering:pixelated}
:is(.raid-icon,.raid-title-icon,.raid-card-icon,.raid-coin,.raid-big-star,.raid-badge-icon,.raid-button-icon,.raid-big-shield,.raid-change-icon,.raid-job-icon) svg{
  display:block;width:100%;height:100%;shape-rendering:crispEdges}
/* The sprites paint their own pixels: no stroke from the game UI's line icons (workshop.css .workshop-ui svg). */
svg.raid-svg,.workshop-ui svg.raid-svg{fill:none;stroke:none}
/* The game's coin is an <img class="pixel-icon"> (32 px by default): it fills its own box like the sprites. */
.raid-coin>.pixel-icon{display:block;width:100%;height:100%}
.raid-nowrap{white-space:nowrap}
.raid-ph{display:none}
/* A scrolling outcome list's two fades (raid-odds-fade, below). */
@property --raid-fade-top{syntax:'<length-percentage>';inherits:false;initial-value:0px}
@property --raid-fade-bottom{syntax:'<length-percentage>';inherits:false;initial-value:0px}

/* ---------------------------------------------------------------- the window */
.raid-dialog{--q:clamp(.82px,min(calc((100vw - 24px) / 1000),calc((100dvh - 24px) / 700)),1.15px);
  box-sizing:border-box;width:min(calc(980 * var(--q)),calc(100vw - 24px));max-width:none;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);
  margin:auto;padding:0;border:calc(12 * var(--q)) solid transparent;border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/hud.svg') 12 fill stretch;background:none;overflow:hidden;
  color:var(--ink);font:400 max(13px,calc(14 * var(--q)))/1.4 Pixeloid,monospace;font-synthesis:none;box-shadow:0 12px 40px #090f2433}
.raid-dialog[open]{display:flex;flex-direction:column}
.raid-dialog::backdrop{background:#111d3980;backdrop-filter:blur(3px)}
.raid-dialog [hidden]{display:none!important}
.raid-dialog *{box-sizing:border-box}
.raid-dialog :is(h2,h3,h4,p,ul,ol,figure){margin:0}
.raid-dialog :is(ul,ol){padding:0;list-style:none}
.raid-dialog button{font-family:Pixeloid,monospace;cursor:pointer}
.raid-dialog button:disabled{cursor:not-allowed}
.raid-dialog button:focus-visible{outline:3px solid #3a97cf;outline-offset:2px}
.raid-sheet{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
.raid-head{flex:none;display:flex;align-items:center;gap:calc(12 * var(--q));padding:calc(8 * var(--q)) calc(12 * var(--q)) calc(8 * var(--q)) calc(14 * var(--q));
  background:linear-gradient(105deg,#ffd08b,#ffe6ae);border-bottom:calc(3 * var(--q)) solid #d9a15f}
.raid-title{flex:1;min-width:0;display:flex;align-items:center;gap:calc(12 * var(--q));font:700 max(16px,calc(23 * var(--q)))/1.15 Pixeloid,monospace;
  letter-spacing:.03em;text-transform:uppercase;white-space:nowrap}
.raid-title-text{min-width:0;white-space:normal;overflow-wrap:break-word;hyphens:auto}
.raid-title-icon{width:calc(32 * var(--q));height:calc(32 * var(--q));filter:drop-shadow(0 2px 0 #b8742f)}
.raid-title-chip{flex:none;padding:calc(4 * var(--q)) calc(10 * var(--q));background:#fff6dc;border:2px solid #d9a15f;box-shadow:inset 0 2px #fffdf3;
  color:#6a3a16;font:700 max(13px,calc(15 * var(--q)))/1.2 Pixeloid,monospace;letter-spacing:0;text-transform:none}
.raid-close{flex:none;display:grid;place-items:center;width:calc(44 * var(--q));height:calc(44 * var(--q));min-width:36px;min-height:36px;padding:calc(10 * var(--q));
  border:0;background:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/picker-close.svg') center/100% 100% no-repeat;color:var(--ink)}
.raid-close svg{width:100%;height:100%;shape-rendering:crispEdges}
.raid-body{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;display:grid;gap:calc(10 * var(--q));align-content:start;
  padding:calc(12 * var(--q)) calc(14 * var(--q)) calc(14 * var(--q));scrollbar-width:thin;scrollbar-color:#c99461 #fff4d2}
.raid-foot{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(9 * var(--q)) calc(14 * var(--q)) calc(10 * var(--q));
  background:#fff8e2;border-top:2px solid var(--rule);font:400 max(13px,calc(14 * var(--q)))/1.3 Pixeloid,monospace;color:var(--soft)}
.raid-foot b{color:var(--ink)}
.raid-section-title{font:700 max(14px,calc(16 * var(--q)))/1.3 Pixeloid,monospace;background:linear-gradient(90deg,#ffdaa0,#ffedc3);padding:5px 11px;
  clip-path:polygon(5px 0,calc(100% - 5px) 0,100% 5px,100% 100%,0 100%,0 5px)}
.raid-tile{border:5px solid transparent;border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/tile.svg') 8 fill stretch}
.raid-avatar{width:calc(54 * var(--q,1px));height:calc(54 * var(--q,1px));font-size:max(13px,calc(22 * var(--q,1px)))}
.raid-gold{display:flex;align-items:center;justify-content:center;gap:10px;min-height:calc(56 * var(--q));padding:4px 14px;border:calc(9 * var(--q)) solid transparent;
  border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/power-gold.svg') 12 fill stretch;background:none;color:#3a1c08;font:700 max(14px,calc(17 * var(--q)))/1.1 Pixeloid,monospace;
  text-shadow:0 1px #fff3b066;white-space:nowrap}
.raid-gold:disabled{border-image-source:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/tile.svg');border-image-slice:8 fill;color:#8b7964;text-shadow:none}
.raid-gold:disabled .raid-coin{filter:grayscale(.9);opacity:.6}
.raid-gold:not(:disabled):hover{filter:brightness(1.04)}
.raid-coin{width:calc(28 * var(--q));height:calc(28 * var(--q))}
.raid-gold-copy{display:grid;gap:3px;text-align:left}
.raid-gold-sub{font:400 max(13px,calc(13 * var(--q)))/1.1 Pixeloid,monospace;color:#6a3a16}
.raid-cream{display:flex;align-items:center;justify-content:center;gap:8px;min-height:calc(52 * var(--q));padding:3px 16px;border:calc(7 * var(--q)) solid transparent;
  border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/cream.svg') 12 fill stretch;background:none;color:var(--ink);font:700 max(14px,calc(15 * var(--q)))/1.1 Pixeloid,monospace;white-space:nowrap}
.raid-cream:disabled{color:#8b7964}
.raid-error{padding:6px 9px;background:#ffe5d5;color:#873e2d;font-size:max(13px,calc(13 * var(--q)));line-height:1.4}
.raid-empty{padding:14px;background:var(--paper);border:2px solid var(--rule);color:var(--soft);text-align:center}
.raid-note{text-align:center;font:400 max(13px,calc(13 * var(--q)))/1.45 Pixeloid,monospace;color:#755742}

/* ---------------------------------------------------------------- the Island Raid window: who you visit */
.raid-target{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:6px 14px;padding:calc(8 * var(--q)) calc(12 * var(--q));
  background:var(--paper);border:2px solid var(--rule)}
.raid-target .raid-avatar{grid-row:span 2;box-shadow:0 0 0 3px #a699c7,0 0 0 5px #fff6e0}
.raid-target-name{display:flex;align-items:baseline;gap:12px;min-width:0;font:700 max(16px,calc(22 * var(--q)))/1.1 Pixeloid,monospace}
.raid-target-who{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.raid-target-line{font:400 max(13px,calc(14 * var(--q)))/1 Pixeloid,monospace;color:var(--soft);white-space:nowrap}
/* One row of chips on a desktop (coordinator, 10 Oct 2026): a chip gives way down to its own content's narrowest (min-width
   auto): its label wraps first, then its value's parts (the H/s, its dollars); a figure is never cut. */
.raid-stats{display:flex;flex-wrap:nowrap;gap:calc(6 * var(--q));min-width:0}
.raid-stat{flex:0 1 auto;display:flex;flex-direction:column;justify-content:center;gap:3px;padding:calc(5 * var(--q)) calc(8 * var(--q)) calc(6 * var(--q));
  background:#fff;border:2px solid var(--rule)}
.raid-stat-label{font:700 max(11px,calc(11 * var(--q)))/1.1 Pixeloid,monospace;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.raid-stat-value{display:flex;flex-wrap:wrap;align-items:center;gap:0 6px;font:700 max(13px,calc(16 * var(--q)))/1.1 Pixeloid,monospace;white-space:nowrap}
.raid-stat-value .raid-icon{width:calc(18 * var(--q));height:calc(18 * var(--q))}
.raid-stat-value small{font:400 max(12px,calc(13 * var(--q)))/1 Pixeloid,monospace;color:var(--soft)}
.raid-stat[data-tone=tower],.raid-stat[data-tone=shield]{border-color:var(--blue-soft);background:var(--blue-tint)}
.raid-stat:is([data-tone=tower],[data-tone=shield]) .raid-stat-value{color:var(--blue-ink)}
.raid-stat[data-tone=gold]{border-color:var(--gold-edge);background:linear-gradient(90deg,#fff1b8,#ffe07a 55%,#fff1b8)}
.raid-stat[data-tone=gold] .raid-stat-value{color:var(--gold-ink)}
.raid-stat[data-tone=ok] .raid-stat-value{color:var(--green)}
.raid-panel-why{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#fff7e4;border:2px solid #8f3a2c;color:#4a2a14;font-weight:700}
/* the finder moved on to this island (owner, 12 Oct 2026): one calm line over the window, never something to sort out */
.raid-panel-note{margin:0;padding:6px 12px;background:var(--blue-tint);border:2px solid var(--blue-soft);color:var(--blue-ink);font:700 max(13px,calc(15 * var(--q)))/1.25 Pixeloid,monospace}

/* ---------------------------------------------------------------- the three cards (risk band, Win %, You take, odds, fee) */
/* The RAID buttons stay in view (coordinator, 10 Oct 2026): who you raid and why RAID waits keep their height, the cards take
   what is left of the window, and a card's outcome list scrolls (and fades at its edge) before its RAID button would leave
   the window or slide under the footer. */
.raid-panel .raid-body{display:flex;flex-direction:column}
.raid-panel .raid-body>*{flex:none}
.raid-panel .raid-body>.raid-cards{flex:1 1 auto;min-height:0}
.raid-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:minmax(0,1fr);gap:calc(12 * var(--q));align-items:stretch}
.raid-card{--a:#5fb346;--edge:#9fd27f;--tint:#f1f9e8;--deep:#2f6a2b;
  position:relative;display:flex;flex-direction:column;gap:calc(9 * var(--q));min-width:0;min-height:0;padding:0 calc(12 * var(--q)) calc(12 * var(--q));border:3px solid var(--edge);background:var(--tint);
  font:400 max(13px,calc(14 * var(--q)))/1.35 Pixeloid,monospace}
.raid-card[data-risk=medium]{--a:#f2b134;--edge:#f1cd7a;--tint:#fff7e1;--deep:#9a5a0a}
.raid-card[data-risk=high]{--a:#e0503a;--edge:#efa392;--tint:#fff1ec;--deep:#9b2a1c}
.raid-card-head{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"risk risk" "icon name";align-items:center;gap:calc(9 * var(--q));min-width:0}
.raid-card-icon{grid-area:icon;width:calc(32 * var(--q));height:calc(32 * var(--q))}
.raid-card-name{grid-area:name;min-width:0;overflow-wrap:break-word;font:700 max(15px,calc(20 * var(--q)))/1.1 Pixeloid,monospace;letter-spacing:.03em;
  text-transform:uppercase}
.raid-risk{grid-area:risk;display:flex;align-items:center;gap:10px;margin:0 calc(-12 * var(--q));padding:calc(7 * var(--q)) calc(12 * var(--q)) calc(6 * var(--q));
  background:var(--deep);color:#fff6ec;box-shadow:inset 0 -3px #0000002e;font:700 max(13px,calc(14 * var(--q)))/1 Pixeloid,monospace;letter-spacing:.14em;
  text-transform:uppercase;white-space:nowrap}
.raid-pips{display:flex;gap:3px}
.raid-pips i{width:7px;height:14px;background:#fff6ec44}
.raid-pips i.on{background:#fff6ec}
.raid-winbox,.raid-gain{display:flex;flex-direction:column;justify-content:center;gap:5px;min-height:calc(84 * var(--q));padding:calc(7 * var(--q)) calc(10 * var(--q));
  background:var(--paper);border:2px solid var(--edge);min-width:0}
.raid-card>.raid-winbox{position:relative}
/* The two boxes size their big number to their width (cqi; its length is --chars, raid-ui.mjs fitted()). */
.raid-winbox,.raid-gain{container-type:inline-size}
/* The risk band and name, Win % beside You take, the odds bar, every outcome, the RAID button at the card's foot. */
.raid-card{display:grid;grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);grid-template-rows:auto auto auto minmax(0,1fr) auto;
  grid-template-areas:"head head" "win gain" "bar bar" "odds odds" "go go"}
.raid-card-head{grid-area:head}.raid-winbox{grid-area:win}.raid-gain{grid-area:gain}.raid-oddsbar{grid-area:bar}.raid-odds{grid-area:odds}.raid-card-go{grid-area:go;align-self:end}
.raid-big-label{display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px;font:700 max(12px,calc(12 * var(--q)))/1 Pixeloid,monospace;letter-spacing:.02em;text-transform:uppercase;
  color:var(--muted);white-space:nowrap}
/* A box's label on one line as approved ("WIN CHANCE"); another language's longer words wrap in their box ("PELUANG / MENANG"),
   and a jackpot's percent goes under its word when the box is narrow. */
:root[data-language]:not([data-language=en]) .raid-big-label{white-space:normal}
/* Pixeloid's bold figures are about .7em wide: "+12,345 H/s" shrinks until it fits its box, "+42 H/s" keeps its full size. */
.raid-big-value{font:700 max(13px,min(max(24px,calc(35 * var(--q))),calc(100cqi / (var(--chars,3) * .8))))/1 Pixeloid,monospace;color:var(--deep);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.raid-big-gain{font:700 max(13px,min(max(17px,calc(24 * var(--q))),calc(100cqi / (var(--chars,8) * .72))))/1.05 Pixeloid,monospace;color:var(--green);
  white-space:nowrap}
.raid-big-sub{display:flex;flex-wrap:wrap;column-gap:0;font:400 max(12px,calc(13 * var(--q)))/1.2 Pixeloid,monospace;color:var(--soft)}
.raid-big-sub>*{white-space:pre}
.raid-jackpot{position:relative;border:3px solid var(--gold-edge);background:linear-gradient(115deg,#fff3c0 0%,#ffe07a 42%,#ffd23f 60%,#fff1b8 100%);
  box-shadow:0 0 0 2px #fff6cf inset,0 0 14px #ffc42899;overflow:hidden}
.raid-jackpot .raid-big-label{color:#8a5216}
.raid-jackpot .raid-big-star{width:16px;height:16px}
.raid-jackpot .raid-big-gain{color:var(--gold-ink);text-shadow:0 2px 0 #fff6cf}
.raid-jackpot .raid-big-sub{color:#7a4a17}
.raid-jackpot::after{content:'';position:absolute;top:0;bottom:0;right:6%;width:18%;background:linear-gradient(105deg,transparent,#ffffff70 50%,transparent);pointer-events:none}
.raid-oddsbar{display:flex;height:calc(16 * var(--q));min-height:10px;border:2px solid #3e211d;background:#f1e4c3;overflow:hidden}
.raid-oddsbar i{flex:none;width:var(--w);height:100%;box-shadow:inset 0 2px #ffffff55,inset -1px 0 #3e211d55}
:is(.raid-oddsbar i,.raid-dot)[data-outcome=jackpot],.raid-odd[data-outcome=jackpot] .raid-dot{background:var(--gold)}
.raid-oddsbar i[data-outcome=steal],.raid-odd[data-outcome=steal] .raid-dot{background:var(--green-fill)}
.raid-oddsbar i[data-outcome=defended],.raid-odd[data-outcome=defended] .raid-dot{background:var(--none)}
.raid-oddsbar i[data-outcome=counter],.raid-odd[data-outcome=counter] .raid-dot{background:var(--red)}
/* The outcome list gives way first: it scrolls inside its card (5 px of room at its sides for the jackpot row's frame), and
   where the browser has scroll-driven animations the edge with more rows fades. */
.raid-odds{display:grid;gap:5px;align-content:start;min-height:0;margin:-2px -5px;padding:2px 5px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-color:#c99461 transparent}
@supports (animation-timeline:scroll()){
  .raid-odds{-webkit-mask-image:linear-gradient(transparent,#000 var(--raid-fade-top),#000 calc(100% - var(--raid-fade-bottom)),transparent);
    mask-image:linear-gradient(transparent,#000 var(--raid-fade-top),#000 calc(100% - var(--raid-fade-bottom)),transparent);
    animation:raid-odds-fade linear both;animation-timeline:scroll(self)}
  @keyframes raid-odds-fade{0%{--raid-fade-top:0px;--raid-fade-bottom:min(18px,35%)}8%{--raid-fade-top:min(14px,30%)}92%{--raid-fade-bottom:min(14px,30%)}100%{--raid-fade-top:min(18px,35%);--raid-fade-bottom:0px}}
}
.raid-odd{display:grid;grid-template-columns:12px calc(42 * var(--q)) minmax(0,1fr);align-items:baseline;column-gap:8px;font:400 max(13px,calc(14 * var(--q)))/1.3 Pixeloid,monospace}
.raid-dot{display:block;width:12px;height:12px;border:2px solid #3e211d;align-self:start;margin-top:calc((1.3em - 12px) / 2)}
.raid-chance{font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.raid-what{min-width:0}
.raid-what b{font-weight:700}
.raid-amt,.raid-for{white-space:nowrap}
.raid-odd[data-outcome=steal] .raid-amt{color:var(--green)}
.raid-odd[data-outcome=counter] .raid-what{color:var(--red-ink)}
.raid-odd[data-outcome=defended] .raid-what{color:#6b5d4f}
.raid-odd[data-outcome=jackpot]{margin:0 -5px;padding:3px 5px;background:linear-gradient(90deg,#fff1b8,#ffe07a 55%,#fff1b8);border:2px solid var(--gold-edge);box-shadow:0 0 8px #ffc4288c}
.raid-odd[data-outcome=jackpot] :is(.raid-chance,.raid-what){color:var(--gold-ink);font-weight:700}
.raid-card-go{width:100%;margin-top:auto}
.raid-card-go .raid-gold-copy{gap:4px}
.raid-card-go .raid-gold-label{font-size:max(15px,calc(18 * var(--q)));letter-spacing:.04em}

/* ---------------------------------------------------------------- the confirm */
.raid-dialog.raid-confirm{width:min(calc(520 * var(--q)),calc(100vw - 24px))}
.raid-confirm-card{--a:#5fb346;--edge:#9fd27f;--tint:#f1f9e8;display:grid;gap:10px;padding:12px 14px;border:3px solid var(--edge);background:var(--tint);box-shadow:inset 0 7px var(--a)}
.raid-confirm-card[data-card=power]{--a:#f2b134;--edge:#f1cd7a;--tint:#fff7e1}
.raid-confirm-card[data-card=all_in]{--a:#e0503a;--edge:#efa392;--tint:#fff1ec}
.raid-confirm-q{padding-top:4px;font:700 max(16px,calc(20 * var(--q)))/1.3 Pixeloid,monospace;overflow-wrap:anywhere}
.raid-confirm-rows{display:grid;gap:6px}
.raid-confirm-row{display:grid;grid-template-columns:auto calc(46 * var(--q)) minmax(min-content,1fr) minmax(0,auto);align-items:center;gap:10px;padding:7px 10px;background:var(--paper);
  border:2px solid var(--rule);font-size:max(13px,calc(15 * var(--q)))}
.raid-confirm-row .raid-icon{width:22px;height:22px}
.raid-cpct{font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.raid-confirm-row b{font-weight:700;text-align:right}
.raid-confirm-row[data-tone=good] b{color:var(--green)}
.raid-confirm-row[data-tone=gold]{border-color:var(--gold-edge);background:linear-gradient(90deg,#fff1b8,#ffe07a 55%,#fff1b8)}
.raid-confirm-row[data-tone=gold] b{color:var(--gold-ink)}
.raid-confirm-row[data-tone=bad] b{color:var(--red-ink)}
.raid-fee{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:4px 12px;padding:10px 14px;background:#fff4cf;border:2px solid #e2b860}
.raid-fee-coin{width:40px;height:40px;grid-row:span 2}
.raid-fee-usd{font:700 max(22px,calc(28 * var(--q)))/1 Pixeloid,monospace}
.raid-fee-tok{font:400 max(13px,calc(15 * var(--q)))/1.2 Pixeloid,monospace;color:var(--soft)}
.raid-warn{display:flex;align-items:center;gap:12px;padding:10px 12px;background:#fff0c9;border:2px solid #e6b15a;color:#6a3a0c;font:700 max(14px,calc(15 * var(--q)))/1.35 Pixeloid,monospace}
.raid-warn .raid-icon{width:28px;height:28px}
.raid-warn small{display:block;font-weight:400;font-size:max(13px,calc(14 * var(--q)));color:#7a4b12}
.raid-buttons{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px}
.raid-go-red{display:flex;align-items:center;justify-content:center;gap:12px;min-height:60px;padding:2px 16px 6px;border:10px solid transparent;
  border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/raid-red.svg') 12 fill stretch;background:none;color:#fff9e7;font:700 max(17px,calc(19 * var(--q)))/1.1 Pixeloid,monospace;
  paint-order:stroke fill;-webkit-text-stroke:3px #5a160d;text-shadow:0 2px #5a160d;flex-wrap:wrap;min-width:0;text-align:center}
.raid-go-red .raid-icon{width:32px;height:32px}
.raid-go-sep{margin:0 -4px}
.raid-go-red:disabled{border-image-source:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/tile.svg');border-image-slice:8 fill;color:#a8987f;-webkit-text-stroke:0;text-shadow:0 2px #fff}
.raid-go-red:disabled .raid-icon{filter:grayscale(1) opacity(.45)}

/* ---------------------------------------------------------------- the raid trip's RAID button and the raider's own limit */
.raid-dock{position:fixed;left:50%;bottom:22px;z-index:56;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;width:380px;max-width:calc(100vw - 20px);
  pointer-events:none;font-family:Pixeloid,monospace}
.raid-dock[hidden]{display:none}
.raid-button{position:relative;display:flex;align-items:center;justify-content:center;gap:14px;width:340px;max-width:100%;height:84px;padding:0 18px 6px;
  border:12px solid transparent;border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/raid-red.svg') 12 fill stretch;background:none;color:#fff9e7;
  font:700 34px/1 Pixeloid,monospace;letter-spacing:.08em;paint-order:stroke fill;-webkit-text-stroke:5px #5a160d;text-shadow:0 3px #5a160d;
  filter:drop-shadow(0 6px 0 #2a0d0860) drop-shadow(0 0 16px #ff6a3c66);cursor:pointer;pointer-events:auto;touch-action:manipulation}
.raid-button-icon{width:40px;height:40px;filter:drop-shadow(0 2px 0 #5a160d)}
.raid-button:not([aria-disabled=true]):hover{filter:drop-shadow(0 6px 0 #2a0d0860) drop-shadow(0 0 22px #ff6a3c99) brightness(1.05)}
.raid-button:not([aria-disabled=true]):active{translate:0 2px}
.raid-button:focus-visible{outline:3px solid #58a7ce;outline-offset:3px}
.raid-button[aria-disabled=true]{border-image-source:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/tile.svg');border-image-slice:8 fill;color:#a8987f;-webkit-text-stroke:0;text-shadow:0 2px #fff;
  filter:drop-shadow(0 6px 0 #2a0d0840);cursor:default}
.raid-button[aria-disabled=true] .raid-button-icon{filter:grayscale(1) opacity(.45)}
.raid-dock[data-state=loading] .raid-button{opacity:.85}
.raid-why{position:relative;display:flex;align-items:center;gap:10px;max-width:100%;margin:0 0 10px;padding:8px 14px 9px 10px;background:#fff7e4;color:#4a2a14;
  box-shadow:0 -3px 0 0 var(--why-edge,#8f3a2c),0 3px 0 0 var(--why-edge,#8f3a2c),-3px 0 0 0 var(--why-edge,#8f3a2c),3px 0 0 0 var(--why-edge,#8f3a2c),0 7px 0 #22140c55;
  font:700 16px/1.2 Pixeloid,monospace;flex-wrap:wrap;justify-content:center;text-align:center;pointer-events:auto}
.raid-why::after{content:'';position:absolute;left:50%;bottom:-11px;width:16px;height:8px;transform:translateX(-50%);background:var(--why-edge,#8f3a2c);
  clip-path:polygon(0 0,100% 0,100% 25%,75% 25%,75% 50%,62% 50%,62% 100%,38% 100%,38% 50%,25% 50%,25% 25%,0 25%)}
.raid-why[hidden]{display:none}
.raid-why b{font-weight:700}
.raid-soft,.raid-why-detail{font-weight:400;color:#6b4a33}
.raid-why:is([data-rule=active_limit],[data-rule=price]){--why-edge:#6e6457}

/* ---------------------------------------------------------------- the home island's RAID tile (owner, 11 Oct 2026) */
/* RAID: PACKS' tile (packs.css .packs-entry: its frame, size, type, shine, hover and press) right under it in the left
   column, 10 px apart (8 px on phones); STAKE (stake-boost.css), when it shows too, moves one place down under it. The bold
   crossed swords over its name with a warm red glow; while the finder reads they swing. Own island in the world view
   only, while the server runs raids; never on a visit or while decorating. Like the column's other tiles it stands under
   every open window (z-index 41: packs.css says why). */
.raid-entry-root{position:fixed;left:0;top:0;width:0;height:0;z-index:41;font-family:Pixeloid,monospace;font-synthesis:none}
.raid-entry{position:fixed;left:18px;top:calc(50% + 104px);transform:translateY(-50%);box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:4px;width:96px;height:94px;margin:0;padding:4px 2px 6px;border:8px solid transparent;border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/hud.svg') 12 fill stretch;
  background:none;border-radius:0;box-shadow:none;color:#492b22;font:700 12px/1 Pixeloid,monospace;letter-spacing:.02em;cursor:pointer;
  touch-action:manipulation;overflow:hidden;isolation:isolate;filter:drop-shadow(0 3px 0 #34273733)}
.raid-entry[hidden]{display:none!important}
.raid-entry-icon{display:block;flex:none;width:44px;height:44px;image-rendering:pixelated}
.raid-entry-icon svg{display:block;width:100%;height:100%;shape-rendering:crispEdges}
.raid-entry-label{display:block;max-width:100%;overflow:hidden;white-space:nowrap}
.raid-entry::before{content:'';position:absolute;inset:-8px;z-index:-1;background:radial-gradient(circle at 50% 42%,#ff6a3c5c 0%,#ff6a3c00 62%);pointer-events:none}
.raid-entry::after{content:'';position:absolute;top:-30%;bottom:-30%;left:-60%;width:34%;transform:skewX(-18deg);background:linear-gradient(90deg,#fff0 0%,#fffbe8b3 50%,#fff0 100%);
  animation:raid-entry-shine 4.2s ease-in-out .7s infinite;pointer-events:none}
.raid-entry:focus-visible{outline:3px solid #58a7ce;outline-offset:2px}
.raid-entry:active{transform:translateY(calc(-50% + 2px))}
.raid-entry[aria-busy=true]{cursor:progress}
.raid-entry[aria-busy=true] .raid-entry-icon{animation:raid-entry-swing .45s ease-in-out infinite alternate}
@media(hover:hover) and (pointer:fine){.raid-entry:hover{filter:drop-shadow(0 3px 0 #34273733) brightness(1.07)}}
@keyframes raid-entry-shine{0%,62%{left:-60%}88%,100%{left:130%}}
@keyframes raid-entry-swing{from{transform:rotate(-9deg)}to{transform:rotate(9deg)}}
body.decorating .raid-entry{display:none!important}
body[data-wallet-locked=true]>.raid-entry-root{visibility:hidden;pointer-events:none}
body:has(.raid-entry:not([hidden])) .stake-entry{top:calc(50% + 208px)}
@media(max-width:700px){
  .raid-entry{left:10px;top:calc(44% + 80px);width:72px;height:72px;border-width:6px;gap:2px;font-size:10px;letter-spacing:0}
  .raid-entry-icon{width:32px;height:32px}
  body:has(.raid-entry:not([hidden])) .stake-entry{top:calc(44% + 160px)}
}
@media(prefers-reduced-motion:reduce){.raid-entry::after,.raid-entry[aria-busy=true] .raid-entry-icon{animation:none}.raid-entry:active{transform:translateY(-50%)}}

/* ---------------------------------------------------------------- the HUD's Shield chip and its "+" (owner, 10 Oct 2026: no
   dome; K6, 11 Oct 2026: always there while raids are open, "No shield" without one, a "+" beside it that opens the Shield
   window like the energy refill). One row in the bar's second line under its first card (BOOST, HASHRATE or ENERGY) and,
   where that line is free there (BOOST or HASHRATE first: Buy then sits under WALLET), over the next card's column too;
   on a phone the third line, beside HASHRATE. The HUD stays under every open window (it is the page's HUD layer). */
.workshop-ui[data-mode] .economy-hud .raid-badge-row{grid-row:2;grid-column:1;align-self:start;display:flex;align-items:stretch;gap:calc(4 * var(--hud-u));
  min-width:0;height:calc(30 * var(--hud-u));pointer-events:auto}
.workshop-ui[data-mode=world] .economy-hud:is(.has-boost,.has-hash) .raid-badge-row{grid-column:1/3}
.workshop-ui[data-mode] .economy-hud .raid-badge-row[hidden]{display:none}
.workshop-ui[data-mode] .economy-hud .raid-badge{position:relative;flex:1 1 auto;box-sizing:border-box;display:flex;align-items:center;justify-content:center;
  gap:calc(6 * var(--hud-u));min-width:0;height:100%;padding:0 calc(6 * var(--hud-u)) calc(2 * var(--hud-u));
  border:calc(6 * var(--hud-u)) solid transparent;border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/tile-blue.svg') 9 fill stretch;background:none;
  font:700 calc(14 * var(--hud-u))/1 Pixeloid,monospace;letter-spacing:0;color:#24476a;white-space:nowrap;cursor:pointer;touch-action:manipulation;pointer-events:auto}
/* Beside its "+" the chip keeps the first card's width (half the two columns), and grows for longer words. */
.workshop-ui[data-mode=world] .economy-hud:is(.has-boost,.has-hash) .raid-badge{flex:0 0 auto;min-width:calc(50% - 2 * var(--hud-u))}
.workshop-ui[data-mode] .economy-hud .raid-badge[hidden]{display:none}
.workshop-ui[data-mode] .economy-hud .raid-badge[data-kind=new_island]{color:#2f6a2b}
.workshop-ui[data-mode] .economy-hud .raid-badge[data-kind=none]{border-image-source:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/cream.svg');border-image-slice:12 fill;color:#9b2a1c}
.workshop-ui[data-mode] .economy-hud .raid-badge[data-kind=none]{color:#7a4b2a}
.workshop-ui[data-mode] .economy-hud .raid-badge[data-kind=none] .raid-badge-icon{filter:grayscale(.85);opacity:.7}
.workshop-ui[data-mode] .economy-hud .raid-badge-icon{width:calc(18 * var(--hud-u));height:calc(18 * var(--hud-u))}
.workshop-ui[data-mode] .economy-hud .raid-badge-time{font-variant-numeric:tabular-nums}
.workshop-ui[data-mode] .economy-hud .raid-badge-word{font-size:calc(12 * var(--hud-u))}
.workshop-ui[data-mode] .economy-hud :is(.raid-badge-time,.raid-badge-word)[hidden]{display:none}
.workshop-ui[data-mode] .economy-hud .raid-badge-alert{position:absolute;top:calc(-8 * var(--hud-u));right:calc(-6 * var(--hud-u));display:grid;place-items:center;
  width:calc(15 * var(--hud-u));height:calc(15 * var(--hud-u));min-width:14px;min-height:14px;background:#d8432a;color:#fff7df;box-shadow:0 0 0 2px #fff5df,0 0 0 4px #8f3a2c;
  font:700 max(10px,calc(11 * var(--hud-u)))/1 Pixeloid,monospace!important;pointer-events:none}
.workshop-ui[data-mode] .economy-hud .raid-badge-alert[hidden]{display:none}
/* The "+": a square gold button, the chip's height (the Buy link's frame: it sells). */
.workshop-ui[data-mode] .economy-hud .raid-badge-plus{flex:none;box-sizing:border-box;display:grid;place-items:center;width:calc(30 * var(--hud-u));height:100%;
  min-width:26px;padding:0;border:calc(6 * var(--hud-u)) solid transparent;border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/power-gold.svg') 12 fill stretch;background:none;
  color:#4a240f;cursor:pointer;touch-action:manipulation;pointer-events:auto}
.workshop-ui[data-mode] .economy-hud .raid-badge-plus svg{display:block;width:calc(14 * var(--hud-u));height:calc(14 * var(--hud-u));min-width:12px;min-height:12px;shape-rendering:crispEdges}
.workshop-ui[data-mode] .economy-hud .raid-badge-plus[hidden]{display:none}
.workshop-ui[data-mode] .economy-hud :is(.raid-badge,.raid-badge-plus):focus-visible{outline:3px solid #58a7ce;outline-offset:2px}
.workshop-ui[data-mode] .economy-hud :is(.raid-badge,.raid-badge-plus):active{translate:0 2px}
.workshop-ui:not([data-mode=world]) .economy-hud .raid-badge-row,body.decorating .economy-hud .raid-badge-row{display:none!important}
@media(hover:hover) and (pointer:fine){.workshop-ui[data-mode] .economy-hud :is(.raid-badge,.raid-badge-plus):hover{filter:brightness(1.05)}}
/* A Shield just bought: one bright pulse (the ENERGY card's refill flash). */
.workshop-ui[data-mode] .economy-hud .raid-badge.raid-badge-flash{animation:raid-badge-flash 1.1s ease-out}
@keyframes raid-badge-flash{0%,40%{filter:brightness(1.35) drop-shadow(0 0 6px #9cc3e3)}100%{filter:none}}
@media(prefers-reduced-motion:reduce){.workshop-ui[data-mode] .economy-hud .raid-badge.raid-badge-flash{animation:none}}
/* ---------------------------------------------------------------- the raids' notice (the look of game-notifications.css
   .game-message, on the page itself: above the island's bubbles and names, .island-labels z 40) */
.raid-notice{--notice-accent:#526665;--notice-badge:#e4ece3;
  position:fixed;z-index:62;inset:auto;top:var(--notice-top,104px);left:50%;transform:translateX(-50%);box-sizing:border-box;
  display:grid;grid-template-columns:40px minmax(0,1fr) 28px;align-items:start;gap:12px;
  width:500px;max-width:calc(100vw - 24px);max-height:calc(100vh - var(--notice-top,104px) - 100px);max-height:calc(100dvh - var(--notice-top,104px) - 100px);
  margin:0;padding:12px 13px 13px;border:9px solid transparent;border-radius:0;border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/cream.svg') 12 fill stretch;
  background:none;box-shadow:0 5px 0 #3d332d26,0 10px 28px #162d2a30;color:#463b2e;text-shadow:none;text-align:left;
  overflow:auto;overscroll-behavior:contain;overflow-wrap:anywhere;pointer-events:auto;font:400 13px/1.6 Pixeloid,monospace;font-synthesis:none;letter-spacing:0}
.raid-notice[hidden]{display:none}
.raid-notice :is(strong,p,button,span,b){font-family:Pixeloid,monospace;font-synthesis:none;letter-spacing:0;text-shadow:none}
.raid-notice[data-tone=hit]{--notice-accent:#873c2f;--notice-badge:#f6ddc8}
.raid-notice:is([data-tone=away],[data-tone=held]){--notice-accent:#2f5f9e;--notice-badge:#dfeefb}
.raid-notice[data-tone=good]{--notice-accent:#345d35;--notice-badge:#dceccf}
.raid-notice[data-tone=gold]{--notice-accent:#8a5216;--notice-badge:#fff1b8}
.raid-notice-symbol{width:40px;height:40px;display:grid;place-items:center;margin-top:2px;background:var(--notice-badge);color:var(--notice-accent);
  box-shadow:inset 0 -3px #495d3426;
  clip-path:polygon(5px 0,calc(100% - 5px) 0,calc(100% - 5px) 5px,100% 5px,100% calc(100% - 5px),calc(100% - 5px) calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,5px calc(100% - 5px),0 calc(100% - 5px),0 5px,5px 5px)}
.raid-notice-symbol .raid-icon{width:26px;height:26px}
.raid-notice-copy{min-width:0}
.raid-notice-title{display:block;margin:0;color:var(--notice-accent);font-size:15px;font-weight:700;line-height:1.55}
.raid-notice-body{margin:5px 0 0;color:#493e30;font-size:13px;font-weight:400;line-height:1.65}
.raid-notice-hint{margin:6px 0 0;color:#5b4d3b;font-size:13px;line-height:1.6}
.raid-notice-close{display:grid;place-items:center;width:28px;height:30px;min-width:0;padding:5px;margin:-2px -3px 0 0;
  border:0;border-radius:0;background:transparent;color:#765b40;box-shadow:none;cursor:pointer}
.raid-notice-close svg{width:14px;height:14px;fill:currentColor;stroke:none;shape-rendering:crispEdges}
.raid-notice-close:hover{background:#ecd8b8;color:#4c3825}
.raid-notice-close:focus-visible{outline:2px solid #488caf;outline-offset:1px}
.raid-notice-actions{display:flex;flex-wrap:wrap;align-items:stretch;gap:10px;margin:12px 0 1px}
.raid-notice-action{display:inline-flex;align-items:center;gap:8px;box-sizing:border-box;margin:0;padding:9px 12px;min-height:42px;min-width:0;
  border:2px solid #6f8451;border-radius:0;background:#dcecc7;color:#345330;box-shadow:0 3px 0 #a8b781;
  font:700 13px/1.5 Pixeloid,monospace;white-space:nowrap;cursor:pointer}
.raid-notice-action:focus-visible{outline:3px solid #488caf;outline-offset:3px}
.raid-notice-action .raid-icon{width:20px;height:20px}
.raid-notice-action.secondary{min-width:72px;justify-content:center;border-color:#b29a7c;background:#f4e8d3;color:#5a4632;box-shadow:0 3px 0 #d3bd98}
.raid-notice-action.secondary:hover{background:#ecdcc0}
.raid-notice-action.history:hover{background:#cfe5b4}
.director-lens :is(.raid-notice,.raid-dock){visibility:hidden!important}
.raid-away-list{display:grid;gap:6px;margin-top:8px}
.raid-away-row{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"av who" "av res";align-items:center;gap:2px 10px;padding:6px 9px;
  background:#fffaf0;border:2px solid #ecd9ae;font-size:14px;line-height:1.3}
.raid-away-avatar{grid-area:av;width:28px;height:28px;font-size:12px}
.raid-away-who{grid-area:who;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.raid-away-res{grid-area:res;white-space:nowrap}
.raid-away-res[data-tone=bad]{color:#b23a1f}
.raid-away-res[data-tone=held]{color:#2f5f9e}
.raid-away-res[data-tone=good]{color:#2f7a2b}

/* ---------------------------------------------------------------- the Defense Tower window */
.raid-tabs{flex:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:9px 12px 0;background:#fff8e2}
.raid-tab{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;min-height:calc(46 * var(--q));padding:4px 8px 6px;border:calc(7 * var(--q)) solid transparent;
  border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/cream.svg') 12 fill stretch;background:none;color:#6b5444;font:700 max(13px,calc(14 * var(--q)))/1.1 Pixeloid,monospace;letter-spacing:.04em;
  text-transform:uppercase;white-space:nowrap}
.raid-tab .raid-icon{width:20px;height:20px}
/* A longer word in another language wraps inside its tab instead of running out of it. */
.raid-tab-label{min-width:0;white-space:normal;overflow-wrap:anywhere;hyphens:auto;text-align:center}
.raid-tab[aria-selected=true]{border-image-source:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/tile-blue.svg');border-image-slice:9 fill;color:#263b4a}
.raid-tab-count{display:grid;place-items:center;min-width:22px;height:22px;padding:0 5px;background:#d8432a;color:#fff7df;font:700 13px/1 Pixeloid,monospace;box-shadow:0 0 0 2px #fff7db}
.raid-tab-notice{padding:7px 10px;background:#eef7e2;border:2px solid #9fd27f;color:#2f6a2b;font-weight:700}
.raid-tab-notice[data-tone=error]{background:#ffe5d5;border-color:#efa392;color:#873e2d}
/* Tower */
.raid-tower-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);grid-template-areas:"hero builder" "next builder" "ladder ladder";gap:10px 14px}
.raid-tower-hero{grid-area:hero;display:grid;grid-template-columns:1fr 34px 1fr;align-items:center;padding:8px 12px 10px;border:5px solid transparent;
  border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/tile-blue.svg') 8 stretch;background:linear-gradient(180deg,#bfe1fb 0%,#dff0fc 46%,#fbf3dc 78%,#fff3d4 100%) padding-box}
.raid-tower-hero[data-top=true]{grid-template-columns:1fr}
.raid-stagept{position:relative;display:grid;grid-template-columns:auto minmax(0,auto);grid-template-areas:"art lv" "art cut";align-items:center;justify-content:center;gap:0 12px;padding-top:18px}
.raid-stage-art{grid-area:art;display:grid;place-items:end center;width:calc(76 * var(--q));height:calc(64 * var(--q))}
.raid-stage-art .raid-icon{width:calc(64 * var(--q));height:calc(64 * var(--q));filter:drop-shadow(0 3px 0 #3e211d33)}
.raid-stage-img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 0 #3e211d33)}
.raid-stagept[data-kind=next] .raid-stage-art{filter:drop-shadow(0 0 10px #fff6bf)}
.raid-tag{position:absolute;top:-2px;left:-4px;padding:5px 8px 4px;background:#3e211d;color:#fff4d2;font:700 13px/1 Pixeloid,monospace;letter-spacing:.08em;text-transform:uppercase}
.raid-stagept[data-kind=next] .raid-tag{background:#f0913a;color:#2b1307}
.raid-stage-lv{grid-area:lv;align-self:end;font:700 max(16px,calc(22 * var(--q)))/1.15 Pixeloid,monospace;white-space:nowrap}
.raid-stage-lv small{font:700 max(13px,calc(14 * var(--q)))/1 Pixeloid,monospace;color:var(--muted)}
.raid-stage-cut{grid-area:cut;align-self:start;font:700 max(13px,calc(15 * var(--q)))/1.25 Pixeloid,monospace;color:var(--blue-ink);white-space:nowrap}
/* Another language's longer words wrap there instead of running past the card (English keeps its one line). */
:root[data-language]:not([data-language=en]) :is(.raid-stage-lv,.raid-stage-cut){white-space:normal;overflow-wrap:break-word}
.raid-hero-arrow{align-self:center;justify-self:center;width:30px;height:30px}
.raid-hero-arrow svg{display:block;width:100%;height:100%}
.raid-tower-next{grid-area:next;display:flex;flex-direction:column;gap:8px;padding:8px 12px 10px}
.raid-change{display:flex;align-items:center;gap:10px;min-height:40px;padding:4px 9px;background:var(--paper);border:2px solid var(--rule)}
.raid-change-icon{width:34px;height:34px;padding:5px;background:var(--blue-tint);border:2px solid var(--blue-soft)}
.raid-change strong{display:block;font:700 max(14px,calc(16 * var(--q)))/1.3 Pixeloid,monospace}
.raid-change small{display:block;font:400 max(13px,calc(13 * var(--q)))/1.3 Pixeloid,monospace;color:var(--soft)}
.raid-upgrade{display:grid;justify-items:center;gap:3px;min-height:calc(68 * var(--q));padding:6px 12px;border:calc(9 * var(--q)) solid transparent;
  border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/power-gold.svg') 12 fill stretch;background:none;color:#3a1c08;font:700 max(18px,calc(22 * var(--q)))/1.1 Pixeloid,monospace;text-shadow:0 2px #fff3b066}
.raid-upgrade:disabled{border-image-source:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/tile.svg');border-image-slice:8 fill;color:#8b7964;text-shadow:none}
.raid-upgrade-main{display:flex;align-items:center;gap:10px}
.raid-upgrade-main .raid-icon{width:26px;height:26px}
.raid-upgrade-price{display:flex;align-items:baseline;gap:9px;font-size:max(15px,calc(17 * var(--q)))}
.raid-tower-builder{grid-area:builder;display:flex;flex-direction:column;gap:8px;padding:8px 11px 10px}
.raid-job-now{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;grid-template-areas:"tag icon name left" "bar bar bar bar";align-items:center;gap:6px 8px;padding:8px 10px;
  background:#fff4cf;border:2px solid #e2b860}
.raid-job-tag{grid-area:tag;padding:4px 7px;background:#ffd23f;color:#3a1c08;outline:2px dashed #3e211d;font:700 max(12px,calc(12 * var(--q)))/1 Pixeloid,monospace;letter-spacing:.08em;text-transform:uppercase}
.raid-job-icon{width:28px;height:28px;padding:3px;background:var(--paper);border:2px solid var(--rule)}
.raid-job-now .raid-job-icon{grid-area:icon}
.raid-job-now .raid-job-name{grid-area:name;font:700 max(14px,calc(16 * var(--q)))/1.25 Pixeloid,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.raid-job-left{grid-area:left;font:400 max(14px,calc(16 * var(--q)))/1 Pixeloid,monospace;font-variant-numeric:tabular-nums;white-space:nowrap}
.raid-job-bar{grid-area:bar;height:16px;border:2px solid #5c382c;background:#efe2c0;overflow:hidden}
.raid-job-bar i{display:block;height:100%;width:var(--w);background:repeating-linear-gradient(-45deg,#ffd23f 0 8px,#f2b134 8px 16px)}
.raid-queue{display:grid;gap:4px}
.raid-job{display:grid;grid-template-columns:26px auto minmax(0,1fr) auto;align-items:center;gap:8px;min-height:38px;padding:3px 7px;background:var(--paper);border:2px solid var(--rule)}
.raid-job-place{display:grid;place-items:center;width:24px;height:24px;background:#4f88d8;color:#fff9ea;font:700 13px/1 Pixeloid,monospace}
.raid-job .raid-job-icon{width:26px;height:26px}
.raid-job .raid-job-name{font:700 max(14px,calc(15 * var(--q)))/1.2 Pixeloid,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.raid-job-end{font:400 13px/1.2 Pixeloid,monospace;color:var(--blue-ink);white-space:nowrap;text-align:right}
.raid-job[data-tower=true]{border:2px dashed var(--blue);background:var(--blue-tint)}
.raid-job[data-tower=true] .raid-job-name{color:var(--blue-ink)}
.raid-room{font:400 13px/1.3 Pixeloid,monospace;color:var(--soft);text-align:right}
.raid-ladder{grid-area:ladder}
.raid-rungs{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:6px;margin-top:6px}
.raid-rung{position:relative;display:grid;justify-items:center;gap:1px;padding:6px 3px;background:var(--paper);border:2px solid var(--rule)}
.raid-rung .raid-icon{width:32px;height:32px}
.raid-rung-lv{font:700 13px/1.2 Pixeloid,monospace;color:var(--muted)}
.raid-rung-cut{font:700 max(14px,calc(16 * var(--q)))/1.2 Pixeloid,monospace;color:var(--blue-ink)}
.raid-rung-price{font:400 13px/1.2 Pixeloid,monospace;color:var(--soft)}
.raid-rung[data-state=done]{background:#eef6fd;border-color:var(--blue-soft)}
.raid-rung[data-state=current]{outline:3px solid #f0913a;outline-offset:-1px;transform:translateY(-3px);box-shadow:0 4px 0 #c5803f40;background:#fff4d8}
.raid-rung:is([data-state=next],[data-state=queued],[data-state=building]){outline:2px dashed #e0822f;outline-offset:-1px}
.raid-rung[data-state=later]{color:#8f7d68}
.raid-rung[data-state=later] .raid-icon{filter:grayscale(.8);opacity:.55}
.raid-rung[data-state=later] .raid-rung-cut{color:#8f7d68}
/* Shield */
.raid-shield-now{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:6px 16px;padding:12px 16px;background:var(--blue-tint);border:3px solid var(--blue-soft)}
.raid-shield-now[data-on=false]{background:#fffaf0;border-color:var(--rule)}
.raid-shield-now[data-on=false] .raid-big-shield{filter:grayscale(.8);opacity:.6}
.raid-big-shield{width:64px;height:64px}
.raid-shield-words{display:grid;gap:6px;min-width:0}
.raid-shield-words strong{font:700 max(17px,calc(22 * var(--q)))/1.2 Pixeloid,monospace;color:var(--blue-ink)}
.raid-shield-words small{font:400 max(13px,calc(14 * var(--q)))/1.4 Pixeloid,monospace;color:#3d5f80}
.raid-shields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.raid-shield-opt{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:14px 12px 12px;border:3px solid var(--blue-soft);background:#f5faff;box-shadow:inset 0 7px var(--blue)}
.raid-shield-opt[data-best=true]{border-color:var(--blue);box-shadow:inset 0 7px var(--blue),0 0 0 2px #fff inset}
.raid-shield-hours{display:flex;align-items:center;gap:10px;font:700 max(22px,calc(30 * var(--q)))/1 Pixeloid,monospace;color:var(--blue-ink)}
.raid-shield-hours .raid-icon{width:34px;height:34px}
.raid-shield-ends{font:400 max(13px,calc(14 * var(--q)))/1.35 Pixeloid,monospace;color:var(--soft)}
.raid-best-tag{position:absolute;top:0;left:12px;transform:translateY(-55%);padding:4px 7px;box-shadow:0 2px 0 #24476a55;background:var(--blue);color:#fff;font:700 12px/1 Pixeloid,monospace;letter-spacing:.06em;text-transform:uppercase}
.raid-rule-line{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#fff0c9;color:#7a4b12;font:400 max(13px,calc(14 * var(--q)))/1.4 Pixeloid,monospace}
.raid-rule-line .raid-icon{width:22px;height:22px}
/* ---------------------------------------------------------------- the Shield window (the HUD's "+", K6 11 Oct 2026): the ENERGY
   window's order (the time left on a gauge, then the refills) in the raid windows' cream frame */
.raid-dialog.raid-shop{width:min(calc(620 * var(--q)),calc(100vw - 24px))}
.raid-shop-hero{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"icon words" "gauge gauge";align-items:center;gap:8px 14px;
  padding:10px 14px 8px;background:var(--blue-tint);border:3px solid var(--blue-soft)}
.raid-shop-hero[data-kind=new_island]{background:#eef8e6;border-color:#a8d48f}
.raid-shop-hero[data-kind=none]{background:var(--paper);border-color:var(--rule)}
.raid-shop-hero .raid-big-shield{grid-area:icon;width:calc(54 * var(--q));height:calc(54 * var(--q))}
.raid-shop-hero[data-kind=none] .raid-big-shield{filter:grayscale(.6);opacity:.8}
.raid-shop-words{grid-area:words;display:grid;gap:3px;min-width:0}
.raid-shop-caption{font:700 max(13px,calc(13 * var(--q)))/1.2 Pixeloid,monospace;letter-spacing:.06em;text-transform:uppercase;color:#3d5f80}
.raid-shop-time{font:700 max(20px,calc(26 * var(--q)))/1.1 Pixeloid,monospace;color:var(--blue-ink)}
.raid-shop-detail{font:400 max(13px,calc(14 * var(--q)))/1.4 Pixeloid,monospace;color:#3d5f80}
.raid-shop-hero[data-kind=new_island] :is(.raid-shop-caption,.raid-shop-time,.raid-shop-detail){color:#2f6a2b}
.raid-shop-hero[data-kind=none] .raid-shop-caption{color:var(--muted)}
.raid-shop-hero[data-kind=none] .raid-shop-time{color:#9b2a1c}
.raid-shop-hero[data-kind=none] .raid-shop-detail{color:var(--soft)}
.raid-shop-gauge{grid-area:gauge;display:grid;gap:4px;min-width:0}
.raid-shop-bar{height:16px;border:2px solid #24476a;background:#fffaf0;overflow:hidden}
.raid-shop-bar i{display:block;height:100%;width:calc(var(--fill,0) * 100%);background:repeating-linear-gradient(90deg,#4f88d8 0 10px,#3f78c8 10px 12px)}
.raid-shop-hero[data-kind=new_island] .raid-shop-bar{border-color:#2f6a2b}
.raid-shop-hero[data-kind=new_island] .raid-shop-bar i{background:repeating-linear-gradient(90deg,#6cbf4a 0 10px,#58a83a 10px 12px)}
.raid-shop-hero[data-kind=none] .raid-shop-bar{border-color:#b29a7c}
.raid-shop-ticks{position:relative;height:15px;font:400 13px/1 Pixeloid,monospace;color:var(--soft)}
.raid-shop-ticks span{position:absolute;top:0;left:calc(var(--at,0) * 100%);transform:translateX(-50%);white-space:nowrap}
.raid-shop-ticks span:last-child{transform:translateX(-100%)}
.raid-shop-add{display:grid;gap:6px}
.raid-shop-intro{text-align:left}
/* the island raided another one (owner, 12 Oct 2026): no Shield to buy until the lock ends, one line over the options */
.raid-shop-lock{display:flex;align-items:center;gap:10px;margin:0;padding:7px 12px;background:#fff7e4;border:2px solid #b07a2c;color:#5a3412;
  font:700 max(13px,calc(15 * var(--q)))/1.3 Pixeloid,monospace}
.raid-shop-lock .raid-icon{width:24px;height:24px}
.raid-shop-opts{display:grid;gap:10px;margin-top:4px}
.raid-shop-opt{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"hours ends go" "short short short";align-items:center;
  gap:4px 14px;padding:5px 8px 5px 16px;border:3px solid var(--blue-soft);background:#f5faff;box-shadow:inset 6px 0 var(--blue)}
.raid-shop-opt[data-best=true]{border-color:var(--blue)}
.raid-shop-opt[data-available=false]{background:#f7f1e6;border-color:var(--rule);box-shadow:inset 6px 0 var(--none)}
.raid-shop-hours{grid-area:hours;display:flex;align-items:center;gap:8px;min-width:calc(104 * var(--q));font:700 max(20px,calc(26 * var(--q)))/1 Pixeloid,monospace;
  color:var(--blue-ink);white-space:nowrap}
.raid-shop-hours .raid-icon{width:28px;height:28px}
.raid-shop-opt[data-available=false] .raid-shop-hours{color:#8f7d68}
.raid-shop-opt[data-available=false] .raid-shop-hours .raid-icon{filter:grayscale(.8);opacity:.6}
.raid-shop-ends{grid-area:ends;min-width:0;font:400 max(13px,calc(14 * var(--q)))/1.35 Pixeloid,monospace;color:var(--soft);overflow-wrap:anywhere}
.raid-shop-ends[data-tone=held]{color:#873e2d}
.raid-shop-go{grid-area:go;min-width:calc(150 * var(--q));min-height:calc(48 * var(--q));padding:2px 12px}
.raid-shop-opt .raid-best-tag{left:16px}
.raid-shop-short{grid-area:short;font:400 13px/1.3 Pixeloid,monospace;color:#873e2d}
.raid-shop-foot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,auto);align-items:stretch;gap:8px}
.raid-shop-foot .raid-rule-line{min-width:0}
.raid-shop-tower{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;min-height:calc(46 * var(--q));padding:2px 10px;
  border:calc(7 * var(--q)) solid transparent;border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/cream.svg') 12 fill stretch;background:none;color:var(--ink);text-align:left}
.raid-shop-tower .raid-icon{width:30px;height:30px}
.raid-shop-tower-words{display:grid;gap:2px;min-width:0}
.raid-shop-tower-words strong{font:700 max(14px,calc(16 * var(--q)))/1.2 Pixeloid,monospace}
.raid-shop-tower-words small{font:400 13px/1.3 Pixeloid,monospace;color:var(--soft)}
.raid-shop-arrow{display:block;width:22px;height:22px}
.raid-shop-arrow svg{display:block;width:100%;height:100%}
.raid-shop-tower:not(:disabled):hover{filter:brightness(1.04)}
/* Losses */
.raid-loss-total{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;background:#ffe9e0;border:3px solid #e9a28e;color:#7a2416}
.raid-loss-total strong{display:block;font:700 max(18px,calc(22 * var(--q)))/1.2 Pixeloid,monospace}
.raid-loss-total small{display:block;font:400 max(13px,calc(14 * var(--q)))/1.3 Pixeloid,monospace;color:#8a3c2a}
.raid-losses{display:grid;gap:10px}
.raid-loss{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);grid-template-areas:"who what bar";align-items:center;gap:8px 14px;padding:10px 12px;
  background:var(--paper);border:2px solid var(--rule)}
.raid-loss .raid-avatar{grid-area:who;width:40px;height:40px;font-size:16px}
.raid-loss-what{grid-area:what;display:grid;gap:3px;min-width:0}
.raid-loss-what strong{font:700 max(15px,calc(17 * var(--q)))/1.25 Pixeloid,monospace;overflow-wrap:anywhere}
.raid-loss-what small{font:400 max(13px,calc(14 * var(--q)))/1.3 Pixeloid,monospace;color:var(--soft)}
.raid-loss-hs{color:var(--red-ink);font-weight:700}
.raid-loss-bar{grid-area:bar;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:10px;font:700 max(13px,calc(15 * var(--q)))/1 Pixeloid,monospace}
.raid-track{height:14px;border:2px solid #5c382c;background:#efe2c0;overflow:hidden}
.raid-track i{display:block;height:100%;width:var(--w);background:repeating-linear-gradient(-45deg,#e0503a 0 7px,#c94430 7px 14px)}
/* K6 (11 Oct 2026): a loss runs its full time; what protects an island before a raid, and the Shield window one tap away. */
.raid-protect{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px;padding:8px 12px;background:#eef6fd;border:2px solid var(--blue-soft)}
.raid-protect-words{display:flex;align-items:center;gap:10px;flex:1 1 280px;min-width:0;color:var(--blue-ink);font:400 max(13px,calc(14 * var(--q)))/1.4 Pixeloid,monospace}
.raid-protect-words .raid-icon{width:22px;height:22px}
.raid-protect-go{flex:0 0 auto;min-height:calc(46 * var(--q))}
.raid-protect-go .raid-icon{width:20px;height:20px}
/* History */
.raid-away-strip{display:flex;align-items:center;gap:12px;padding:9px 12px;background:#eef6fd;border:2px solid var(--blue-soft);color:var(--blue-ink);font:700 max(14px,calc(15 * var(--q)))/1.35 Pixeloid,monospace}
.raid-history{display:grid;gap:6px}
.raid-hrow{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto auto;align-items:center;gap:10px;min-height:52px;padding:5px 10px;background:var(--paper);border:2px solid var(--rule)}
.raid-hrow[data-fresh=true]{border-color:#e6b15a;background:#fff8e6}
.raid-dir{display:grid;place-items:center;box-sizing:border-box;min-width:44px;height:26px;padding:0 5px;white-space:nowrap;font:700 13px/1 Pixeloid,monospace;letter-spacing:.06em;color:#fff}
.raid-hrow[data-dir=in] .raid-dir{background:#2f5f9e}
.raid-hrow[data-dir=out] .raid-dir{background:#b8541c}
.raid-hrow .raid-avatar{width:30px;height:30px;font-size:12px}
.raid-hwho{display:grid;gap:2px;min-width:0}
.raid-hwho strong{font:700 max(14px,calc(15 * var(--q)))/1.2 Pixeloid,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.raid-hwho small{font:400 13px/1.2 Pixeloid,monospace;color:var(--soft);white-space:nowrap}
.raid-res{display:inline-flex;align-items:center;gap:7px;justify-self:end;padding:4px 9px;border:2px solid;font:700 max(13px,calc(14 * var(--q)))/1.2 Pixeloid,monospace;flex-wrap:wrap;min-width:0;max-width:100%}
.raid-res .raid-icon{width:16px;height:16px}
.raid-res[data-tone=good]{border-color:#9fd27f;background:#eef7e2;color:#2f6a2b}
.raid-res[data-tone=gold]{border-color:var(--gold-edge);background:linear-gradient(90deg,#fff1b8,#ffe07a);color:var(--gold-ink)}
.raid-res[data-tone=held]{border-color:var(--blue-soft);background:var(--blue-tint);color:var(--blue-ink)}
.raid-res[data-tone=bad]{border-color:#efa392;background:#fff1ec;color:var(--red-ink)}
.raid-hwhen{min-width:92px;font:400 13px/1.2 Pixeloid,monospace;color:var(--muted);white-space:nowrap;text-align:right}
.raid-new-tag{margin-left:8px;padding:4px 6px;background:#d8432a;color:#fff7df;font:700 12px/1 Pixeloid,monospace;letter-spacing:.06em;vertical-align:2px}

/* ---------------------------------------------------------------- the result (claim-celebration.css: veil, Boot, card) */
dialog.raid-result,dialog.raid-result:modal{position:fixed;inset:0;box-sizing:border-box;width:100vw;height:100vh;height:100dvh;max-width:none!important;max-height:none!important;margin:0;padding:0;border:0;background:transparent;overflow:hidden;color:var(--ink);
  font-family:Pixeloid,monospace;font-synthesis:none;outline:none;cursor:pointer}
.raid-result::backdrop{background:transparent}
.raid-result-veil{position:absolute;inset:0;background:radial-gradient(ellipse 72% 64% at 50% 46%,#111d3961 0%,#111d39a3 70%,#0c1430b8 100%);
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0}
.raid-result-veil[data-tone=counter]{background:radial-gradient(ellipse 72% 64% at 50% 46%,#3a0f1a66 0%,#2a0d18b0 70%,#1a0710c4 100%)}
.raid-result-veil[data-tone=jackpot]{background:radial-gradient(ellipse 72% 64% at 50% 46%,#3a2a0a55 0%,#111d39a3 70%,#0c1430b8 100%)}
.raid-result-scene{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.raid-result-card{position:absolute;left:50%;top:var(--raid-card-top,62%);display:grid;justify-items:center;gap:4px;min-width:300px;max-width:calc(100vw - 24px);
  padding:8px 22px 10px;border:9px solid transparent;border-image:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/cream.svg') 12 fill stretch;box-shadow:0 5px 0 #3d332d26,0 10px 28px #0a0f2247;
  text-align:center;white-space:nowrap;opacity:0;transform:translateX(-50%) scale(.6);transform-origin:50% 0;will-change:transform,opacity;pointer-events:none}
.raid-result-card p{margin:0}
.raid-result-kicker{font:700 15px/1.2 Pixeloid,monospace;letter-spacing:.12em;text-transform:uppercase}
.raid-result-amount{display:flex;align-items:baseline;justify-content:center;gap:8px;font:700 34px/1.15 Pixeloid,monospace;font-variant-numeric:tabular-nums}
.raid-result-unit{font:700 18px/1 Pixeloid,monospace;color:var(--soft)}
.raid-result-line{font:400 15px/1.35 Pixeloid,monospace;color:#6a4a2f}
/* a Counterattack's Island Shield on the raider's own island (owner, 12 Oct 2026) */
.raid-result-shield{font:700 14px/1.3 Pixeloid,monospace;color:var(--blue-ink);text-align:center}
.raid-result-card[data-tone=success] .raid-result-kicker{color:var(--green)}
.raid-result-card[data-tone=success] .raid-result-amount{color:#2a6a26}
.raid-result-card[data-tone=jackpot]{border-image-source:url('/_a/b5a6bea5f9aa4d8c/preview/ui/frames/power-gold.svg');box-shadow:0 5px 0 #3d332d26,0 0 34px #ffc42899}
.raid-result-card[data-tone=jackpot] .raid-result-kicker{font-size:26px;letter-spacing:.14em;color:#fff6cf;paint-order:stroke fill;-webkit-text-stroke:5px #7a3e00;text-shadow:0 3px #7a3e00}
.raid-result-card[data-tone=jackpot] .raid-result-amount{color:#5a2c00}
.raid-result-card[data-tone=jackpot] .raid-result-line{color:#6a3a16}
.raid-result-card[data-tone=defended] :is(.raid-result-kicker,.raid-result-amount){color:#2f5f9e}
.raid-result-card[data-tone=defended] .raid-result-amount{font-size:30px}
.raid-result-card[data-tone=counter] .raid-result-kicker{color:var(--red-ink)}
.raid-result-card[data-tone=counter] .raid-result-amount{color:#a3261a}
.raid-result-skip{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);margin:0;font:400 13px/1 Pixeloid,monospace;color:#fff4d2cc;letter-spacing:.06em;opacity:0;pointer-events:none}

/* ---------------------------------------------------------------- the Defense Tower's bubble on the island (island-status.css job bubble) */
.island-job-bubble[data-kind=defense]{--edge:#2f5f9e;--fill:#eef6fd;--ink:#1f3d5e;--icon:#2f5f9e;--accent:#ffd96b}
.island-job-bubble[data-kind=defense][data-tone=hit]{--edge:#8f3a2c;--fill:#ffe9e0;--ink:#6e2219;--icon:#b53a26;--accent:#ffd27a}
.island-job-bubble[data-kind=defense][data-tone=locked]{--edge:#6e6457;--fill:#f3eee5;--ink:#4b443b;--icon:#7a6f63;--accent:#d8c3a1}
.island-job-bubble[data-kind=defense] .island-status-label{font-size:13px}
.island-job-bubble[data-kind=defense] .island-job-sub{font-size:11px}
.island-job-bubble[data-tone=hit] .island-job-sub{font-weight:700;opacity:1}
.island-job-count{position:absolute;top:-10px;right:-10px;display:grid;place-items:center;min-width:19px;height:19px;padding:0 4px;background:#d8432a;color:#fff7df;
  box-shadow:0 0 0 2px #fff7db,0 0 0 4px #8f3a2c;font:700 12px/1 Pixeloid,monospace}
.island-job-bubble:has(.island-job-count) .island-status-face{padding-right:14px}

/* ---------------------------------------------------------------- the leaderboard's shield on protected islands */
.board-mark{flex:none;display:grid;place-items:center;width:24px;height:24px;border:2px solid #4f88d8;background:#e9f3fc;box-shadow:inset 0 2px #f7fbff}
.board-mark svg{display:block;width:16px;height:16px;shape-rendering:crispEdges}

/* ---------------------------------------------------------------- the island hall's Quick Add row for the tower */
.hall-add-row[data-kind=defense] .hall-add-icon{background:#e3eefb;border-color:#9cc3e3}
.hall-window [data-kind=defense] :is(.hall-job-icon,.hall-add-icon) .power-icon-fill{fill:#d9d1c4}
.hall-window [data-kind=defense] :is(.hall-job-icon,.hall-add-icon) .power-icon-accent{fill:#ffd96b}

/* ================================================================ phones (the game's 700 px break) */
@media(max-width:700px){
  .raid-ph{display:inline}
  .raid-dk,.raid-dk-block{display:none!important}
  /* the window: a full sheet with the game's 8 px margin */
  .raid-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-width:10px}
  .raid-head{padding:6px 8px 6px 10px;gap:8px}
  .raid-title{font-size:17px;gap:8px;letter-spacing:.02em}
  .raid-title-icon{width:24px;height:24px}
  .raid-title-chip{font-size:13px;padding:3px 7px}
  .raid-close{width:40px;height:40px;padding:9px}
  .raid-body{padding:8px 8px 10px;gap:8px}
  .raid-foot{display:none!important}
  .raid-section-title{font-size:15px}
  /* the raid window: all three cards on one phone screen, so their risk and reward compare at a glance */
  .raid-panel .raid-head{padding:4px 8px 4px 10px}
  .raid-panel .raid-close{width:36px;height:36px;padding:8px}
  .raid-panel .raid-body{padding:5px 5px 6px;gap:5px}
  .raid-target{grid-template-columns:auto minmax(0,1fr);gap:5px 8px;padding:5px 7px}
  .raid-target .raid-avatar{width:30px;height:30px;font-size:13px;grid-row:auto;box-shadow:0 0 0 2px #a699c7,0 0 0 4px #fff6e0}
  /* a long name keeps its line: "Island Level · H/s" goes under it */
  .raid-target-name{font-size:17px;gap:0 8px;white-space:nowrap;flex-wrap:wrap}
  .raid-target-line{font-size:13px;overflow:hidden;text-overflow:ellipsis}
  /* two chips (Tower, Max Reward), each as wide as its words, the room left shared */
  .raid-stats{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,auto));justify-content:start;gap:5px}
  .raid-stat{gap:2px;padding:3px 6px 4px;min-width:0}
  .raid-stat-label{font-size:13px;letter-spacing:0;text-transform:none;font-weight:400;color:var(--soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .raid-stat-value{font-size:13px;gap:4px;flex-wrap:nowrap;overflow:hidden;text-overflow:ellipsis}
  .raid-stat-value small{font-size:13px}
  .raid-stat-value .raid-icon{display:none}
  .raid-cards{grid-template-columns:minmax(0,1fr);gap:6px}
  /* The full sheet; the three cards share its height by the outcome rows they show (--rows, raid-ui.mjs). A card never
     shrinks under its own height, so no RAID button is ever covered: its outcome list gives way instead (one too short to
     read hides its rows: the odds bar and the confirm still say them), and on a very short screen the window scrolls. */
  .raid-dialog.raid-panel{height:calc(100vh - 16px);height:calc(100dvh - 16px)}
  .raid-panel .raid-body>.raid-cards{display:flex;flex-direction:column;min-height:auto}
  .raid-panel .raid-cards>.raid-card{flex:var(--rows,1) 0 auto;min-height:auto}
  .raid-panel .raid-odds{contain:size;container:raid-odds/size;min-height:0}
  @container raid-odds (max-height:14px){.raid-odds>.raid-odd{visibility:hidden}}
  .raid-card{grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:3px 6px;padding:8px 8px 6px;box-shadow:inset 0 5px var(--a)}
  .raid-card-head{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"icon name risk";gap:6px}
  .raid-card .raid-risk{margin:0;box-shadow:none;font-size:13px;padding:3px 6px;letter-spacing:.02em;gap:5px}
  .raid-card-icon{width:22px;height:22px}
  .raid-card-name{font-size:15px}
  .raid-pips i{width:4px;height:10px}
  .raid-winbox,.raid-gain{min-height:0;padding:3px 7px 4px;gap:2px}
  .raid-winbox{flex-direction:column-reverse;justify-content:center}
  .raid-big-label{font-size:13px;letter-spacing:0}
  .raid-big-value{font-size:max(13px,min(24px,calc(100cqi / (var(--chars,3) * .8))))}
  /* You take: its label and hours on top, its H/s and dollars below (::before breaks the line); dollars that do not fit
     beside the H/s go under them, to the right */
  .raid-gain{display:flex;flex-direction:row;flex-wrap:wrap;align-items:baseline;justify-content:space-between;column-gap:6px;row-gap:0}
  .raid-gain .raid-big-label{order:1}
  .raid-big-dur{order:2;margin-left:auto}
  .raid-gain::before{content:'';order:3;flex:0 0 100%;height:0}
  .raid-big-gain{order:4;font-size:max(13px,min(18px,calc(100cqi / (var(--chars,8) * .72))))}
  .raid-big-usd{order:5;margin-left:auto}
  .raid-big-sub{display:contents;font-size:13px}
  .raid-big-sep{display:none}
  .raid-big-dur{font-size:13px;color:var(--soft);white-space:nowrap}
  .raid-big-usd{font-size:13px;color:var(--soft);white-space:nowrap}
  .raid-jackpot :is(.raid-big-dur,.raid-big-usd){color:#7a4a17}
  .raid-jackpot .raid-big-star{width:13px;height:13px}
  .raid-oddsbar{height:8px}
  .raid-odds{gap:1px}
  .raid-odd{grid-template-columns:10px 34px minmax(0,1fr);column-gap:6px;font-size:13px;line-height:1.25}
  .raid-odd.raid-dup{display:none}
  .raid-dot{width:10px;height:10px}
  .raid-card-go{min-height:40px;border-width:7px;padding:0 10px 1px;gap:8px}
  /* the price and its tokens on one line, two when a long price leaves no room */
  .raid-card-go .raid-gold-copy{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:0}
  .raid-card-go .raid-gold-label{font-size:15px;line-height:1}
  .raid-card-go .raid-coin{width:20px;height:20px}
  .raid-gold-sub{font-size:13px;line-height:1}
  .raid-panel-why{font-size:13px;line-height:1.25;padding:3px 8px;gap:8px}
  .raid-panel-note{font-size:13px;padding:3px 8px}
  .raid-panel-why .raid-icon{width:18px;height:18px}
  /* the confirm */
  .raid-dialog.raid-confirm{width:calc(100vw - 16px)}
  .raid-confirm-q{font-size:17px}
  .raid-confirm-card{padding:9px 8px;gap:8px}
  .raid-confirm-row{grid-template-columns:20px 38px minmax(min-content,1fr) minmax(0,auto);font-size:13px;padding:5px 7px;gap:2px 6px}
  .raid-confirm-row .raid-icon{width:20px;height:20px}
  .raid-fee-usd{font-size:24px}
  .raid-fee-tok{font-size:14px}
  .raid-warn{font-size:14px;padding:8px 10px;gap:10px}
  .raid-warn small{font-size:13px}
  .raid-buttons{gap:8px}
  .raid-go-red{font-size:17px;min-height:56px;padding:2px 10px 5px;gap:8px}
  .raid-go-sep{margin:0 -1px}
  .raid-go-long .raid-go-sep{display:none}
  .raid-go-long .raid-go-price{flex-basis:100%}
  .raid-cream{min-height:56px;padding:3px 12px;font-size:14px}
  /* the raid trip's RAID button */
  .raid-dock{left:10px;right:10px;bottom:max(14px,env(safe-area-inset-bottom));transform:none;width:auto;max-width:none}
  .raid-button{width:100%;height:76px;font-size:30px;gap:12px}
  .raid-button-icon{width:34px;height:34px}
  .raid-why{font-size:14px;padding:8px 10px 9px 8px;gap:8px;white-space:normal;justify-content:center;text-align:center}
  .raid-why .raid-icon{width:22px;height:22px}
  /* the HUD's Shield chip and its "+": the bar's third line in its last two columns (beside HASHRATE), the cards' height */
  .workshop-ui[data-mode] .economy-hud .raid-badge-row,
  .workshop-ui[data-mode=world] .economy-hud:is(.has-boost,.has-hash) .raid-badge-row{grid-row:3;grid-column:-3/-1;height:46px;gap:5px}
  .workshop-ui[data-mode] .economy-hud .raid-badge,
  .workshop-ui[data-mode=world] .economy-hud:is(.has-boost,.has-hash) .raid-badge{flex:1 1 auto;min-width:0;padding:0 8px 2px;gap:6px;border-width:6px;font-size:15px}
  .workshop-ui[data-mode] .economy-hud .raid-badge-word{font-size:14px}
  .workshop-ui[data-mode] .economy-hud .raid-badge-icon{width:20px;height:20px}
  .workshop-ui[data-mode] .economy-hud .raid-badge-alert{top:-7px;right:-7px;width:17px;height:17px;font-size:13px!important}
  .workshop-ui[data-mode] .economy-hud .raid-badge-plus{width:46px;border-width:6px}
  .workshop-ui[data-mode] .economy-hud .raid-badge-plus svg{width:16px;height:16px}
  /* the notice */
  .raid-notice{grid-template-columns:32px minmax(0,1fr) 24px;gap:9px;width:calc(100vw - 20px);max-width:calc(100vw - 20px);padding:10px 8px 11px;border-width:8px}
  .raid-notice-symbol{width:32px;height:34px;margin-top:3px}
  .raid-notice-symbol .raid-icon{width:22px;height:22px}
  .raid-notice-title{font-size:14px}
  .raid-notice-body{line-height:1.7}
  .raid-notice-close{width:24px;height:30px;padding:5px;margin-right:-2px}
  .raid-notice-actions{gap:8px}
  .raid-notice-action{padding:8px 10px;white-space:normal;text-align:left}
  /* Another language's longer tab words read in lower case on a phone (they fit; English stays in capitals). */
  :root[data-language]:not([data-language=en]) :is(.raid-tab,.raid-title){text-transform:none}
  .raid-away-row{font-size:13px;padding:5px 7px;gap:2px 7px}
  .raid-away-avatar{font-size:13px}
  /* the result */
  .raid-result-card{min-width:0;width:calc(100vw - 32px);padding:7px 12px 9px;border-width:8px}
  .raid-result-kicker{font-size:14px}
  .raid-result-amount{font-size:30px}
  .raid-result-unit{font-size:16px}
  .raid-result-line{font-size:14px;white-space:normal}
  .raid-result-shield{font-size:13px}
  .raid-result-card[data-tone=jackpot] .raid-result-kicker{font-size:22px;-webkit-text-stroke:4px #7a3e00}
  /* tabs */
  .raid-tabs{gap:4px;padding:6px 6px 0}
  .raid-tab{flex-direction:column;gap:3px;min-height:52px;padding:2px 2px 4px;border-width:6px;font-size:13px;letter-spacing:0}
  .raid-tab .raid-icon{width:18px;height:18px}
  .raid-tab-count{position:absolute;top:-6px;right:-4px;min-width:20px;height:20px;font-size:13px}
  /* tower */
  .raid-tower-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"hero" "next" "builder" "ladder";gap:8px}
  .raid-tower-hero{grid-template-columns:1fr 22px 1fr;padding:6px 6px 8px}
  .raid-stagept{grid-template-columns:auto;grid-template-areas:"art" "lv" "cut";justify-items:center;gap:2px;padding-top:20px}
  .raid-stage-art{width:56px;height:46px}
  .raid-stage-art .raid-icon{width:40px;height:40px}
  .raid-stage-lv{font-size:16px}
  .raid-stage-cut{font-size:13px;white-space:normal;text-align:center}
  .raid-hero-arrow{width:20px;height:20px}
  .raid-tag{font-size:13px;padding:4px 6px 3px;letter-spacing:.04em}
  .raid-job-tag{font-size:13px;letter-spacing:.02em}
  .raid-job{grid-template-columns:24px auto minmax(0,1fr);grid-template-areas:"place icon name" "place icon end"}
  .raid-job .raid-job-place{grid-area:place}.raid-job .raid-job-icon{grid-area:icon}.raid-job .raid-job-name{grid-area:name}.raid-job .raid-job-end{grid-area:end;text-align:left}
  .raid-tower-next{padding:6px 8px 8px}
  .raid-change strong{font-size:14px}
  .raid-upgrade{font-size:19px;min-height:62px}
  .raid-upgrade-price{font-size:15px}
  .raid-rungs{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
  .raid-rung{grid-template-columns:auto 1fr;justify-items:start;align-items:center;column-gap:6px;padding:5px 6px}
  .raid-rung .raid-icon{width:26px;height:26px;grid-row:span 3}
  .raid-rung-cut{font-size:14px}
  /* shield */
  .raid-shield-now{padding:9px 10px;gap:4px 10px}
  .raid-big-shield{width:48px;height:48px}
  .raid-shield-words strong{font-size:17px}
  .raid-shields{grid-template-columns:minmax(0,1fr);gap:8px}
  .raid-shield-opt{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"hours ends" "go go";align-items:center;gap:8px 12px;padding:10px 9px 9px;box-shadow:inset 0 6px var(--blue)}
  .raid-shield-hours{grid-area:hours;font-size:24px}
  .raid-shield-hours .raid-icon{width:26px;height:26px}
  .raid-shield-ends{grid-area:ends;font-size:13px}
  .raid-shield-go{grid-area:go;min-height:50px}
  .raid-shield-go .raid-gold-copy{display:flex;align-items:baseline;gap:10px}
  .raid-best-tag{display:none}
  .raid-rule-line{font-size:13px;padding:7px 9px}
  /* losses */
  .raid-loss-total{padding:8px 10px}
  .raid-loss-total strong{font-size:18px}
  .raid-loss{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"who what" "bar bar";gap:8px 10px;padding:9px}
  .raid-loss .raid-avatar{width:34px;height:34px}
  .raid-loss-what strong{font-size:15px}
  .raid-protect{padding:8px 9px}
  .raid-protect-words{flex-basis:100%;font-size:13px}
  .raid-protect-go{width:100%;min-height:48px}
  /* the Shield window */
  .raid-dialog.raid-shop{width:calc(100vw - 16px)}
  .raid-shop-hero{padding:9px 10px 8px;gap:6px 12px}
  .raid-shop-hero .raid-big-shield{width:44px;height:44px}
  .raid-shop-time{font-size:22px}
  .raid-shop-detail{font-size:13px}
  .raid-shop-ticks span[data-near]{display:none}
  .raid-shop-opts{gap:12px}
  /* a phone: the length over its end (or the server's reason) at the left, the pay button at the right */
  .raid-shop-opt{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"hours go" "ends go" "short short";gap:4px 10px;padding:7px 7px 7px 13px}
  .raid-shop-opt[data-available=false]{grid-template-areas:"hours go" "ends ends" "short short"}
  .raid-shop-hours{min-width:0;font-size:20px}
  .raid-shop-hours .raid-icon{width:24px;height:24px}
  .raid-shop-ends{font-size:13px}
  .raid-shop-lock{font-size:13px;padding:5px 8px;gap:8px}
  .raid-shop-lock .raid-icon{width:20px;height:20px}
  .raid-shop-go{align-self:center;min-width:0;min-height:54px;padding:2px 10px;gap:8px}
  .raid-shop-go .raid-coin{width:22px;height:22px}
  .raid-shop-opt .raid-best-tag{display:block;font-size:13px;letter-spacing:.02em}
  .raid-shop-opt[data-best=true]{padding-top:14px}
  .raid-shop-foot{grid-template-columns:minmax(0,1fr)}
  .raid-shop-tower{gap:10px;padding:4px 9px;min-height:50px}
  /* history */
  .raid-away-strip{font-size:14px;padding:8px 9px}
  .raid-hrow{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"dir who when" "dir res res";gap:4px 8px;padding:6px 8px}
  .raid-hrow .raid-dir{grid-area:dir;min-width:40px;align-self:center}
  .raid-hrow .raid-avatar{display:none}
  .raid-hwho{grid-area:who}
  .raid-hrow .raid-res{grid-area:res;justify-self:start;font-size:13px}
  .raid-hwhen{grid-area:when;min-width:0}
  .raid-hwho strong{font-size:14px}
  .raid-new-tag{font-size:13px}
  /* the island's tower bubble and the board marks */
  .island-job-bubble[data-kind=defense] .island-status-label{font-size:13px}
  .island-job-bubble[data-kind=defense] .island-job-sub{font-size:13px}
  .island-job-count{font-size:13px;min-width:20px;height:20px}
  .board-mark{width:22px;height:22px}
}
@media(max-width:380px){
  .workshop-ui[data-mode] .economy-hud .raid-badge{padding:0 6px 2px;font-size:14px}
  .workshop-ui[data-mode] .economy-hud .raid-badge-word{font-size:13px}
}
@media(prefers-reduced-motion:no-preference){
  .raid-jackpot,.raid-odd[data-outcome=jackpot]{animation:raid-shine 1.8s ease-in-out infinite}
  @keyframes raid-shine{50%{box-shadow:0 0 0 2px #fff6cf inset,0 0 22px #ffc428e6}}
}