/* The entry window (wallet-gate.mjs): our logo, three steps (Wallet, Sign in, Your island), the
   detected wallets (the free sign-in signature follows Connect at once), the wait for access, the island claim with
   its one-time entry ticket, and the pause card of a player who already has an island. */
.wallet-gate.resource-window{--r:1px;width:min(520px,calc(100vw - 28px));max-height:calc(100dvh - 28px);border-width:12px;overflow:hidden;box-shadow:0 18px 50px #050b2a73}
.wallet-gate .wallet-entry-body{display:flex;flex-direction:column;align-items:stretch;gap:13px;padding:14px 30px 18px;text-align:center}
.wallet-gate .wallet-entry-logo{display:block;width:196px;height:auto;align-self:center;margin:2px 0 -2px;flex-shrink:0;user-select:none;filter:drop-shadow(0 3px 0 #e7d3a6)}
.wallet-gate[data-step="2"] .wallet-entry-logo,.wallet-gate[data-step="3"] .wallet-entry-logo{width:150px}
.wallet-entry-steps{list-style:none;display:flex;gap:6px;justify-content:center;align-items:center;margin:0;padding:0;color:#8d8066;font:400 10px/1.4 Pixeloid,monospace}
.wallet-entry-steps li{display:flex;align-items:center;gap:6px}
.wallet-entry-steps li+li::before{content:'';display:block;width:18px;height:2px;background:#d5c7a0}
.wallet-entry-steps li.complete+li::before{background:#8fb27f}
.wallet-entry-step-mark{display:grid;place-items:center;width:18px;height:18px;flex-shrink:0;font:700 9px/1 Pixeloid,monospace;color:#8d8066;background:#f3e7c6;box-shadow:inset 0 0 0 2px #d5c7a0}
.wallet-entry-steps .current{color:#2f5a7a;font-weight:700}
.wallet-entry-steps .current .wallet-entry-step-mark{color:#fff;background:#3f86b8;box-shadow:inset 0 0 0 2px #24597f,0 2px 0 #9cc6e0}
.wallet-entry-steps .complete{color:#4f7a50}
.wallet-entry-steps .complete .wallet-entry-step-mark{color:#fff;background:#5d9459;box-shadow:inset 0 0 0 2px #3d6a3a}
.wallet-gate .wallet-entry-title{margin:0;font:700 clamp(20px,4vw,25px)/1.3 Pixeloid,monospace;color:#432c26;letter-spacing:0;text-wrap:balance}
.wallet-gate .wallet-entry-copy{font-size:13px;line-height:1.7;color:#735b42;margin:0;text-wrap:balance}
.wallet-gate .wallet-entry-copy:empty{display:none}
/* The wallet's Early Access standing (launch.eligible), a small pixel badge under the title. */
.wallet-gate .wallet-entry-badge{align-self:center;margin:-3px 0 0;padding:6px 11px 5px;font:700 11px/1.3 Pixeloid,monospace;letter-spacing:.02em}
.wallet-entry-badge[data-tone=early_access]{color:#fff;background:#3d7a3a;box-shadow:inset 0 0 0 2px #285326,0 3px 0 #bcd8a9}
.wallet-entry-badge[data-tone=not_listed]{color:#6b4316;background:#fbe2b8;box-shadow:inset 0 0 0 2px #cf9a52,0 3px 0 #ecd6ad}
/* The claim's green line above its title: the wallet is in (the same green as the Early Access badge). */
.wallet-gate .wallet-entry-cheer{align-self:center;margin:-2px 0 -5px;padding:6px 12px 5px;font:700 12px/1.3 Pixeloid,monospace;letter-spacing:.02em;color:#fff;background:#3d7a3a;box-shadow:inset 0 0 0 2px #285326,0 3px 0 #bcd8a9}
/* The connect step's one line about the signature that follows Connect. */
.wallet-gate .wallet-entry-assure{margin:-3px 0 0;font:400 11px/1.6 Pixeloid,monospace;color:#5f7550;text-wrap:balance}
.wallet-entry-content,.wallet-choices{display:grid;gap:11px}
.wallet-detected-list{display:grid;gap:7px;max-height:236px;overflow-y:auto;overscroll-behavior:contain;padding:3px}
.wallet-choice{display:flex;align-items:center;gap:12px;width:100%;min-height:51px;background:#f4e8c5;border:2px solid #c9b18c;box-shadow:0 2px #d5c6a2,inset 0 0 0 2px #fff8df;color:#49382d;text-align:left;padding:8px 12px;font:400 13px/1.4 Pixeloid,monospace;cursor:pointer}
.wallet-choice[aria-pressed=true]{border-color:#577d66;background:#e3ebc8;box-shadow:0 2px #93ae81,inset 0 0 0 2px #f7ffdf}
.wallet-choice[aria-pressed=true]::after{content:'✓';content:'✓'/'';display:grid;place-items:center;width:20px;height:20px;flex-shrink:0;color:#fff;background:#5d9459;box-shadow:inset 0 0 0 2px #3d6a3a;font:700 11px/1 Pixeloid,monospace}
.wallet-choice:hover:not(:disabled){filter:brightness(1.035)}
.wallet-choice-icon{position:relative;display:grid;place-items:center;width:28px;height:28px;flex-shrink:0;color:#446652;background:#d5dfb6;font-size:16px;font-weight:700}
.wallet-choice-icon img{display:block;width:28px;height:28px;object-fit:contain}
.wallet-choice-label{flex:1;min-width:0;overflow-wrap:anywhere}
.wallet-entry-action{width:100%;min-height:49px;font:700 14px/1.5 Pixeloid,monospace;white-space:normal}
.wallet-entry-secondary{min-height:34px;font-size:11px;font-weight:400;background:none;border:0;text-decoration:underline;text-underline-offset:4px}
/* Check again while a countdown runs: a quiet cream button under the card (Enter the island is the blue one). */
.wallet-gate .wallet-entry-quiet:not(:disabled){border-image-source:url('../ui/frames/cream.svg');color:#5b4632}
.wallet-entry-account{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:2px solid #d3c298;background:#f4e8c5;text-align:left;font-size:11px;overflow-wrap:anywhere}
.wallet-entry-account strong{font-size:12px;color:#40644d;white-space:nowrap}
.wallet-gate .wallet-entry-foot{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px 12px;margin:-2px 0 0;font:400 10px/1.6 Pixeloid,monospace;color:#867255}
.wallet-gate .wallet-entry-foot:empty{display:none}
/* The footer's chips: the network on the connect step, the signed-in wallet after it (a green light, like the ticket's chain). */
.wallet-network-note,.wallet-entry-playing{display:inline-flex;align-items:center;gap:7px;color:#867255;font:400 10px/1.6 Pixeloid,monospace}
.wallet-network-note::before,.wallet-entry-playing::before{content:'';width:6px;height:6px;flex-shrink:0;background:#b9e34f;box-shadow:0 0 0 2px #5f7f22}
.wallet-entry-playing strong{color:#40644d;font-weight:700}
.wallet-gate .wallet-entry-foot .wallet-entry-secondary{width:auto;min-height:24px;padding:0 2px;font-size:10px;color:#6d5a43;cursor:pointer}
.wallet-gate .wallet-entry-foot .wallet-entry-secondary:disabled{cursor:default}
.wallet-gate .wallet-entry-status{font-size:12px;line-height:1.65;margin:0;overflow-wrap:anywhere}
.wallet-gate .wallet-entry-status[data-error=true]{color:#9a3c31;background:#f8e0cd;border:1px solid #d19a76;padding:9px}
.wallet-gate .wallet-entry-status:empty,.wallet-gate [hidden]{display:none!important}
/* The wait for access: what opens, a live countdown (or "Opening soon") and the opening time, once. */
.wallet-launch-wait{display:grid;gap:5px;padding:13px 14px 14px;background:#fffaf0;border:2px solid #d6c39a;box-shadow:inset 0 0 0 3px #fffdf6,0 3px 0 #e6d6ad;color:#4a3828}
.wallet-gate .wallet-wait-label{margin:0;font:700 10px/1.4 Pixeloid,monospace;letter-spacing:.14em;text-transform:uppercase;color:#85694b}
.wallet-gate .wallet-wait-count{margin:1px 0 2px;font:700 clamp(21px,7vw,30px)/1.15 Pixeloid,monospace;color:#2f4f6f;text-shadow:0 2px 0 #dbe7f1;font-variant-numeric:tabular-nums}
.wallet-launch-wait[data-ready=true] .wallet-wait-count{color:#2f5a33;text-shadow:0 2px 0 #d9ead0}
.wallet-gate .wallet-wait-when{margin:0;font-size:11px;line-height:1.6;color:#6d5a43;text-wrap:balance}
.wallet-no-provider{font-size:12px;line-height:1.7;padding:12px;background:#f3e8cf}
/* A phone without a wallet: the game in a wallet app's own browser (wallet-gate.mjs walletAppLinks). */
.wallet-app-links{display:grid;gap:8px}
.wallet-app-link{box-sizing:border-box}
/* WalletConnect stays inside the entry dialog so the phone handoff and QR remain accessible in its top layer. */
.wallet-connect-pairing,.wallet-connect-options{display:grid;gap:9px;justify-items:stretch}
.wallet-connect-qr{display:block;box-sizing:border-box;width:min(240px,100%);height:auto;justify-self:center;background:#fff;border:8px solid #fff;image-rendering:pixelated}
.wallet-connect-link{font-size:10px;min-height:38px}
.wallet-gate:has(.wallet-connect-pairing) .wallet-entry-logo{width:120px}
.wallet-gate:has(.wallet-connect-pairing) .wallet-entry-body{gap:9px;overflow-y:auto;overscroll-behavior:contain;max-height:calc(100dvh - 76px)}
@media(max-height:690px){.wallet-connect-qr{width:min(200px,100%)}}
/* Your island: its name (the player's) and the one-time entry ticket. */
.wallet-claim-form{display:grid;gap:12px;text-align:left}
.wallet-name-form{display:grid;gap:7px;text-align:left}
.wallet-name-label{font:700 10px/1.4 Pixeloid,monospace;letter-spacing:.14em;text-transform:uppercase;color:#85694b}
.wallet-name-input{box-sizing:border-box;width:100%;min-height:48px;padding:11px 12px;border:2px solid #b6a17c;background:#fff9e9;box-shadow:inset 0 2px #e1d4b0;color:#3f3028;font:400 15px/1.5 Pixeloid,monospace;border-radius:0}
.wallet-name-input:disabled{opacity:.7}
/* A name that breaks the length rule, or Pay pressed without one: the field turns red and says why under it. */
.wallet-name-form[data-error=true] .wallet-name-input{border-color:#b9473a;background:#fff1ea;box-shadow:inset 0 2px #f3cbbd}
.wallet-name-form[data-error=true] .wallet-name-label{color:#a34835}
.wallet-gate .wallet-name-form[data-error=true] .wallet-name-input:focus-visible{outline-color:#b9473a}
.wallet-name-hint{font:700 11px/1.6 Pixeloid,monospace;color:#7b694c}
.wallet-name-hint[data-error=true]{color:#a34835}
.wallet-gate .wallet-name-later{text-align:center;font-size:10px;line-height:1.7;color:#7b694c}
.wallet-fee-ticket{position:relative;display:grid;gap:9px;padding:12px 16px 13px;background:#fffaf0;border:2px solid #b98651;box-shadow:0 3px 0 #d6b47a,inset 0 0 0 3px #fffdf6,inset 0 0 0 5px #efdcb1;color:#4a3828}
.wallet-fee-ticket::before,.wallet-fee-ticket::after{content:'';position:absolute;top:calc(50% - 7px);width:8px;height:14px;background:#fff5d9;border:2px solid #b98651}
.wallet-fee-ticket::before{left:-2px;border-left:0}
.wallet-fee-ticket::after{right:-2px;border-right:0}
.wallet-fee-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.wallet-fee-tag{padding:4px 8px 3px;font:700 9px/1.2 Pixeloid,monospace;letter-spacing:.14em;color:#fff;background:#3f86b8;box-shadow:inset 0 0 0 2px #24597f,0 2px 0 #9cc6e0}
.wallet-fee-chain{display:flex;align-items:center;gap:6px;font:400 10px/1.4 Pixeloid,monospace;color:#7b694c}
.wallet-fee-chain::before{content:'';width:8px;height:8px;background:#b9e34f;box-shadow:0 0 0 2px #5f7f22}
.wallet-fee-amounts{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;padding:9px 2px 8px;border-top:2px dashed #e2cb98;border-bottom:2px dashed #e2cb98}
.wallet-fee-usd{font:700 32px/1 Pixeloid,monospace;color:#2f4a2a;text-shadow:0 2px 0 #dcebc4}
.wallet-fee-eth{font:700 13px/1.4 Pixeloid,monospace;color:#34546c}
.wallet-fee-eth[data-state=loading]{color:#9a8a6c;animation:wallet-fee-wait 1.2s steps(2,end) infinite}
.wallet-fee-eth[data-state=error]{color:#9a3c31}
@keyframes wallet-fee-wait{50%{opacity:.45}}
.wallet-fee-points{display:grid;gap:5px;margin:0;padding:0;list-style:none;font-size:11px;line-height:1.55;color:#5b4a37}
.wallet-fee-points li{position:relative;padding-left:17px}
.wallet-fee-points li::before{content:'';position:absolute;left:1px;top:5px;width:6px;height:6px;background:#5d9459;box-shadow:0 0 0 2px #d9ead0}
/* A payment this browser opened but never saw answered: the warning and the explicit "pay again" confirmation. */
.wallet-fee-maybe{display:grid;gap:9px;padding:11px 12px;background:#fbe6c4;border:2px solid #c9893f;box-shadow:inset 0 0 0 2px #fff4dc;color:#5e3a17;text-align:left}
.wallet-gate .wallet-fee-maybe-text{margin:0;font-size:12px;line-height:1.65}
.wallet-fee-maybe-confirm{display:flex;align-items:flex-start;gap:9px;font:700 11px/1.55 Pixeloid,monospace;color:#5e3a17;cursor:pointer}
.wallet-fee-maybe-confirm input{flex-shrink:0;width:18px;height:18px;margin:1px 0 0;accent-color:#3d6a3a}
/* Pay again pressed without the confirmation: the confirmation is what is missing. */
.wallet-fee-maybe[data-attention=true] .wallet-fee-maybe-confirm{color:#9a3c31;outline:2px solid #c45a46;outline-offset:3px}
.wallet-fee-paid{font-size:11px;line-height:1.6;color:#6d5a43;text-align:center}
.wallet-fee-paid summary{cursor:pointer;text-decoration:underline;text-underline-offset:4px;list-style-position:inside}
.wallet-fee-paid[open]{display:grid;gap:8px;padding:10px;background:#f6ecd2;text-align:left}
.wallet-fee-paid[open] summary{text-align:center}
.wallet-fee-hash{min-height:40px;font-size:11px}
.wallet-fee-paid .wallet-entry-secondary{justify-self:center}
/* A disabled control is a moment's wait with its own words (Paying…, Checking…): a plain cursor, never a spinning one
   over a control that waits for the player (owner, 7 Oct 2026). */
.wallet-gate button:disabled{cursor:default;opacity:.6}
.wallet-gate button[aria-busy=true]{cursor:progress}
.wallet-gate button:focus-visible,.wallet-gate input:focus-visible,.wallet-gate a:focus-visible,.wallet-gate summary:focus-visible{outline:3px solid #447a76;outline-offset:3px}
body[data-wallet-locked=true]>.workshop-ui,body[data-wallet-locked=true]>.social-ui,body[data-wallet-locked=true]>.plot-actions{visibility:hidden;pointer-events:none}
/* The pause card of a player who already has an island (data-mode=pause): over the island itself, small and calm. Two
   pixel bars, the message and the wallet's short address; no logo, no steps, no wallet list, no fee. */
.wallet-gate.resource-window[data-mode=pause]{width:min(400px,calc(100vw - 28px))}
.wallet-gate[data-mode=pause] .wallet-entry-body{gap:12px;padding:22px 26px 18px}
.wallet-gate[data-mode=pause] .wallet-entry-content{order:-1}
.wallet-gate[data-mode=pause] .wallet-entry-title{font-size:clamp(18px,4.6vw,21px);line-height:1.45}
.wallet-pause-mark{display:block;justify-self:center;width:44px;height:44px;background:linear-gradient(90deg,transparent 13px,#3f86b8 13px 19px,transparent 19px 25px,#3f86b8 25px 31px,transparent 31px) center/44px 22px no-repeat,#e9f2f8;box-shadow:inset 0 0 0 3px #9cc6e0,0 3px 0 #d6c39a;animation:wallet-pause-breathe 2.6s ease-in-out infinite}
@keyframes wallet-pause-breathe{50%{opacity:.62}}
/* The art behind the entry window while the island is not drawn yet (wallet-gate.mjs showScene): the night picture of
   a brand-new personal island through the game's own opening camera (camera.mjs home), centred and covering as the
   game's view does, so the window stands over the island's centre and fades onto the same island once it is drawn. A
   viewport narrower than the game's phone threshold (aspect < .85) takes the phone camera's picture; #192359 shows
   until a picture arrives. Over it a gentle pixel rain in two layers (the far one smaller and slower), moved by the
   compositor alone. No words and no game data. */
.wallet-entry-scene{position:fixed;inset:0;overflow:hidden;pointer-events:none;user-select:none;background:#192359 url('../ui/entry-night-landscape.webp') 50% 50%/cover no-repeat;transition:opacity .6s ease}
@media(max-aspect-ratio:17/20){.wallet-entry-scene{background-image:url('../ui/entry-night-portrait.webp')}}
@media(aspect-ratio:17/20){.wallet-entry-scene{background-image:url('../ui/entry-night-landscape.webp')}}
.wallet-entry-scene[data-leaving=true]{opacity:0}
.wallet-scene-rain{--tile:240px;--fall:.82s;position:absolute;left:0;right:0;bottom:0;top:calc(-1 * var(--tile));background:url('../ui/entry-rain.svg') 0 0/var(--tile) var(--tile) repeat;will-change:transform;animation:wallet-scene-rain var(--fall) linear infinite}
.wallet-scene-rain-far{--tile:160px;--fall:.95s;background-image:url('../ui/entry-rain-far.svg')}
@keyframes wallet-scene-rain{to{transform:translate3d(0,var(--tile),0)}}
/* Over the art the window needs no blurred page behind it; a soft vignette keeps it in focus over the busy island. */
.wallet-gate[data-scene=true]::backdrop{background:radial-gradient(ellipse 72% 78% at 50% 50%,#0a14400d 25%,#0a144052);backdrop-filter:none}
@media(max-width:540px){.wallet-gate .wallet-entry-body{padding:12px 14px 16px;gap:11px}.wallet-gate .wallet-entry-logo{width:164px}.wallet-gate .wallet-entry-copy{font-size:12px}.wallet-choice{font-size:12px}.wallet-entry-account{font-size:10px}.wallet-entry-steps{gap:4px}.wallet-entry-steps li+li::before{width:10px}.wallet-fee-usd{font-size:28px}.wallet-fee-ticket{padding:11px 13px 12px}.wallet-launch-wait{padding:12px 10px 13px}}
@media(max-height:690px){.wallet-gate .wallet-entry-logo{width:150px}.wallet-gate .wallet-entry-body{gap:10px;padding-top:10px}.wallet-detected-list{max-height:166px}}
/* No motion for players who ask for none: the rain stands still, the pause mark too. */
@media(prefers-reduced-motion:reduce){.wallet-fee-eth[data-state=loading]{animation:none}
  .wallet-scene-rain,.wallet-pause-mark{animation:none}.wallet-entry-scene{transition:none}}
.wallet-recovery{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.wallet-recovery input{min-width:0;flex:1 1 260px;font:inherit;padding:10px;background:#fffaf0;border:1px solid #c4a879;color:#452b1e}
.wallet-transaction-state{margin:8px 0 0;font-size:14px;color:#634c30}
.wallet-referrals{padding:16px;margin-top:16px}.wallet-referral-address{overflow-wrap:anywhere;font-size:13px}.wallet-referrals>.resource-action{margin:6px 8px 6px 0}.reward-estimate-pending{font-size:17px!important;color:#795d3c}.reward-status[data-status=preparing]{color:#795d3c;background:#f5e4ba}
.wallet-recovery[hidden]{display:none}
.wallet-season-notice{padding:10px 12px;margin:10px 0;border-left:4px solid #aa632c;background:#f8e7c1;color:#603b1d;font-size:13px;line-height:1.6}.wallet-season-notice[hidden]{display:none}
.wallet-pc-picker .wallet-season-notice{margin:0;flex-shrink:0}
.wallet-pc-picker{--u:min(1px,.13vw);inset:52px 0 20px;width:min(1040px,calc(100vw - 32px));height:fit-content;max-height:calc(100dvh - 76px)}
.wallet-pc-picker .pc-picker-body{position:relative;top:0;height:auto;max-height:calc(100dvh - 76px);display:flex;flex-direction:column;gap:12px;padding:64px 24px 20px}
.wallet-pc-picker .pc-picker-body::before{bottom:0}
.wallet-pc-picker .pc-picker-subtitle{position:static;font-size:13px;flex-shrink:0}
/* Rows follow their cards, never a fixed height. Island lists (the wallet island) use the shelf of resource-panels.css. */
.wallet-pc-picker .pc-picker-grid{height:auto;min-height:0;max-height:calc(100dvh - 280px);grid-auto-rows:max-content;overflow:auto;align-content:start;flex:1 1 auto}
.wallet-pc-picker .pc-picker-start{position:relative;inset:auto;transform:none;align-self:center;flex-shrink:0;width:min(100%,336px);font-size:17px;white-space:normal}
.wallet-pc-picker .pc-picker-status{position:static;transform:none;width:auto;max-width:100%;font-size:14px;margin:0;flex-shrink:0}
/* Where a wallet without game tokens gets them (prebuilt/picker.mjs tokenHelp). */
.wallet-pc-picker .pc-picker-token-link{color:#2f5a7a;font-weight:700;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.wallet-pc-picker .pc-picker-recovery{font-size:14px;line-height:1.6;flex-shrink:0;margin:0}
.wallet-pc-picker:has(.pc-picker-recovery:not([hidden])) .pc-picker-grid{display:none}
@media(max-width:700px){.wallet-pc-picker{--u:.8px;width:calc(100vw - 20px)}.wallet-pc-picker .pc-picker-body{padding:52px 12px 14px}.wallet-pc-picker .pc-picker-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:max-content}}
