/* Generated by game-rules.mjs. Edit game-rules-themes.mjs. */

:root{
  --bg:#0c161b; /* games/container/style.css :root --bg: #0c161b */
  --ink:#ebe7d8; /* games/container/style.css :root --ink: #ebe7d8 */
  --muted:#a8b9bc; /* games/container/style.css :root --muted: #a8b9bc */
  --accent:#e6b772; /* games/container/style.css :root --gold: #e6b772 */
  --line:#3a4d53; /* games/container/style.css :root --line: #3a4d53 */
  --panel:linear-gradient(140deg,#1f3138,#16262c); /* games/container/style.css .fr-entry-card,.fr-lobby,#player-name: linear-gradient(140deg,#1f3138,#16262c) */
  --display:system-ui,sans-serif; /* games/container/style.css body.fr-page: system-ui,sans-serif */
  --reading:system-ui,sans-serif; /* games/container/style.css body.fr-page: system-ui,sans-serif */
  --label:ui-monospace,"Cascadia Mono",Consolas,monospace; /* games/container/style.css :root --mono: ui-monospace,"Cascadia Mono",Consolas,monospace */
  --sheet:#0c161b; /* games/container/style.css :root --bg: #0c161b */
  --titleInk:#ebe7d8; /* games/container/style.css :root --ink: #ebe7d8 */
  --dot:#e6b772; /* games/container/style.css :root --gold: #e6b772 */
  --weight:900; /* games/container/style.css .fr-hero h1: 900 */
  --tracking:-.06em; /* games/container/style.css .fr-hero h1: -.06em */
  --casing:none; /* games/container/style.css [hidden]: none */
  --italic:normal; /* games/container/style.css .fr-place .fr-note: normal */
  --buttonBg:#e6b772; /* games/container/style.css :root --gold: #e6b772 */
  --buttonInk:#17242a; /* games/container/style.css button.primary: #17242a */
  --buttonBorder:#e6b772; /* games/container/style.css :root --gold: #e6b772 */
  --buttonRadius:6px; /* games/container/style.css button: 6px */
  --buttonShadow:none; /* games/container/style.css button: none */
  --panelInk:#ebe7d8; /* games/container/style.css :root --ink: #ebe7d8 */
  --panelMuted:#a8b9bc; /* games/container/style.css :root --muted: #a8b9bc */
  --panelBorder:#415860; /* games/container/style.css .fr-entry-card,.fr-lobby,#player-name: #415860 */
  --panelRadius:10px; /* games/container/style.css .fr-entry-card,.fr-lobby,#player-name: 10px */
  --panelShadow:none; /* games/container/style.css [hidden]: none */
  --cover-position:50% 44%;
  --motif:"▧";
}
#rules-content h2::before{content:counter(section,decimal-leading-zero);}
#rules-content ul>li::before{content:"";width:14px;height:14px;top:8px;border:1px solid var(--muted);box-shadow:inset 3px 0 0 #0003,inset -3px 0 0 #0003}
#rules-content ul>li:nth-child(5n+1)::before{background:#354149}
#rules-content ul>li:nth-child(5n+2)::before{background:#f1eee0}
#rules-content ul>li:nth-child(5n+3)::before{background:#946649}
#rules-content ul>li:nth-child(5n+4)::before{background:#c9ab76}
#rules-content ul>li:nth-child(5n+5)::before{background:#df893f}

[data-toy=freight-credit],[data-toy=freight-quay],[data-toy=freight-tender]{position:relative;margin:24px 0;height:auto;min-height:0}
.credit-board,.scene,.tender-desk{box-sizing:border-box;border:7px ridge #91703e;padding:16px;background:#142d32 url(skins/chart-room/table.webp) 50%/cover;color:#f4e2b5;overflow:hidden;position:relative;inset:auto;height:auto}
.strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;height:322px;border-bottom:6px double #96784b}
.stop,.strip{position:relative}
.stop{min-width:0;text-align:center}
.label{display:block;height:40px;font:12px/1.4 Georgia;letter-spacing:.04em}
.stop>.freight-art{width:100%;height:105px;object-fit:contain}
.freight-art{object-fit:contain}
.depot-ledger,.freighter,.works-crate{width:100%;border:0;padding:0;color:#ffe3a0;background:none;font:14px/1.2 Georgia;cursor:pointer;min-height:100px}
.works-crate img{width:100%;height:80px}
.depot-ledger img{width:100%;height:72px}
.freighter{margin-top:65px}
.freighter img{width:100%;height:115px}
.freighter[data-at=sea]{filter:drop-shadow(0 8px 4px #060f14)}
.freeport-cargo{display:block;font:14px/1.4 Georgia;padding-top:16px}
.dock-coins{min-height:30px;text-align:center;font:600 16px/1.5 Georgia;padding-top:10px;color:#ffe0a0}
.dock-receipt{font:15px/1.4 Georgia;text-align:center;padding:10px 0}
.manifest-stamp{display:block;margin:4px auto;padding:10px 16px;border:2px double #d5b374;background:#3d2b21;color:#f5deb4;font:14px Georgia;cursor:pointer}
.dock-heading{text-align:center;font:700 16px Georgia;letter-spacing:.1em;padding:5px}
.bid-counter{display:flex;justify-content:center;align-items:center;height:68px;gap:12px}
.bid-counter button{width:44px;height:44px;border:3px ridge #ad8b4c;background:#514229;color:#fff1c6;font:26px Georgia;cursor:pointer}
.bid-amount{width:70px;text-align:center;color:#ffe3a0;font:32px Georgia;font-variant-numeric:tabular-nums}
.tender-seal{display:block;width:185px;height:62px;margin:0 auto 12px;border:4px double #8c2721;background:#ddc894;color:#4a251b;font:700 16px Georgia;cursor:pointer;transform-origin:50% 100%}
.tender-seal[aria-pressed=true]{background:#ae8e61;rotate:-3deg}
.tender-slips{display:flex;justify-content:center;gap:14px;height:108px}
.sealed-slip{width:44%;max-width:160px;height:92px;border:2px solid #b19159;background:linear-gradient(155deg,#ebd5a4 49%,#b6a079 50%,#dac397 52%);color:#3a3025;font:16px/1.4 Georgia;cursor:pointer}
.sealed-slip.opened{background:#f0dfb6;rotate:3deg}
.seller-decisions{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.seller-decisions button{min-height:36px;border:2px ridge #ba995e;background:#243b3b;color:#fbe0a3;font:14px Georgia;padding:5px 9px;cursor:pointer}
.credit-board{display:grid;grid-template-columns:1fr 1fr;gap:8px;grid-template-rows:70px 80px 36px auto}
.interest-calendar,.lender-ledger{border:3px solid #937043;padding:6px;font:16px/1.4 Georgia;cursor:pointer}
.lender-ledger{background:#382b20;color:#ffe1a3}
.interest-calendar{background:#d6c39b;color:#3a2b20;border-top:10px solid #734d35}
.iou-slips{grid-column:1/-1;display:flex;justify-content:center;gap:12px}
.iou-slip{width:125px;border:0;border-top:7px solid #a27942;background:#e4d3ac;color:#392b21;rotate:-3deg;font:16px/1.4 Georgia;cursor:pointer}
.credit-board>.dock-coins,.credit-board>.dock-receipt{grid-column:1/-1}
[data-toy=freight-discoveries]{position:absolute;justify-content:space-between;align-items:start;pointer-events:none;z-index:1;inset:0;width:100%;height:100%;display:block}
.header-crate.open img{transform:translateY(-12px) rotate(-15deg)}
.cargo-symbol{position:absolute;inset:30% 20%;background:#112b33;color:#ffd988;font:28px Georgia;opacity:0}
.header-crate.open .cargo-symbol{opacity:1}
.cover-copy{pointer-events:none}
.cover-copy a{pointer-events:auto}



/* Temporary puff and eyelid, wired to separate painted overlays requested in art-wanted.md. */.header-tug::after{content:"";position:absolute;left:40%;top:0;width:30px;height:28px;border-radius:50%;background:#dbd6c1 url(rules-art/rules-tug-puff.webp) 50%/contain;opacity:0}
.tug-puff::after{animation:harbour-puff .7s ease-out}
.header-pelican::after{content:"";position:absolute;inset:0;background:url(rules-art/rules-pelican-blink.webp) 50%/contain no-repeat;opacity:0}
.pelican-shift::after{animation:harbour-blink .55s steps(1)}
@keyframes harbour-blink{0%{opacity:0}
65%{opacity:0}
to{opacity:0}
25%{opacity:1}}
.pelican-shift{animation:harbour-bird .55s ease-out}
.cargo-arrival{animation:harbour-arrive .5s ease-out}
.slip-fold{animation:harbour-fold .4s ease-out}
.dock-shake{animation:harbour-shake .25s ease-out}
@keyframes harbour-arrive{0%{translate:-28px 0;opacity:.2}}
@keyframes harbour-crossing{0%{translate:-25px 0;rotate:-4deg}
60%{translate:25px -6px;rotate:3deg}
to{rotate:0deg}}
@keyframes harbour-fold{50%{transform:perspective(350px) rotateX(35deg)}}
@keyframes harbour-shake{25%{translate:-4px 0}
75%{translate:4px 0}}
@keyframes harbour-puff{0%{opacity:0;scale:.4}
30%{opacity:.7}
to{opacity:0;translate:8px -30px;scale:1.5}}
@keyframes harbour-bird{25%{translate:2px 4px;scale:1 .95}
75%{translate:-2px 0}}
[data-toy] button:focus-visible{outline:3px solid #ffd889;outline-offset:3px}
@media(max-width:560px){.credit-board,.scene,.tender-desk{padding:10px;border-width:4px}
.strip{gap:4px}
.label{font-size:11px;letter-spacing:0}
.stop>.freight-art{height:95px}
.depot-ledger,.freighter,.works-crate{font-size:12px}
.dock-coins{font-size:15px}
.seller-decisions button{font-size:13px;padding:4px 6px}}
.voyage-water{position:absolute;left:0;right:0;bottom:0;height:95px;pointer-events:none;background:linear-gradient(transparent,#0c3b4677)}
.voyage-water .freighter{position:absolute;left:50%;bottom:0;width:25%;height:95px;min-height:0;margin:0;pointer-events:auto}
.voyage-water .freighter img{height:60px}
.ship-crossing{animation:none}



/* Portrait is the temporary stand-in for a full pelican with feet; freighter for tug. */.price-track{display:block;position:relative;height:25px;border-bottom:2px solid #b89052;background:repeating-linear-gradient(90deg,#192e31 0 24%,#c6a773 24% 25%)}
.price-marker{position:absolute;top:0;width:25%;background:#c8a564;color:#211e18}
.payment-coin{position:absolute;left:40%;top:160px;width:26px;height:26px;border:3px ridge #d0a55c;border-radius:50%;background:#b7924b url(rules-art/rules-coin.webp) 50%/cover;color:#302617;text-align:center;font:16px Georgia;pointer-events:none;animation:quay-payment .5s ease-out both}
@keyframes quay-payment{to{translate:-90px 70px;opacity:0}}
@media(prefers-reduced-motion:reduce){.payment-coin{display:none}}
[data-toy]{overflow:clip;min-width:0;max-width:100%;overflow-wrap:anywhere}
[data-toy] [hidden]{display:none!important}
.cover{container-type:size;overflow:clip;--iw:max(100cqw,150cqh);--ih:max(100cqh,66.666667cqw)}
.header-crate[data-found].open .cargo-symbol{opacity:1}
.header-pelican[data-found]::after,.header-tug[data-found]::after{visibility:visible}
.dock-receipt,.seller-decisions{min-height:0}
.cover .art-hit{background:none;border:0;padding:0;outline:0;cursor:default}
.art-hit:hover{cursor:pointer}
.art-hit:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.art-hit::after,.art-hit::before,.art-hit>*{opacity:0;visibility:hidden}
.art-hit[data-found]::after,.art-hit[data-found]>span{visibility:visible}
.header-tug[data-found]{background:url(rules-art/rules-tug.webp) 50%/contain no-repeat}
.header-pelican[data-found]{background:url(rules-art/rules-pelican.webp) 50%/contain no-repeat}
.cover-hit{position:absolute;inset:auto;left:calc((100cqw - var(--iw)) * .5 + var(--iw) * var(--x));top:calc((100cqh - var(--ih)) * .44 + var(--ih) * var(--y));width:calc(var(--iw) * var(--w));height:calc(var(--ih) * var(--h));z-index:1}
[data-toy] *{transition:transform .3s,translate .3s,opacity .3s}
.cover-hit>button{width:100%;height:100%}
@media(prefers-reduced-motion:reduce){[data-toy],[data-toy] *{animation:none!important;transition:none!important}}
