:root { --ink:#292744; --panel:#49362f; --cream:#fff0bb; }
    * { box-sizing:border-box; }
    html,body { margin:0; width:100%; height:100%; overflow:hidden; background:#171735; }
    body.game-booting #map { visibility:hidden; }
    body.game-booting::before {
      content:'CARGANDO CIUDAD...';
      position:fixed;
      inset:0;
      z-index:99999;
      display:grid;
      place-items:center;
      color:#fff0bb;
      font:900 15px/1 monospace;
      letter-spacing:1px;
      text-shadow:2px 2px #000;
      background-color:#171735;
      background-image:radial-gradient(#7771ae 1px,transparent 1.5px);
      background-size:24px 24px;
    }
    main { position:relative; width:100%; height:100%; overflow:hidden; background-color:#171735; background-image:radial-gradient(#7771ae 1px,transparent 1.5px); background-size:24px 24px; }
    /* Vista amplia: la isla completa se mantiene visible mientras juegas. */
    #world { position:absolute; inset:0; background:url('../../assets/maps/islands/island-terrain-large.png') center / contain no-repeat; transform-origin:0 0; transition:transform .12s linear; }
    main.overview #world { transform:scale(.82); }
    img { position:absolute; object-fit:contain; image-rendering:pixelated; }
    /* Una grilla suave para toda la superficie transitable de la isla. */
    #walk-grid { position:absolute; left:27%; top:15%; width:46%; height:58%; display:grid; grid-template-columns:repeat(40,1fr); grid-template-rows:repeat(40,1fr); z-index:1; clip-path:polygon(50% 0, 85% 4%, 100% 23%, 100% 57%, 85% 88%, 50% 100%, 15% 88%, 0 57%, 0 23%, 15% 4%); }
    .cell { border:0; background:transparent; pointer-events:none; }
    .decor-rock { position:absolute; width:9.2%; height:auto; object-fit:contain; image-rendering:pixelated; pointer-events:none; z-index:4; filter:drop-shadow(0 8px 0 rgba(20,15,29,.28)); }
    .rock { position:absolute; width:2.2%; height:auto; object-fit:contain; image-rendering:pixelated; pointer-events:none; z-index:3; transition:filter .18s ease, opacity .18s ease, transform .18s ease; }
    .rock.dragging { cursor:grabbing; }
    .rock.hit { animation:rock-hit .24s steps(2,end); filter:brightness(1.22) drop-shadow(0 0 3px #fff0bb); }
    .rock.mined { opacity:.82; filter:brightness(.95) drop-shadow(0 2px 0 rgba(20,15,29,.35)); transform:scale(.72); }
    .city-sprite.harvestable-tree.hit { animation:tree-hit .24s steps(2,end); filter:brightness(1.18) drop-shadow(0 0 3px #fff0bb); }
    .city-sprite.harvestable-tree.felled { opacity:1; filter:brightness(.88) drop-shadow(0 3px 0 rgba(20,15,29,.25)); }
    .city-sprite.harvestable-rock.hit { animation:rock-hit .24s steps(2,end); filter:brightness(1.22) drop-shadow(0 0 3px #fff0bb); }
    .city-sprite.harvestable-rock.mined { opacity:.72; filter:brightness(.82) saturate(.7) drop-shadow(0 2px 0 rgba(20,15,29,.35)); }
    #collision-layer { position:absolute; inset:0; z-index:35; pointer-events:none; display:none; }
    body.show-collisions #collision-layer, body.creator-mode #collision-layer { display:block; }
    .collision-zone { position:absolute; transform:translate(-50%, -50%); border:2px dashed rgba(116,220,255,.95); background:rgba(58,174,255,.18); border-radius:4px; box-shadow:0 0 0 2px rgba(20,15,29,.45), 0 0 12px rgba(116,220,255,.45); pointer-events:none; }
    body.show-collisions .collision-zone.decor { pointer-events:auto; cursor:move; border-radius:4px; }
    body.show-collisions .collision-zone.decor.editor-source { pointer-events:none; cursor:default; }
    .collision-zone.round { border-radius:50% !important; }
    body.creator-mode .collision-zone.decor { display:none; }
    body.creator-mode .collision-zone.ore { pointer-events:auto; cursor:move; border-color:rgba(255,210,91,.95); background:rgba(255,185,53,.18); border-radius:6px; box-shadow:0 0 0 2px rgba(20,15,29,.45), 0 0 12px rgba(255,210,91,.4); }
    body.show-collisions .collision-zone.ore { pointer-events:auto; cursor:move; border-color:rgba(255,210,91,.95); background:rgba(255,185,53,.18); border-radius:6px; box-shadow:0 0 0 2px rgba(20,15,29,.45), 0 0 12px rgba(255,210,91,.45); }
body.show-collisions .collision-zone.tree, body.creator-mode .collision-zone.tree { pointer-events:auto; cursor:move; border-color:rgba(97,239,104,.95); background:rgba(79,230,92,.16); border-radius:4px; box-shadow:0 0 0 2px rgba(20,15,29,.45), 0 0 12px rgba(97,239,104,.45); }
    .collision-zone.dragging { border-style:solid; background:rgba(91,255,213,.24); box-shadow:0 0 0 2px rgba(20,15,29,.55), 0 0 18px rgba(91,255,213,.65); }
    #collision-label { position:absolute; z-index:36; top:72px; left:50%; transform:translateX(-50%); padding:7px 10px; border:2px solid #2b2130; background:rgba(41,31,48,.92); color:#fff0bb; font:700 11px/1.2 monospace; text-shadow:1px 1px #000; display:none; pointer-events:none; white-space:nowrap; }
    body.show-collisions #collision-label, body.creator-mode #collision-label { display:block; }
    @keyframes rock-hit { 0%,100% { margin-left:0; } 35% { margin-left:-4px; } 70% { margin-left:4px; } }
    .farm-grid { display:none; }
    #placed-farms { position:absolute; inset:0; z-index:2; pointer-events:none; }
    .placed-farm { position:absolute; width:2.05%; height:4.4%; transform:translate(-50%,-50%); background:url('../../assets/gameplay/terrain/tierra-vacia.png') center / 88% 88% no-repeat; image-rendering:pixelated; }
    .placed-farm.planted { background-image:url('../../assets/gameplay/terrain/tierra-cembrada.png'); }
    .placed-farm.watered { filter:saturate(1.18) brightness(.93); }
    .placed-farm.grown { background-image:var(--crop-plot); background-position:center; background-size:69% 69%; background-repeat:no-repeat; filter:saturate(1.04) brightness(1.02); }
    .placed-tree { position:absolute; width:5.4%; height:10%; transform:translate(-50%,-82%); background:url('../../assets/gameplay/trees/tree-oak.png') center/contain no-repeat; image-rendering:pixelated; }
    .placed-tree.hit { animation:tree-hit .26s steps(2,end); filter:brightness(1.16); }
    @keyframes tree-hit {
      0%,100% { margin-left:0; }
      35% { margin-left:-3px; }
      70% { margin-left:3px; }
    }
    .placed-tree.felled { width:1.45%; height:2.15%; transform:translate(-50%,-54%); background:url('../../assets/gameplay/trees/tree-stump.png') center/contain no-repeat; border:0; border-radius:0; box-shadow:none; }
    #placement-grid { position:absolute; left:27%; top:15%; width:46%; height:58%; z-index:1; display:none; pointer-events:none; clip-path:polygon(50% 0, 85% 4%, 100% 23%, 100% 57%, 85% 88%, 50% 100%, 15% 88%, 0 57%, 0 23%, 15% 4%); background-image:linear-gradient(rgba(255,241,174,.36) 1px,transparent 1px),linear-gradient(90deg,rgba(255,241,174,.36) 1px,transparent 1px); background-size:calc(100% / 34) calc(100% / 23); box-shadow:inset 0 0 0 1px rgba(255,241,174,.26); }
    #placement-grid.visible { display:block; }
    #farm-preview { position:absolute; width:2.05%; height:4.4%; transform:translate(-50%,-50%); background:url('../../assets/gameplay/terrain/tierra-vacia.png') center / 88% 88% no-repeat; image-rendering:pixelated; opacity:.58; pointer-events:none; display:none; filter:drop-shadow(0 0 2px #fff0a5); }
    #farm-preview.invalid { filter:grayscale(.35) sepia(1) saturate(5) hue-rotate(310deg) drop-shadow(0 0 2px #ff7272); }
    #tree-preview { position:absolute; width:5.4%; height:10%; transform:translate(-50%,-82%); background:url('../../assets/gameplay/trees/tree-oak.png') center/contain no-repeat; image-rendering:pixelated; opacity:.6; pointer-events:none; display:none; filter:drop-shadow(0 0 2px #fff0a5); }
    #tree-preview.invalid { filter:grayscale(.35) sepia(1) saturate(5) hue-rotate(310deg) drop-shadow(0 0 2px #ff7272); }
    .player { position:absolute; left:50%; top:56%; width:24px; height:28px; background:#477e9c; border:3px solid #293c45; box-shadow:inset 0 -8px #2d5875; transform:translate(-50%,-50%) scale(.55); pointer-events:none; z-index:2; }
    .player:before { content:''; position:absolute; width:18px; height:17px; left:0; top:-21px; background:#efb88d; border:3px solid #293c45; box-shadow:inset -4px 0 #c97861; }
    .player:after { content:''; position:absolute; width:24px; height:7px; left:-3px; top:-25px; background:#49362f; border:3px solid #293c45; }
    .player-tool { position:absolute; left:13px; top:-18px; width:44px; height:44px; opacity:0; pointer-events:none; image-rendering:pixelated; transform-origin:9px 35px; transform:translate(0,0) rotate(2deg) scale(.78); z-index:5; transition:opacity .08s ease; }
    .player-tool.axe { background:url('../../assets/gameplay/tools/axe-equipped.png') center/contain no-repeat; filter:drop-shadow(1px 2px 0 rgba(20,15,29,.45)); }
    .player-tool.pick { left:-34px; top:-18px; width:58px; height:58px; background:url('../../assets/gameplay/tools/pickaxe-equipped.png') center/contain no-repeat; filter:drop-shadow(1px 2px 0 rgba(20,15,29,.45)); transform-origin:42px 42px; transform:translate(0,0) rotate(42deg) scaleX(-1) scale(.88); z-index:6; }
    .player.equipped-axe .player-tool.axe { opacity:1; }
    .player.equipped-pick .player-tool.pick { left:-34px; top:-18px; width:58px; height:58px; background:url('../../assets/gameplay/tools/pickaxe-equipped.png') center/contain no-repeat; filter:drop-shadow(1px 2px 0 rgba(20,15,29,.45)); transform-origin:42px 42px; transform:translate(0,0) rotate(42deg) scaleX(-1) scale(.88); z-index:6; }
    .player.swing-axe .player-tool.axe { animation:axe-chop .34s steps(4,end); }
    .player.swing-pick .player-tool.pick { left:-34px; top:-18px; width:58px; height:58px; background:url('../../assets/gameplay/tools/pickaxe-equipped.png') center/contain no-repeat; filter:drop-shadow(1px 2px 0 rgba(20,15,29,.45)); transform-origin:42px 42px; transform:translate(0,0) rotate(42deg) scaleX(-1) scale(.88); z-index:6; }
    .player.swing-axe, .player.swing-pick { animation:body-chop .34s steps(2,end); }
    @keyframes axe-chop {
      0% { transform:translate(-2px,-9px) rotate(-42deg) scale(.84); }
      48% { transform:translate(7px,8px) rotate(28deg) scale(.88); }
      100% { transform:translate(0,0) rotate(2deg) scale(.78); }
    }
    @keyframes pick-swing {
      0% { transform:translate(2px,-12px) rotate(58deg) scaleX(-1) scale(.92); }
      50% { transform:translate(-10px,9px) rotate(12deg) scaleX(-1) scale(.94); }
      100% { transform:translate(0,0) rotate(42deg) scaleX(-1) scale(.88); }
    }
    @keyframes body-chop {
      0%,100% { margin-left:0; }
      45% { margin-left:2px; }
    }
    #creator-toggle { position:absolute; top:84px; right:18px; z-index:55; width:42px; height:38px; display:grid; place-items:center; border:3px solid #2b1c1c; background:#6f472d; color:#ffe8a6; box-shadow:4px 4px 0 rgba(0,0,0,.35); font-size:20px; cursor:pointer; image-rendering:pixelated; }
    #creator-toggle.active { background:#9c6b32; color:#fff3bd; box-shadow:0 0 0 2px rgba(255,226,117,.55), 4px 4px 0 rgba(0,0,0,.35); }
    #creator-toggle:hover { filter:brightness(1.12); }
    #view-toggle { position:absolute; z-index:3; left:50%; transform:translateX(-50%); top:18px; padding:10px 13px; border:3px solid #221b2d; background:var(--panel); color:var(--cream); font:700 13px/1 monospace; letter-spacing:.04em; cursor:pointer; box-shadow:3px 3px 0 #17131f; }
    #view-toggle:hover { filter:brightness(1.18); }
    #rock-coordinates { position:absolute; z-index:4; left:50%; top:64px; transform:translateX(-50%); padding:7px 10px; border:2px solid #221b2d; background:rgba(41,39,68,.88); color:#fff0bb; font:11px/1.35 monospace; text-align:center; white-space:nowrap; pointer-events:none; }
    #character-close { background:linear-gradient(180deg,#b76543,#7c3d32); }

    .player.pixel-player {
      width:32px;
      height:48px;
      background:transparent;
      border:0;
      box-shadow:none;
      transform:translate(-50%,-78%) scale(.78);
      image-rendering:pixelated;
    }
    .player.pixel-player:before,
    .player.pixel-player:after { content:none; }
    #player-sprite {
      width:32px;
      height:48px;
      display:block;
      image-rendering:pixelated;
    }
    .player.pixel-player .player-tool { display:none !important; opacity:0 !important; visibility:hidden !important; }

    #character-panel {
      position:absolute;
      z-index:72;
      left:28px;
      top:244px;
      width:310px;
      max-height:calc(100vh - 280px);
      overflow:auto;
      display:none;
      color:#ffe7a3;
      font:800 11px/1 monospace;
      text-shadow:1px 1px #241722;
      background:linear-gradient(180deg,rgba(84,56,43,.98),rgba(57,39,41,.98));
      border:4px solid #241722;
      box-shadow:0 0 0 4px #a36a34, 7px 7px rgba(0,0,0,.38), inset 0 0 0 2px rgba(255,220,143,.18);
      padding:14px;
      image-rendering:pixelated;
    }
    #character-panel.open { display:block; }
    #character-panel h2 {
      margin:0 0 12px;
      text-align:center;
      font:900 18px/1 monospace;
      letter-spacing:0;
      color:#fff2b9;
    }
    .character-preview-wrap {
      display:grid;
      place-items:center;
      min-height:150px;
      margin-bottom:12px;
      background:#2b2233;
      border:3px solid #251b26;
      box-shadow:inset 0 0 0 2px rgba(255,255,255,.07);
    }
    #character-preview {
      width:128px;
      height:192px;
      image-rendering:pixelated;
    }
    #character-controls { display:grid; gap:10px; }
    .character-row {
      display:grid;
      grid-template-columns:68px 34px 1fr;
      align-items:center;
      gap:8px;
    }
    .character-row input[type="color"] {
      width:30px;
      height:28px;
      padding:0;
      border:2px solid #211820;
      background:#fff0b5;
    }
    .character-swatches {
      display:flex;
      flex-wrap:wrap;
      gap:5px;
    }
    .character-swatch {
      width:18px;
      height:18px;
      border:2px solid #211820;
      box-shadow:inset 1px 1px rgba(255,255,255,.38), 1px 1px rgba(0,0,0,.28);
      cursor:pointer;
    }
    .character-presets {
      display:grid;
      grid-template-columns:repeat(4, 1fr);
      gap:7px;
      margin:12px 0;
    }
    .character-panel-actions {
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:8px;
    }
    #character-panel button {
      min-height:30px;
      border:3px solid #211820;
      background:linear-gradient(180deg,#9d6b3d,#68402f);
      color:#fff2b9;
      font:900 10px/1 monospace;
      text-shadow:1px 1px #241722;
      box-shadow:inset 1px 1px #f0bf6b, 2px 2px rgba(0,0,0,.35);
      cursor:pointer;
    }
    #character-panel button.active,
    #character-save { background:linear-gradient(180deg,#3e9a57,#2d6e43); }
  #inventory { position:fixed; z-index:20; left:50%; bottom:18px; transform:translateX(-50%); display:flex; flex-direction:row; flex-wrap:nowrap; align-items:center; gap:4px; padding:5px 7px; border:3px solid #201a24; background:#49362f; box-shadow:0 0 0 3px #a87545, 5px 5px 0 rgba(20,15,29,.8); image-rendering:pixelated; }
    .inventory-slot { position:relative; display:grid; place-items:center; width:48px; height:48px; border:3px solid #261d20; background:linear-gradient(135deg,#b88d58 0 48%,#8c643e 49%); box-shadow:inset 2px 2px #f4d28b, inset -3px -3px #563a2e; cursor:pointer; }
    .inventory-slot:hover { filter:brightness(1.14); transform:translateY(-2px); }
    .inventory-slot.active { border-color:#fff0a5; box-shadow:0 0 0 2px #c77d2c, inset 2px 2px #fff0ad, inset -3px -3px #563a2e; }
    .inventory-slot.dragging { opacity:.45; transform:scale(.94); }
    .inventory-slot.drop-target { outline:3px solid #9ee7ff; outline-offset:2px; }
    .inventory-key { position:absolute; top:2px; left:3px; color:#fff3bd; font:700 9px/1 monospace; text-shadow:1px 1px #34222c; }
    .inventory-count { position:absolute; right:3px; bottom:2px; color:#fff3bd; font:700 10px/1 monospace; text-shadow:1px 1px #34222c; }
    .item-icon { width:24px; height:24px; position:relative; transform:scale(.9); }
    .item-icon.hoe:before { content:''; position:absolute; width:5px; height:29px; left:11px; top:-2px; background:#88512c; border:2px solid #392b2b; transform:rotate(42deg); }
    .item-icon.hoe:after { content:''; position:absolute; width:15px; height:10px; left:0; top:13px; background:#a8adb7; border:2px solid #3f4652; transform:rotate(42deg); }
    .item-icon.seeds { border:2px solid #433323; background:#d7a747; box-shadow:inset 0 0 0 3px #81502e; }
    .item-icon.seeds:after { content:'?'; position:absolute; color:#f8e890; font:19px/22px monospace; left:1px; top:-1px; }
    .item-icon.soil { width:23px; height:23px; background:url('../../assets/gameplay/terrain/tierra-vacia.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.tree { width:27px; height:27px; background:url('../../assets/gameplay/trees/tree-oak.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.seed-tomato { width:26px; height:26px; background:url('../../assets/gameplay/crops/seeds/tomato-seeds.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.seed-carrot { width:26px; height:26px; background:url('../../assets/gameplay/crops/seeds/carrot-seeds.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.seed-corn { width:26px; height:26px; background:url('../../assets/gameplay/crops/seeds/corn-seeds.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.seed-potato { width:26px; height:26px; background:url('../../assets/gameplay/crops/seeds/potato-seeds.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.seed-wheat { width:26px; height:26px; background:url('../../assets/gameplay/crops/seeds/wheat-seeds.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.seed-pumpkin { width:26px; height:26px; background:url('../../assets/gameplay/crops/seeds/pumpkin-seeds.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.seed-strawberry { width:26px; height:26px; background:url('../../assets/gameplay/crops/seeds/strawberry-seeds.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.tomato, .item-icon.crop-tomato { width:26px; height:26px; background:url('../../assets/gameplay/crops/produce/tomato.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.carrot, .item-icon.crop-carrot { width:26px; height:26px; background:url('../../assets/gameplay/crops/produce/carrot.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.corn, .item-icon.crop-corn { width:26px; height:26px; background:url('../../assets/gameplay/crops/produce/corn.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.potato, .item-icon.crop-potato { width:26px; height:26px; background:url('../../assets/gameplay/crops/produce/potato.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.wheat, .item-icon.crop-wheat { width:26px; height:26px; background:url('../../assets/gameplay/crops/produce/wheat.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.pumpkin, .item-icon.crop-pumpkin { width:26px; height:26px; background:url('../../assets/gameplay/crops/produce/pumpkin.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.strawberry, .item-icon.crop-strawberry { width:26px; height:26px; background:url('../../assets/gameplay/crops/produce/strawberry.png') center/contain no-repeat; image-rendering:pixelated; }
    .item-icon.sickle:before { content:''; position:absolute; width:5px; height:27px; left:10px; top:1px; background:#87502c; border:2px solid #392b2b; transform:rotate(40deg); }
    .item-icon.sickle:after { content:''; position:absolute; width:15px; height:16px; left:0; top:0; border:4px solid #c5cdd0; border-right:0; border-radius:12px 0 0 12px; transform:rotate(25deg); }
    .item-icon.scissors { width:31px; height:31px; background:url('../../assets/gameplay/tools/scissors-closed.png') center/contain no-repeat; image-rendering:pixelated; transform:scale(.92) rotate(-10deg); }
    .cut-effect { position:absolute; width:2.1%; height:3.4%; transform:translate(-42%,-58%) rotate(-16deg); background:url('../../assets/gameplay/tools/scissors-open.png') center/contain no-repeat; image-rendering:pixelated; z-index:9; pointer-events:none; filter:drop-shadow(1px 2px 0 rgba(20,15,29,.45)); animation:scissors-cut .28s steps(1,end) forwards; }
    @keyframes scissors-cut { 0% { background-image:url('../../assets/gameplay/tools/scissors-open.png'); transform:translate(-42%,-62%) rotate(-18deg) scale(.78); opacity:1; } 45% { background-image:url('../../assets/gameplay/tools/scissors-closed.png'); transform:translate(-38%,-52%) rotate(8deg) scale(.82); opacity:1; } 100% { background-image:url('../../assets/gameplay/tools/scissors-closed.png'); transform:translate(-38%,-52%) rotate(8deg) scale(.72); opacity:0; } }
    .inventory-slot.rarity-common { border-color:#eee7cc; }
    .inventory-slot.rarity-uncommon { border-color:#61d36c; box-shadow:0 0 0 2px #297341, inset 2px 2px #b7eea9, inset -3px -3px #245b38; }
    .inventory-slot.rarity-rare { border-color:#69c5ff; box-shadow:0 0 0 2px #2673b7, inset 2px 2px #a9e4ff, inset -3px -3px #25547c; }
    .inventory-slot.rarity-epic { border-color:#d27dff; box-shadow:0 0 0 2px #7a3da1, inset 2px 2px #f0b5ff, inset -3px -3px #5a286f; }
    .item-icon.wood { width:24px; height:13px; background:#8a4d2e; border:2px solid #3e2828; border-radius:5px; box-shadow:inset 0 3px #bd7541; transform:rotate(-12deg); }
    .item-icon.stone { width:31px; height:31px; background:url('../../assets/gameplay/mining/drops/stone-drop.png') center/contain no-repeat; image-rendering:pixelated; transform:scale(.92); }
    .item-icon.iron { width:31px; height:31px; background:url('../../assets/gameplay/mining/drops/iron-drop.png') center/contain no-repeat; image-rendering:pixelated; transform:scale(.92); }
    .item-icon.gold { width:31px; height:31px; background:url('../../assets/gameplay/mining/drops/gold-drop.png') center/contain no-repeat; image-rendering:pixelated; transform:scale(.92); }
    #loot-toast { position:absolute; z-index:11; left:50%; top:28%; transform:translate(-50%,-8px); opacity:0; padding:7px 11px; border:2px solid #2a2029; background:#49362f; color:#fff0bb; font:700 12px/1 monospace; pointer-events:none; transition:opacity .15s,transform .15s; }
    #loot-toast.show { opacity:1; transform:translate(-50%,0); }
    .item-icon.water:before { content:''; position:absolute; width:18px; height:15px; top:9px; left:3px; background:#4e9ac0; border:2px solid #263d55; border-radius:2px 2px 6px 6px; }
    .item-icon.water:after { content:''; position:absolute; width:11px; height:10px; left:7px; top:0; border:3px solid #263d55; border-bottom:0; border-radius:8px 8px 0 0; }
    .item-icon.axe { width:31px; height:31px; background:url('../../assets/gameplay/tools/axe-equipped.png') center/contain no-repeat; image-rendering:pixelated; transform:scale(.95) rotate(-8deg); }
    .item-icon.pick { width:31px; height:31px; background:url('../../assets/gameplay/tools/pickaxe-equipped.png') center/contain no-repeat; image-rendering:pixelated; transform:scale(.96) rotate(-8deg); }
    .item-icon.pick:before, .item-icon.pick:after { content:none; }
    .item-icon.bag { width:21px; height:20px; margin-top:5px; background:#b95737; border:2px solid #512b30; border-radius:3px 3px 6px 6px; }
    .item-icon.bag:before { content:''; position:absolute; width:11px; height:7px; left:3px; top:-7px; border:2px solid #512b30; border-bottom:0; border-radius:7px 7px 0 0; }
    #status-bars { position:absolute; z-index:8; left:16px; top:16px; min-width:190px; padding:8px 9px; border:3px solid #201a24; background:rgba(73,54,47,.92); box-shadow:0 0 0 2px #a87545, 4px 4px 0 rgba(20,15,29,.65); color:#fff0bb; font:700 11px/1 monospace; }
    .hud-row { display:grid; grid-template-columns:54px 1fr 42px; gap:6px; align-items:center; margin:3px 0; text-shadow:1px 1px #292744; }
    .hud-bar { height:10px; border:2px solid #211925; background:#241c2a; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); overflow:hidden; }
    .hud-fill { display:block; width:100%; height:100%; background:linear-gradient(90deg,#5edc78,#c8f16d); }
    .hud-fill.energy { background:linear-gradient(90deg,#3fc5ff,#8ef4ff); }
    #skills-panel { position:absolute; z-index:10; right:22px; top:72px; width:min(330px,calc(100vw - 36px)); padding:14px; border:4px solid #201a24; background:#49362f; box-shadow:0 0 0 4px #b88750, 8px 8px 0 rgba(20,15,29,.82); color:#fff0bb; opacity:0; pointer-events:none; transform:translateY(-8px) scale(.96); transition:opacity .12s ease, transform .12s ease; }
    #skills-panel.open { opacity:1; pointer-events:auto; transform:translateY(0) scale(1); }
    .skills-title { margin:0 0 10px; display:flex; justify-content:space-between; align-items:center; font:700 15px/1 monospace; letter-spacing:.08em; text-shadow:2px 2px #292744; }
    .skill-row { display:grid; grid-template-columns:86px 34px 1fr; gap:8px; align-items:center; margin:8px 0; font:700 11px/1 monospace; }
    .skill-progress { height:11px; border:2px solid #211925; background:#2d2231; overflow:hidden; }
    .skill-progress span { display:block; height:100%; width:0%; background:linear-gradient(90deg,#f0c15f,#fff0a5); }
    .panel-close { border:2px solid #231b24; background:#8c4a35; color:#fff0bb; font:700 13px/1 monospace; cursor:pointer; padding:4px 7px; }
    #inventory-panel { position:absolute; z-index:10; left:50%; top:50%; width:min(350px,calc(100vw - 36px)); padding:16px; transform:translate(-50%,-50%) scale(.92); border:4px solid #201a24; background:#49362f; box-shadow:0 0 0 4px #b88750, 8px 8px 0 rgba(20,15,29,.82); opacity:0; pointer-events:none; transition:opacity .12s ease, transform .12s ease; }
    #inventory-panel.open { opacity:1; pointer-events:auto; transform:translate(-50%,-50%) scale(1); }
    .inventory-heading { display:flex; align-items:center; justify-content:space-between; margin:0 0 12px; color:#fff0bb; font:700 15px/1 monospace; letter-spacing:.08em; text-shadow:2px 2px #292744; cursor:grab; user-select:none; touch-action:none; }
    .inventory-heading.dragging { cursor:grabbing; }
    .inventory-close { border:2px solid #231b24; background:#8c4a35; color:#fff0bb; font:700 13px/1 monospace; cursor:pointer; padding:4px 7px; }
    .inventory-bag { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; padding:7px; border:2px solid #2c2130; background:#30253a; }
    .inventory-bag .inventory-slot { width:auto; aspect-ratio:1; height:auto; min-height:51px; }
    .inventory-empty { opacity:.35; background:#6b503d; box-shadow:inset 2px 2px #aa8154, inset -3px -3px #3a2d2e; }
    .inventory-help { margin:11px 0 0; color:#e8c985; font:10px/1.3 monospace; text-align:center; }
    #hint { position:absolute; z-index:2; bottom:100px; left:50%; transform:translateX(-50%); color:#fff0bb; font:12px/1.2 monospace; text-shadow:2px 2px #292744; white-space:nowrap; pointer-events:none; }
    @media (max-width:650px) { #inventory { bottom:10px; gap:2px; padding:4px; } .inventory-slot { width:39px; height:39px; transform:scale(.9); margin:-2px; } #hint { bottom:72px; font-size:10px; } }
  
  /* === HUB POLISH START === */
  #status-bars {
    position:absolute;
    z-index:60;
    left:18px;
    top:18px;
    width:228px;
    min-width:0;
    padding:30px 12px 12px 60px;
    border:3px solid #1d151d;
    border-radius:5px;
    background:
      linear-gradient(180deg, rgba(93,65,47,.98), rgba(47,34,43,.98)),
      repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 2px, transparent 2px 6px);
    box-shadow:
      0 0 0 2px #d79a53,
      0 0 0 5px rgba(34,22,26,.78),
      6px 7px 0 rgba(13,10,20,.62),
      inset 0 2px rgba(255,235,166,.16),
      inset 0 -4px rgba(0,0,0,.18);
    color:#fff0bb;
    font:700 11px/1 monospace;
    image-rendering:pixelated;
  }
  #status-bars::before {
    content:'PIXEL FARM';
    position:absolute;
    left:58px;
    top:8px;
    right:10px;
    color:#ffe39a;
    font:900 13px/1 monospace;
    letter-spacing:.11em;
    text-shadow:2px 2px #2b1b25;
  }
  #status-bars::after {
    content:'PF';
    position:absolute;
    left:12px;
    top:12px;
    width:36px;
    height:36px;
    display:grid;
    place-items:center;
    border:3px solid #22181f;
    border-radius:4px;
    background:linear-gradient(135deg,#7ecb52,#3e8d39 58%,#24552d);
    box-shadow:inset 2px 2px #d7ff8d, inset -3px -3px #17381e, 3px 3px rgba(0,0,0,.32);
    color:#fff6bd;
    text-shadow:2px 2px #15351c;
    font:900 13px/1 monospace;
  }
  .hud-row {
    display:grid;
    grid-template-columns:58px 1fr 48px;
    gap:7px;
    align-items:center;
    margin:5px 0;
    text-shadow:1px 1px #292744;
  }
  .hud-bar {
    height:11px;
    border:2px solid #1d1420;
    border-radius:2px;
    background:#211928;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.08), 1px 1px rgba(0,0,0,.35);
    overflow:hidden;
  }
  .hud-fill {
    display:block;
    width:100%;
    height:100%;
    background:linear-gradient(90deg,#7ee36a,#f1e76b);
    box-shadow:inset 0 2px rgba(255,255,255,.28);
  }
  .hud-fill.energy {
    background:linear-gradient(90deg,#39bfff,#8df6ff);
  }

  #quick-hub {
    position:absolute;
    z-index:54;
    top:132px;
    right:18px;
    display:grid;
    gap:7px;
    pointer-events:none;
    image-rendering:pixelated;
  }
  .quick-tip {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:7px;
    color:#ffe7a3;
    font:800 10px/1 monospace;
    text-shadow:1px 1px #241722;
    opacity:.92;
  }
  .quick-tip kbd {
    min-width:23px;
    padding:5px 0 4px;
    text-align:center;
    border:2px solid #211820;
    border-radius:3px;
    background:linear-gradient(180deg,#805431,#52342b);
    box-shadow:inset 1px 1px #f0bf6b, 2px 2px rgba(0,0,0,.35);
    color:#fff2b9;
    font:900 11px/1 monospace;
  }
  .quick-tip span {
    padding:5px 7px 4px;
    border:2px solid rgba(35,24,30,.8);
    background:rgba(41,31,42,.74);
    box-shadow:2px 2px rgba(0,0,0,.28);
  }
    #character-close { background:linear-gradient(180deg,#b76543,#7c3d32); }
  #inventory {
    z-index:65;
    bottom:18px;
    gap:5px;
    padding:18px 10px 8px;
    border:3px solid #1d151d;
    border-radius:5px;
    background:linear-gradient(180deg,#62422f,#392936);
    box-shadow:
      0 0 0 2px #d49853,
      0 0 0 5px rgba(31,20,25,.74),
      7px 7px 0 rgba(13,10,20,.62),
      inset 0 2px rgba(255,231,166,.16),
      inset 0 -5px rgba(0,0,0,.2);
  }
  #inventory::before {
    content:'BARRA RÁPIDA';
    position:absolute;
    left:12px;
    top:4px;
    color:#ffe39a;
    font:900 10px/1 monospace;
    letter-spacing:.12em;
    text-shadow:2px 2px #2b1b25;
    opacity:.95;
  }
  .inventory-slot {
    width:47px;
    height:47px;
    border:3px solid #231820;
    border-radius:3px;
    background:
      linear-gradient(135deg,#d09a5b 0 47%,#9f6f42 48%),
      repeating-linear-gradient(45deg,rgba(255,255,255,.08) 0 2px,transparent 2px 5px);
    box-shadow:
      inset 2px 2px #ffd98a,
      inset -3px -3px #4b302a,
      2px 2px 0 rgba(0,0,0,.22);
  }
  .inventory-slot:hover {
    filter:brightness(1.16) saturate(1.05);
    transform:translateY(-3px);
  }
  .inventory-slot.active {
    border-color:#fff3a7;
    background:linear-gradient(135deg,#e0a865 0 47%,#b7763f 48%);
    box-shadow:
      0 0 0 2px #c9792a,
      0 0 13px rgba(255,220,100,.45),
      inset 2px 2px #fff0ad,
      inset -3px -3px #563229;
  }
  .inventory-key {
    top:3px;
    left:4px;
    color:#fff6c8;
    font:900 9px/1 monospace;
  }
  .inventory-count {
    right:4px;
    bottom:3px;
    color:#fff6c8;
    font:900 10px/1 monospace;
  }

  #skills-panel,
  #inventory-panel {
    border:4px solid #1d151d;
    border-radius:6px;
    background:linear-gradient(180deg,#5b3d32,#352738);
    box-shadow:0 0 0 3px #d49853, 0 0 0 6px rgba(31,20,25,.7), 10px 10px 0 rgba(13,10,20,.66), inset 0 2px rgba(255,231,166,.14);
  }
  .skills-title,
  .inventory-heading {
    color:#ffe39a;
    text-shadow:2px 2px #241722;
  }
  .panel-close,
  .inventory-close {
    border:2px solid #20171f;
    border-radius:3px;
    background:linear-gradient(180deg,#a85b3a,#74322e);
    box-shadow:inset 1px 1px #e69b61, 2px 2px rgba(0,0,0,.28);
  }
  .inventory-bag {
    border:3px solid #221820;
    border-radius:4px;
    background:linear-gradient(180deg,#30243a,#261c30);
    box-shadow:inset 0 0 0 2px rgba(255,230,154,.08);
  }
  .inventory-help,
  .skills-help {
    color:#f0cf89;
  }
  #hint {
    bottom:104px;
    padding:4px 8px;
    border:2px solid rgba(31,23,31,.45);
    background:rgba(24,18,28,.36);
    border-radius:3px;
  }
  @media (max-width:900px) {
    #quick-hub { display:none; }
    #status-bars { transform:scale(.92); transform-origin:top left; }
  }
  @media (max-width:650px) {
    #character-close { background:linear-gradient(180deg,#b76543,#7c3d32); }
  #inventory { bottom:10px; gap:2px; padding:16px 5px 5px; }
    #inventory::before { left:8px; top:3px; font-size:8px; }
    .inventory-slot { width:40px; height:40px; transform:none; margin:0; }
    #hint { bottom:76px; font-size:10px; }
  }

    /* === Large inventory redesign === */
    #inventory-panel {
      position:absolute;
      z-index:76;
      left:50%;
      top:50%;
      width:min(1380px,calc(100vw - 42px));
      min-height:min(890px,calc(100vh - 54px));
      max-height:calc(100vh - 54px);
      display:grid;
      grid-template-rows:auto auto 1fr auto;
      gap:0;
      padding:20px 20px 22px;
      transform:translate(-50%,-50%) scale(.96);
      border:5px solid #151012;
      border-radius:4px;
      background:linear-gradient(180deg,#5a3a2f 0%,#332522 52%,#251c1f 100%);
      box-shadow:0 0 0 4px #d7a25a,0 0 0 8px #2a1b16,12px 12px 0 rgba(0,0,0,.48),inset 0 2px rgba(255,230,167,.18),inset 0 -5px rgba(0,0,0,.18);
      opacity:0;
      pointer-events:none;
      transition:opacity .12s ease, transform .12s ease;
      image-rendering:pixelated;
    }
    #inventory-panel.open { opacity:1; pointer-events:auto; transform:translate(-50%,-50%) scale(1); }
    .inventory-heading {
      min-height:70px;
      margin:0;
      padding:0 70px;
      display:grid;
      place-items:center;
      position:relative;
      border:4px solid #161011;
      border-bottom:3px solid #140f10;
      border-radius:3px 3px 0 0;
      background:linear-gradient(180deg,#6a4535,#3a2926);
      box-shadow:inset 2px 2px rgba(255,224,151,.16), inset -2px -4px rgba(0,0,0,.28);
      color:#fff0bb;
      font:900 42px/1 monospace;
      letter-spacing:.05em;
      text-shadow:3px 3px #1a1215;
      cursor:grab;
      user-select:none;
      touch-action:none;
    }
    .inventory-heading span { color:#fff0bb; letter-spacing:.05em; }
    .inventory-close {
      position:absolute;
      right:18px;
      top:14px;
      width:58px;
      height:58px;
      display:grid;
      place-items:center;
      border:4px solid #171011;
      border-radius:8px;
      background:linear-gradient(180deg,#a14c38,#67302d);
      color:#fff2c5;
      box-shadow:inset 2px 2px rgba(255,196,128,.35), inset -3px -3px rgba(45,18,20,.65), 3px 3px 0 rgba(0,0,0,.35);
      font:900 34px/1 monospace;
      cursor:pointer;
    }
    .inventory-tabs {
      display:grid;
      grid-template-columns:repeat(6,1fr);
      gap:8px;
      margin:14px 22px 0;
      align-items:end;
    }
    .inventory-tab {
      min-height:64px;
      border:4px solid #171011;
      border-bottom:0;
      border-radius:5px 5px 0 0;
      background:linear-gradient(180deg,#332928,#201b1d);
      color:#fff0bb;
      font:900 18px/1 monospace;
      text-shadow:2px 2px #171011;
      box-shadow:inset 2px 2px rgba(255,226,158,.1), inset -3px -3px rgba(0,0,0,.22);
      cursor:pointer;
    }
    .inventory-tab.active {
      background:linear-gradient(180deg,#91613a,#5f3e2e);
      border-color:#ffd05f #211715 #211715;
      color:#fff6c9;
      box-shadow:0 -2px 0 #ffd05f, inset 2px 2px rgba(255,241,174,.22), inset -3px -3px rgba(0,0,0,.26);
    }
    .inventory-bag {
      min-height:0;
      display:grid;
      grid-template-columns:repeat(8,minmax(82px,1fr));
      grid-auto-rows:minmax(82px,1fr);
      gap:14px;
      padding:22px;
      overflow:auto;
      border:4px solid #171112;
      border-radius:5px;
      background:linear-gradient(180deg,#272221,#191718);
      box-shadow:inset 0 0 0 2px rgba(255,222,157,.06), inset 0 0 28px rgba(0,0,0,.32);
    }
    #inventory-panel .inventory-bag .inventory-slot {
      width:100%;
      height:auto;
      min-height:82px;
      aspect-ratio:1;
      display:grid;
      place-items:center;
      border:4px solid #4f3d31;
      border-radius:3px;
      background:radial-gradient(circle at 45% 38%,#302c2a,#1d1a1b 72%);
      box-shadow:inset 3px 3px rgba(124,93,70,.6), inset -4px -4px rgba(5,5,6,.7), 3px 3px 0 rgba(0,0,0,.28);
      transform:none;
      cursor:pointer;
    }
    #inventory-panel .inventory-bag .inventory-slot:hover { filter:brightness(1.18); transform:translateY(-2px); }
    #inventory-panel .inventory-bag .inventory-slot.active,
    #inventory-panel .inventory-bag .inventory-slot.selected {
      border-color:#ffe074;
      box-shadow:0 0 0 2px #946b32,0 0 14px rgba(255,218,92,.35),inset 3px 3px rgba(255,226,154,.28),inset -4px -4px rgba(0,0,0,.62);
    }
    #inventory-panel .inventory-bag .inventory-empty {
      opacity:1;
      background:radial-gradient(circle at 45% 38%,#292625,#1b1819 76%);
      border-color:#403127;
    }
    #inventory-panel .inventory-slot.filtered-out { display:none; }
    #inventory-panel .inventory-count {
      right:7px;
      bottom:6px;
      min-width:20px;
      padding:3px 5px;
      border:2px solid #171011;
      border-radius:3px;
      background:rgba(37,25,22,.92);
      color:#fff1bc;
      font:900 13px/1 monospace;
      text-shadow:1px 1px #171011;
    }
    .inventory-footer {
      min-height:96px;
      display:grid;
      grid-template-columns:1fr auto auto auto;
      align-items:center;
      gap:20px;
      padding:18px 18px 4px;
    }
    .inventory-weight {
      display:flex;
      align-items:center;
      gap:16px;
      color:#fff0bb;
      font:900 24px/1 monospace;
      text-shadow:2px 2px #171011;
    }
    .inventory-weight-icon {
      width:38px;
      height:34px;
      display:grid;
      place-items:end center;
      border:3px solid #171011;
      border-radius:4px 4px 8px 8px;
      background:linear-gradient(180deg,#aa8052,#69503b);
      box-shadow:inset 2px 2px rgba(255,230,160,.32), inset -3px -3px rgba(32,22,18,.55);
      color:#ffe7aa;
      font:900 16px/1 monospace;
    }
    .inventory-weight-bar {
      width:min(330px,28vw);
      height:20px;
      border:3px solid #171011;
      border-radius:3px;
      overflow:hidden;
      background:#1b1818;
      box-shadow:inset 0 2px rgba(255,255,255,.05);
    }
    #inventory-weight-fill { display:block; width:0%; height:100%; background:linear-gradient(90deg,#4d8fd8,#d6bb58); }
    .inventory-action {
      min-width:150px;
      min-height:58px;
      border:4px solid #171011;
      border-radius:5px;
      color:#fff0bb;
      font:900 20px/1 monospace;
      text-shadow:2px 2px #171011;
      box-shadow:inset 2px 2px rgba(255,237,170,.22), inset -3px -3px rgba(0,0,0,.35), 3px 3px 0 rgba(0,0,0,.3);
      cursor:pointer;
    }
    #inventory-sort { background:linear-gradient(180deg,#536981,#314052); }
    #inventory-split { background:linear-gradient(180deg,#77773d,#4e4e2e); }
    #inventory-trash { min-width:96px; background:linear-gradient(180deg,#a14c40,#6a2d2c); font-size:34px; }
    .inventory-help { display:none; }
    @media (max-width:900px) {
      #inventory-panel { width:calc(100vw - 18px); min-height:calc(100vh - 28px); padding:12px; }
      .inventory-heading { min-height:56px; font-size:26px; padding:0 54px; }
      .inventory-close { width:44px; height:44px; font-size:25px; right:10px; top:8px; }
      .inventory-tabs { grid-template-columns:repeat(3,1fr); margin:10px 8px 0; gap:5px; }
      .inventory-tab { min-height:42px; font-size:12px; }
      .inventory-bag { grid-template-columns:repeat(5,1fr); gap:8px; padding:10px; }
      #inventory-panel .inventory-bag .inventory-slot { min-height:54px; }
      .inventory-footer { grid-template-columns:1fr 1fr; gap:10px; padding:10px 4px 0; }
      .inventory-weight { grid-column:1 / -1; font-size:15px; }
      .inventory-action { min-width:0; min-height:44px; font-size:14px; }
      #inventory-trash { font-size:24px; }
    }
    /* === End large inventory redesign === */
  /* === HUB POLISH END === */


    /* === Inventory polish + tiered pickaxes === */
    .item-icon.pick.wood-pick { background-image:url('../../assets/gameplay/tools/pickaxe-wood.png'); }
    .item-icon.pick.stone-pick { background-image:url('../../assets/gameplay/tools/pickaxe-stone.png'); }
    .item-icon.pick.iron-pick { background-image:url('../../assets/gameplay/tools/pickaxe-iron.png'); }
    .item-icon.pick.gold-pick { background-image:url('../../assets/gameplay/tools/pickaxe-gold.png'); }
.item-icon.pick.apprentice-pick { background-image:url('../../assets/gameplay/tools/pickaxe-wood.png'); }
    .item-icon.pick.epic-pick { background-image:url('../../assets/gameplay/tools/pickaxe-gold.png'); filter:hue-rotate(225deg) saturate(1.65) drop-shadow(0 0 3px #b15cff); }
    .item-icon.pick.legendary-pick { background-image:url('../../assets/gameplay/tools/pickaxe-gold.png'); filter:saturate(1.8) brightness(1.18) drop-shadow(0 0 4px #ffd84d); }
    .market-pick-icon { width:42px; height:42px; object-fit:contain; image-rendering:pixelated; }
    .market-pick-icon.epic-pick { filter:hue-rotate(225deg) saturate(1.65) drop-shadow(0 0 3px #b15cff); }
    .market-pick-icon.legendary-pick { filter:saturate(1.8) brightness(1.18) drop-shadow(0 0 4px #ffd84d); }
    .player-tool.pick.apprentice-pick { background:url('../../assets/gameplay/tools/pickaxe-wood.png') center/contain no-repeat; }
    .player-tool.pick.epic-pick { background:url('../../assets/gameplay/tools/pickaxe-gold.png') center/contain no-repeat; filter:hue-rotate(225deg) saturate(1.65) drop-shadow(0 0 4px #b15cff); }
    .player-tool.pick.legendary-pick { background:url('../../assets/gameplay/tools/pickaxe-gold.png') center/contain no-repeat; filter:saturate(1.8) brightness(1.18) drop-shadow(0 0 5px #ffd84d); }
    .inventory-slot.pick-broken { filter:grayscale(.78) brightness(.62); }
    .inventory-slot.pick-broken::after { content:'ROTO'; position:absolute; left:2px; right:2px; bottom:2px; padding:1px; background:#8d281f; color:#fff0d0; font:700 7px monospace; text-align:center; }
    .player-tool.pick.wood-pick { background:url('../../assets/gameplay/tools/pickaxe-wood.png') center/contain no-repeat; }
    .player-tool.pick.stone-pick { background:url('../../assets/gameplay/tools/pickaxe-stone.png') center/contain no-repeat; }
    .player-tool.pick.iron-pick { background:url('../../assets/gameplay/tools/pickaxe-iron.png') center/contain no-repeat; }
    .player-tool.pick.gold-pick { background:url('../../assets/gameplay/tools/pickaxe-gold.png') center/contain no-repeat; }

    #inventory-panel {
      width:min(318px,calc(100vw - 28px));
      min-height:auto;
      padding:10px 10px 12px;
      border:3px solid #18111a;
      border-radius:10px;
      background:linear-gradient(180deg,#654033 0%,#453036 48%,#2b2032 100%);
      box-shadow:0 0 0 3px #d49b54,0 0 0 6px #2a1b21,8px 10px 0 rgba(14,9,16,.7);
    }
    .inventory-heading {
      margin:0 0 9px;
      padding:8px 9px;
      border:2px solid #1d141c;
      border-radius:6px;
      background:linear-gradient(180deg,#7e5138,#4b312f);
      box-shadow:inset 2px 2px rgba(255,229,157,.18), inset -2px -2px rgba(22,13,18,.45);
      cursor:grab;
    }
    .inventory-heading span { color:#ffe6a6; letter-spacing:.09em; }
    .inventory-close {
      width:24px;
      height:24px;
      border:2px solid #241722;
      border-radius:4px;
      background:linear-gradient(180deg,#b86d42,#7b352d);
      color:#ffe7ae;
      box-shadow:inset 1px 1px rgba(255,234,170,.35), 2px 2px 0 rgba(18,10,16,.5);
    }
    .inventory-bag {
      grid-template-columns:repeat(4,54px);
      justify-content:center;
      gap:7px;
      padding:9px;
      border:3px solid #18111d;
      border-radius:7px;
      background:linear-gradient(180deg,#2d2036,#1c1527);
    }
    #inventory-panel .inventory-bag .inventory-slot {
      width:54px;
      height:54px;
      min-height:54px;
      aspect-ratio:auto;
      border:2px solid #231720;
      border-radius:5px;
      background:linear-gradient(135deg,#d8a361 0 49%,#95603e 50% 100%);
      box-shadow:inset 2px 2px #ffe0a0,inset -3px -3px #5c3b31,0 3px 0 rgba(0,0,0,.35);
    }
    #inventory-panel .inventory-bag .inventory-slot:hover { transform:translateY(-2px); }
    #inventory-panel > .inventory-slot.inventory-empty { display:none; }
    #inventory-panel .inventory-count {
      right:4px;
      bottom:3px;
      padding:1px 3px;
      border-radius:3px;
      background:rgba(34,20,22,.82);
      color:#ffe6a6;
      text-shadow:1px 1px #241722;
    }
    .inventory-help { margin-top:8px; color:#ffd990; opacity:.9; }

  /* CODEX_PICK_EQUIP_FIX_START */
.player.equipped-pick .player-tool.pick,
.player.swing-pick .player-tool.pick {
  opacity: 1 !important;
  display: block !important;
}
.player-tool.pick {
  left: 14px !important;
  top: -19px !important;
  width: 50px !important;
  height: 50px !important;
  transform-origin: 9px 39px !important;
  transform: translate(0,0) rotate(14deg) scale(.74) !important;
  pointer-events: none !important;
  z-index: 6 !important;
}
.player.swing-pick .player-tool.pick {
  animation: pick-swing-fixed .34s steps(4,end) !important;
}
@keyframes pick-swing-fixed {
  0% { transform: translate(-4px,-12px) rotate(-38deg) scale(.78); }
  52% { transform: translate(8px,8px) rotate(34deg) scale(.80); }
  100% { transform: translate(0,0) rotate(14deg) scale(.74); }
}
/* CODEX_PICK_EQUIP_FIX_END */
  
    /* === Large inventory final overrides === */
    #inventory-panel {
      z-index:76 !important;
      left:50% !important;
      top:50% !important;
      width:min(1380px,calc(100vw - 42px)) !important;
      min-height:min(890px,calc(100vh - 54px)) !important;
      max-height:calc(100vh - 54px) !important;
      display:grid !important;
      grid-template-rows:auto auto 1fr auto !important;
      padding:20px 20px 22px !important;
      border:5px solid #151012 !important;
      border-radius:4px !important;
      background:linear-gradient(180deg,#5a3a2f 0%,#332522 52%,#251c1f 100%) !important;
      box-shadow:0 0 0 4px #d7a25a,0 0 0 8px #2a1b16,12px 12px 0 rgba(0,0,0,.48),inset 0 2px rgba(255,230,167,.18),inset 0 -5px rgba(0,0,0,.18) !important;
    }
    #inventory-panel.open { transform:translate(-50%,-50%) scale(1) !important; }
    #inventory-panel .inventory-heading {
      min-height:70px !important;
      margin:0 !important;
      padding:0 70px !important;
      display:grid !important;
      place-items:center !important;
      position:relative !important;
      border:4px solid #161011 !important;
      border-bottom:3px solid #140f10 !important;
      border-radius:3px 3px 0 0 !important;
      background:linear-gradient(180deg,#6a4535,#3a2926) !important;
      color:#fff0bb !important;
      font:900 42px/1 monospace !important;
      letter-spacing:.05em !important;
    }
    #inventory-panel .inventory-heading span { color:#fff0bb !important; }
    #inventory-panel .inventory-close {
      position:absolute !important;
      right:18px !important;
      top:14px !important;
      width:58px !important;
      height:58px !important;
      border:4px solid #171011 !important;
      border-radius:8px !important;
      background:linear-gradient(180deg,#a14c38,#67302d) !important;
      color:#fff2c5 !important;
      font:900 34px/1 monospace !important;
    }
    #inventory-panel .inventory-bag {
      display:grid !important;
      grid-template-columns:repeat(8,minmax(82px,1fr)) !important;
      grid-auto-rows:minmax(82px,1fr) !important;
      justify-content:stretch !important;
      gap:14px !important;
      padding:22px !important;
      overflow:auto !important;
      border:4px solid #171112 !important;
      border-radius:5px !important;
      background:linear-gradient(180deg,#272221,#191718) !important;
    }
    #inventory-panel .inventory-bag .inventory-slot {
      width:100% !important;
      height:auto !important;
      min-height:82px !important;
      aspect-ratio:1 !important;
      border:4px solid #4f3d31 !important;
      border-radius:3px !important;
      background:radial-gradient(circle at 45% 38%,#302c2a,#1d1a1b 72%) !important;
      box-shadow:inset 3px 3px rgba(124,93,70,.6), inset -4px -4px rgba(5,5,6,.7), 3px 3px 0 rgba(0,0,0,.28) !important;
    }
    #inventory-panel .inventory-bag .inventory-empty { border-color:#403127 !important; background:radial-gradient(circle at 45% 38%,#292625,#1b1819 76%) !important; }
    #inventory-panel .inventory-slot.filtered-out { display:none !important; }
    @media (max-width:900px) {
      #inventory-panel { width:calc(100vw - 18px) !important; min-height:calc(100vh - 28px) !important; padding:12px !important; }
      #inventory-panel .inventory-heading { min-height:56px !important; font-size:26px !important; padding:0 54px !important; }
      #inventory-panel .inventory-close { width:44px !important; height:44px !important; font-size:25px !important; right:10px !important; top:8px !important; }
      #inventory-panel .inventory-bag { grid-template-columns:repeat(5,1fr) !important; gap:8px !important; padding:10px !important; }
      #inventory-panel .inventory-bag .inventory-slot { min-height:54px !important; }
    }
    /* === End large inventory final overrides === */
  
    /* === Compact inventory final sizing === */
    #inventory-panel {
      width:min(980px,calc(100vw - 120px)) !important;
      min-height:0 !important;
      height:min(690px,calc(100vh - 110px)) !important;
      max-height:calc(100vh - 110px) !important;
      padding:14px 16px 16px !important;
      grid-template-rows:58px 48px 1fr 72px !important;
    }
    #inventory-panel .inventory-heading {
      min-height:58px !important;
      padding:0 58px !important;
      font-size:30px !important;
    }
    #inventory-panel .inventory-close {
      width:44px !important;
      height:44px !important;
      right:12px !important;
      top:7px !important;
      font-size:26px !important;
      border-width:3px !important;
    }
    #inventory-panel .inventory-tabs {
      margin:8px 14px 0 !important;
      gap:6px !important;
    }
    #inventory-panel .inventory-tab {
      min-height:48px !important;
      font-size:13px !important;
      border-width:3px !important;
    }
    #inventory-panel .inventory-bag {
      grid-template-columns:repeat(8,minmax(58px,1fr)) !important;
      grid-auto-rows:minmax(58px,1fr) !important;
      gap:8px !important;
      padding:14px !important;
      overflow:auto !important;
    }
    #inventory-panel .inventory-bag .inventory-slot {
      min-height:58px !important;
      border-width:3px !important;
    }
    #inventory-panel .item-icon { transform:scale(.82); }
    #inventory-panel .inventory-count {
      right:4px !important;
      bottom:3px !important;
      font-size:10px !important;
      padding:1px 3px !important;
      border-width:1px !important;
    }
    #inventory-panel .inventory-footer {
      min-height:72px !important;
      gap:14px !important;
      padding:12px 4px 0 !important;
      grid-template-columns:1fr 128px 128px 72px !important;
    }
    #inventory-panel .inventory-weight {
      gap:10px !important;
      font-size:18px !important;
    }
    #inventory-panel .inventory-weight-icon {
      width:30px !important;
      height:26px !important;
      font-size:12px !important;
      border-width:2px !important;
    }
    #inventory-panel .inventory-weight-bar {
      width:min(260px,24vw) !important;
      height:15px !important;
      border-width:2px !important;
    }
    #inventory-panel .inventory-action {
      min-width:0 !important;
      min-height:46px !important;
      border-width:3px !important;
      font-size:15px !important;
    }
    #inventory-panel #inventory-trash { font-size:24px !important; }
    @media (max-width:900px) {
      #inventory-panel { width:calc(100vw - 18px) !important; height:calc(100vh - 30px) !important; max-height:calc(100vh - 30px) !important; grid-template-rows:52px auto 1fr auto !important; }
      #inventory-panel .inventory-tabs { grid-template-columns:repeat(3,1fr) !important; }
      #inventory-panel .inventory-bag { grid-template-columns:repeat(5,1fr) !important; }
      #inventory-panel .inventory-footer { grid-template-columns:1fr 1fr !important; }
      #inventory-panel .inventory-weight { grid-column:1 / -1 !important; }
    }
    /* === End compact inventory final sizing === */
  
    /* === Side compact inventory sizing === */
    #inventory-panel {
      left:auto !important;
      right:74px !important;
      top:118px !important;
      width:min(760px,calc(100vw - 150px)) !important;
      height:min(560px,calc(100vh - 160px)) !important;
      min-height:0 !important;
      max-height:calc(100vh - 160px) !important;
      padding:10px 12px 12px !important;
      grid-template-rows:48px 40px 1fr 58px !important;
      transform:scale(.96) !important;
    }
    #inventory-panel.open { transform:scale(1) !important; }
    #inventory-panel .inventory-heading {
      min-height:48px !important;
      padding:0 48px !important;
      font-size:24px !important;
    }
    #inventory-panel .inventory-close {
      width:36px !important;
      height:36px !important;
      right:9px !important;
      top:6px !important;
      font-size:22px !important;
      border-width:3px !important;
    }
    #inventory-panel .inventory-tabs {
      margin:6px 8px 0 !important;
      gap:5px !important;
    }
    #inventory-panel .inventory-tab {
      min-height:40px !important;
      font-size:10px !important;
      border-width:3px !important;
    }
    #inventory-panel .inventory-bag {
      grid-template-columns:repeat(8,minmax(44px,1fr)) !important;
      grid-auto-rows:minmax(44px,1fr) !important;
      gap:6px !important;
      padding:10px !important;
    }
    #inventory-panel .inventory-bag .inventory-slot {
      min-height:44px !important;
      border-width:3px !important;
    }
    #inventory-panel .item-icon { transform:scale(.64) !important; }
    #inventory-panel .inventory-count {
      right:3px !important;
      bottom:2px !important;
      font-size:9px !important;
      padding:1px 2px !important;
    }
    #inventory-panel .inventory-footer {
      min-height:58px !important;
      gap:10px !important;
      padding:8px 2px 0 !important;
      grid-template-columns:1fr 104px 104px 58px !important;
    }
    #inventory-panel .inventory-weight {
      gap:8px !important;
      font-size:14px !important;
    }
    #inventory-panel .inventory-weight-icon {
      width:24px !important;
      height:22px !important;
      font-size:10px !important;
    }
    #inventory-panel .inventory-weight-bar {
      width:min(190px,20vw) !important;
      height:12px !important;
    }
    #inventory-panel .inventory-action {
      min-height:38px !important;
      font-size:12px !important;
      border-width:3px !important;
    }
    #inventory-panel #inventory-trash { font-size:20px !important; }
    @media (max-width:1000px) {
      #inventory-panel {
        right:14px !important;
        top:102px !important;
        width:calc(100vw - 28px) !important;
        height:min(540px,calc(100vh - 132px)) !important;
        max-height:calc(100vh - 132px) !important;
      }
      #inventory-panel .inventory-bag { grid-template-columns:repeat(6,1fr) !important; }
      #inventory-panel .inventory-tabs { grid-template-columns:repeat(3,1fr) !important; }
    }
    /* === End side compact inventory sizing === */
  
    /* === Smaller side inventory + larger icons === */
    #inventory-panel {
      right:58px !important;
      top:124px !important;
      width:min(690px,calc(100vw - 140px)) !important;
      height:min(500px,calc(100vh - 170px)) !important;
      max-height:calc(100vh - 170px) !important;
      padding:9px 10px 10px !important;
      grid-template-rows:42px 36px 1fr 52px !important;
    }
    #inventory-panel .inventory-heading {
      min-height:42px !important;
      padding:0 42px !important;
      font-size:21px !important;
    }
    #inventory-panel .inventory-close {
      width:31px !important;
      height:31px !important;
      right:8px !important;
      top:5px !important;
      font-size:19px !important;
    }
    #inventory-panel .inventory-tabs {
      margin:5px 7px 0 !important;
      gap:4px !important;
    }
    #inventory-panel .inventory-tab {
      min-height:35px !important;
      font-size:9px !important;
    }
    #inventory-panel .inventory-bag {
      grid-template-columns:repeat(8,minmax(40px,1fr)) !important;
      grid-auto-rows:minmax(40px,1fr) !important;
      gap:5px !important;
      padding:8px !important;
    }
    #inventory-panel .inventory-bag .inventory-slot {
      min-height:40px !important;
    }
    #inventory-panel .item-icon {
      width:30px !important;
      height:30px !important;
      transform:scale(1.05) !important;
      background-size:contain !important;
      background-position:center !important;
      background-repeat:no-repeat !important;
    }
    #inventory-panel .inventory-count {
      right:2px !important;
      bottom:1px !important;
      font-size:8px !important;
    }
    #inventory-panel .inventory-footer {
      min-height:52px !important;
      gap:8px !important;
      padding:7px 1px 0 !important;
      grid-template-columns:1fr 92px 92px 50px !important;
    }
    #inventory-panel .inventory-weight {
      gap:7px !important;
      font-size:13px !important;
    }
    #inventory-panel .inventory-weight-bar {
      width:min(160px,18vw) !important;
      height:10px !important;
    }
    #inventory-panel .inventory-action {
      min-height:34px !important;
      font-size:10px !important;
    }
    #inventory-panel #inventory-trash { font-size:18px !important; }
    @media (max-width:1000px) {
      #inventory-panel {
        right:12px !important;
        top:100px !important;
        width:calc(100vw - 24px) !important;
        height:min(500px,calc(100vh - 130px)) !important;
        max-height:calc(100vh - 130px) !important;
      }
    }
    /* === End smaller side inventory + larger icons === */
  
    /* === Smaller inventory + readable seed icons === */
    #inventory-panel {
      right:50px !important;
      top:132px !important;
      width:min(640px,calc(100vw - 136px)) !important;
      height:min(460px,calc(100vh - 180px)) !important;
      max-height:calc(100vh - 180px) !important;
      padding:8px 9px 9px !important;
      grid-template-rows:38px 32px 1fr 48px !important;
    }
    #inventory-panel .inventory-heading {
      min-height:38px !important;
      padding:0 38px !important;
      font-size:19px !important;
    }
    #inventory-panel .inventory-close {
      width:28px !important;
      height:28px !important;
      right:7px !important;
      top:5px !important;
      font-size:17px !important;
    }
    #inventory-panel .inventory-tabs {
      margin:4px 6px 0 !important;
      gap:4px !important;
    }
    #inventory-panel .inventory-tab {
      min-height:31px !important;
      font-size:8px !important;
      border-width:2px !important;
    }
    #inventory-panel .inventory-bag {
      grid-template-columns:repeat(8,minmax(38px,1fr)) !important;
      grid-auto-rows:minmax(38px,1fr) !important;
      gap:5px !important;
      padding:7px !important;
    }
    #inventory-panel .inventory-bag .inventory-slot {
      min-height:38px !important;
      border-width:3px !important;
    }
    #inventory-panel .item-icon {
      width:31px !important;
      height:31px !important;
      transform:scale(1.08) !important;
    }
    #inventory-panel .item-icon.seed-tomato,
    #inventory-panel .item-icon.seed-carrot,
    #inventory-panel .item-icon.seed-corn,
    #inventory-panel .item-icon.seed-potato,
    #inventory-panel .item-icon.seed-wheat,
    #inventory-panel .item-icon.seed-pumpkin,
    #inventory-panel .item-icon.seed-strawberry {
      width:39px !important;
      height:39px !important;
      transform:scale(1.22) !important;
      image-rendering:pixelated !important;
    }
    #inventory-panel .inventory-count {
      right:2px !important;
      bottom:1px !important;
      font-size:8px !important;
    }
    #inventory-panel .inventory-footer {
      min-height:48px !important;
      gap:7px !important;
      padding:6px 1px 0 !important;
      grid-template-columns:1fr 84px 84px 46px !important;
    }
    #inventory-panel .inventory-weight {
      gap:6px !important;
      font-size:12px !important;
    }
    #inventory-panel .inventory-weight-icon {
      width:22px !important;
      height:20px !important;
    }
    #inventory-panel .inventory-weight-bar {
      width:min(140px,16vw) !important;
      height:9px !important;
    }
    #inventory-panel .inventory-action {
      min-height:31px !important;
      font-size:9px !important;
    }
    #inventory-panel #inventory-trash { font-size:16px !important; }
    @media (max-width:1000px) {
      #inventory-panel {
        right:10px !important;
        top:96px !important;
        width:calc(100vw - 20px) !important;
        height:min(470px,calc(100vh - 126px)) !important;
        max-height:calc(100vh - 126px) !important;
      }
    }
    /* === End smaller inventory + readable seed icons === */
  
    /* === Bigger inventory seed icons only === */
    #inventory-panel .item-icon.seed-tomato,
    #inventory-panel .item-icon.seed-carrot,
    #inventory-panel .item-icon.seed-corn,
    #inventory-panel .item-icon.seed-potato,
    #inventory-panel .item-icon.seed-wheat,
    #inventory-panel .item-icon.seed-pumpkin,
    #inventory-panel .item-icon.seed-strawberry {
      width:48px !important;
      height:48px !important;
      transform:scale(1.18) !important;
      background-size:contain !important;
      background-position:center !important;
      background-repeat:no-repeat !important;
      image-rendering:pixelated !important;
    }
    /* === End bigger inventory seed icons only === */
  
    /* === Player profile panel === */
    #status-bars { cursor:pointer; }
    #profile-panel { position:absolute; z-index:78; left:275px; top:92px; width:min(760px,calc(100vw - 330px)); display:none; grid-template-columns:176px 1fr 50px; gap:18px; padding:20px; border:5px solid #171011; border-radius:18px; background:linear-gradient(180deg,#33251a,#171311); box-shadow:0 0 0 4px #d7a25a,0 0 0 8px rgba(41,26,17,.85),12px 12px 0 rgba(0,0,0,.42),inset 0 2px rgba(255,231,166,.14); color:#fff0bb; font-family:monospace; image-rendering:pixelated; }
    #profile-panel.open { display:grid; }
    .profile-portrait { width:158px; height:158px; display:grid; place-items:center; border:5px solid #171011; border-radius:12px; background:linear-gradient(180deg,#86cce5,#4c8f74 66%,#365f2d); box-shadow:0 0 0 4px #e1b75b,inset 0 0 0 3px rgba(255,255,255,.12),6px 6px 0 rgba(0,0,0,.28); overflow:hidden; }
    #profile-avatar { width:142px; height:142px; image-rendering:pixelated; }
    .profile-main { display:grid; gap:12px; align-content:start; min-width:0; }
    .profile-title { display:flex; align-items:center; justify-content:center; gap:14px; margin:0; color:#fff4d0; font:900 40px/1 monospace; text-shadow:4px 4px #171011; letter-spacing:.04em; }
    .profile-title::before,.profile-title::after { content:'?'; color:#78a04c; font-size:30px; text-shadow:2px 2px #17200f; }
    .profile-level-row { display:grid; grid-template-columns:auto 1fr 58px; gap:14px; align-items:center; color:#ffd84c; font:900 27px/1 monospace; text-shadow:3px 3px #171011; }
    .profile-bar-frame { height:32px; border:4px solid #171011; border-radius:10px; background:#14100d; overflow:hidden; box-shadow:inset 2px 2px rgba(255,255,255,.08),inset -3px -3px rgba(0,0,0,.35); }
    .profile-fill { display:block; height:100%; width:0%; background:linear-gradient(90deg,#f5a600,#ffdd4d 70%,#f7a92b); box-shadow:inset 0 6px rgba(255,255,255,.18); }
    .profile-stat-row { display:grid; grid-template-columns:56px 1fr; gap:12px; align-items:center; }
    .profile-stat-icon { width:50px; height:50px; display:grid; place-items:center; border:4px solid #171011; border-radius:10px; background:linear-gradient(180deg,#5a3a25,#221915); box-shadow:inset 2px 2px rgba(255,223,155,.16),3px 3px rgba(0,0,0,.28); font:900 31px/1 monospace; color:#ffd95d; text-shadow:2px 2px #171011; }
    .profile-stat-bar { height:46px; display:grid; align-items:center; position:relative; border:4px solid #171011; border-radius:10px; overflow:hidden; background:#1a130f; box-shadow:inset 2px 2px rgba(255,255,255,.08),inset -3px -3px rgba(0,0,0,.35); }
    .profile-stat-bar .profile-fill { position:absolute; inset:0 auto 0 0; }
    .profile-fill.health { background:linear-gradient(90deg,#c90021,#f2242d 75%,#ff5a45); }
    .profile-fill.energy { background:linear-gradient(90deg,#d98800,#ffc22e 75%,#ffdd65); }
    .profile-stat-text { position:relative; z-index:1; padding-left:24px; color:#fff7db; font:900 25px/1 monospace; text-shadow:3px 3px #171011; }
    .profile-currency { height:48px; display:flex; align-items:center; gap:14px; padding:0 20px; border:4px solid #171011; border-radius:10px; background:linear-gradient(180deg,#362315,#1b140f); color:#fff7db; font:900 25px/1 monospace; text-shadow:3px 3px #171011; }
    .profile-currencies { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
    .profile-crop-icon, .profile-gold-icon { width:38px; height:38px; border:4px solid #171011; border-radius:50%; image-rendering:pixelated; }
    .profile-crop-icon { background:url('../../assets/gameplay/crops/produce/tomato.png') center/contain no-repeat,#d69a29; }
    .profile-gold-icon { background:url('../../assets/gameplay/mining/drops/gold-drop.png') center/contain no-repeat,#d69a29; }
    #profile-gear { width:50px; height:50px; border:4px solid #171011; border-radius:8px; background:linear-gradient(180deg,#8a5c2f,#3a2818); color:#ffcf64; font:900 30px/1 monospace; text-shadow:2px 2px #171011; box-shadow:inset 2px 2px rgba(255,227,157,.18),3px 3px rgba(0,0,0,.34); cursor:pointer; }
    @media (max-width:1000px) { #profile-panel { left:14px; top:120px; width:calc(100vw - 28px); grid-template-columns:112px 1fr 42px; gap:10px; padding:12px; } .profile-portrait { width:104px; height:104px; } #profile-avatar { width:92px; height:92px; } .profile-title { font-size:24px; } .profile-level-row { grid-template-columns:auto 1fr 44px; font-size:17px; gap:8px; } .profile-stat-icon { width:38px; height:38px; font-size:23px; } .profile-stat-row { grid-template-columns:42px 1fr; gap:8px; } .profile-stat-bar { height:36px; } .profile-stat-text,.profile-currency { font-size:17px; } #profile-gear { width:40px; height:40px; font-size:24px; } }

    /* === Profile replaces old top HUD === */
    #status-bars { display:none !important; }
    #profile-panel {
      display:grid !important;
      left:18px;
      top:18px;
      width:min(760px,calc(100vw - 36px));
      z-index:74;
      pointer-events:auto;
    }
    #profile-panel.open { display:grid !important; }
    @media (max-width:900px) {
      #profile-panel { left:12px; top:12px; width:calc(100vw - 24px); }
    }
    /* === End profile replaces old top HUD === */

    /* === Compact profile HUD size fix === */
    #profile-panel {
      left:16px !important;
      top:16px !important;
      width:430px !important;
      grid-template-columns:92px 1fr 38px !important;
      gap:10px !important;
      padding:11px 12px !important;
      border-width:4px !important;
      border-radius:14px !important;
      box-shadow:0 0 0 3px #d7a25a,0 0 0 6px rgba(41,26,17,.85),7px 7px 0 rgba(0,0,0,.34),inset 0 2px rgba(255,231,166,.14) !important;
    }
    #profile-panel .profile-portrait {
      width:82px !important;
      height:82px !important;
      border-width:4px !important;
      border-radius:10px !important;
      box-shadow:0 0 0 3px #e1b75b,inset 0 0 0 2px rgba(255,255,255,.12),4px 4px 0 rgba(0,0,0,.24) !important;
    }
    #profile-avatar { width:78px !important; height:78px !important; }
    #profile-panel .profile-main { gap:6px !important; }
    #profile-panel .profile-title {
      justify-content:flex-start !important;
      gap:8px !important;
      font-size:24px !important;
      text-shadow:3px 3px #171011 !important;
      letter-spacing:0 !important;
    }
    #profile-panel .profile-title::before,
    #profile-panel .profile-title::after { font-size:18px !important; }
    #profile-panel .profile-level-row {
      grid-template-columns:auto 1fr 38px !important;
      gap:8px !important;
      font-size:16px !important;
      text-shadow:2px 2px #171011 !important;
    }
    #profile-panel .profile-bar-frame { height:20px !important; border-width:3px !important; border-radius:7px !important; }
    #profile-panel .profile-stat-row { grid-template-columns:34px 1fr !important; gap:7px !important; }
    #profile-panel .profile-stat-icon {
      width:28px !important;
      height:28px !important;
      border-width:3px !important;
      border-radius:7px !important;
      font-size:19px !important;
    }
    #profile-panel .profile-stat-bar { height:27px !important; border-width:3px !important; border-radius:7px !important; }
    #profile-panel .profile-stat-text { padding-left:14px !important; font-size:16px !important; text-shadow:2px 2px #171011 !important; }
    #profile-panel .profile-currency {
      height:27px !important;
      gap:8px !important;
      padding:0 11px !important;
      border-width:3px !important;
      border-radius:7px !important;
      font-size:15px !important;
      text-shadow:2px 2px #171011 !important;
    }
    #profile-panel .profile-crop-icon, #profile-panel .profile-gold-icon { width:23px !important; height:23px !important; border-width:3px !important; }
    #profile-gear {
      width:34px !important;
      height:34px !important;
      border-width:3px !important;
      border-radius:7px !important;
      font-size:20px !important;
    }
    @media (max-width:650px) {
      #profile-panel {
        width:calc(100vw - 24px) !important;
        grid-template-columns:76px 1fr 34px !important;
        padding:9px !important;
      }
      #profile-panel .profile-portrait { width:68px !important; height:68px !important; }
      #profile-avatar { width:64px !important; height:64px !important; }
      #profile-panel .profile-title { font-size:19px !important; }
    }
    /* === End compact profile HUD size fix === */

    /* === Smaller profile HUD final pass === */
    #profile-panel {
      left:12px !important;
      top:12px !important;
      width:330px !important;
      grid-template-columns:64px 1fr 28px !important;
      gap:7px !important;
      padding:8px 9px !important;
      border-width:3px !important;
      border-radius:11px !important;
      box-shadow:0 0 0 2px #d7a25a,0 0 0 4px rgba(41,26,17,.85),5px 5px 0 rgba(0,0,0,.3),inset 0 1px rgba(255,231,166,.14) !important;
    }
    #profile-panel .profile-portrait {
      width:56px !important;
      height:56px !important;
      border-width:3px !important;
      border-radius:8px !important;
      box-shadow:0 0 0 2px #e1b75b,inset 0 0 0 1px rgba(255,255,255,.12),3px 3px 0 rgba(0,0,0,.22) !important;
    }
    #profile-avatar { width:54px !important; height:54px !important; }
    #profile-panel .profile-main { gap:4px !important; }
    #profile-panel .profile-title {
      gap:5px !important;
      font-size:18px !important;
      text-shadow:2px 2px #171011 !important;
      line-height:1 !important;
    }
    #profile-panel .profile-title::before,
    #profile-panel .profile-title::after { font-size:13px !important; }
    #profile-panel .profile-level-row {
      grid-template-columns:auto 1fr 26px !important;
      gap:5px !important;
      font-size:12px !important;
      text-shadow:1px 1px #171011 !important;
    }
    #profile-panel .profile-bar-frame { height:14px !important; border-width:2px !important; border-radius:5px !important; }
    #profile-panel .profile-stat-row { grid-template-columns:24px 1fr !important; gap:5px !important; }
    #profile-panel .profile-stat-icon {
      width:20px !important;
      height:20px !important;
      border-width:2px !important;
      border-radius:5px !important;
      font-size:14px !important;
      text-shadow:1px 1px #171011 !important;
    }
    #profile-panel .profile-stat-bar { height:20px !important; border-width:2px !important; border-radius:5px !important; }
    #profile-panel .profile-stat-text { padding-left:10px !important; font-size:12px !important; text-shadow:1px 1px #171011 !important; }
    #profile-panel .profile-currency {
      height:20px !important;
      gap:5px !important;
      padding:0 8px !important;
      border-width:2px !important;
      border-radius:5px !important;
      font-size:12px !important;
      text-shadow:1px 1px #171011 !important;
    }
    #profile-panel .profile-crop-icon, #profile-panel .profile-gold-icon { width:16px !important; height:16px !important; border-width:2px !important; }
    #profile-gear {
      width:25px !important;
      height:25px !important;
      border-width:2px !important;
      border-radius:5px !important;
      font-size:15px !important;
      text-shadow:1px 1px #171011 !important;
    }
    @media (max-width:650px) {
      #profile-panel {
        width:300px !important;
        max-width:calc(100vw - 20px) !important;
        grid-template-columns:56px 1fr 26px !important;
      }
      #profile-panel .profile-portrait { width:50px !important; height:50px !important; }
      #profile-avatar { width:48px !important; height:48px !important; }
      #profile-panel .profile-title { font-size:16px !important; }
    }
    /* === End smaller profile HUD final pass === */

    /* === Simple scene/map system === */
    .scene-layer { position:absolute; inset:0; z-index:2; pointer-events:auto; }
    .scene-layer[hidden] { display:none !important; }
    .scene-portal { position:absolute; z-index:18; min-width:118px; padding:9px 12px; border:3px solid #241722; background:linear-gradient(180deg,#8b5d31,#4b332c); color:#fff0bb; font:900 12px/1 monospace; text-shadow:2px 2px #241722; box-shadow:0 0 0 2px #d49b54,4px 4px 0 rgba(13,10,20,.48); cursor:pointer; image-rendering:pixelated; }
    .scene-portal:hover { filter:brightness(1.12); transform:translateY(-1px); }
    #lake-scene { overflow:hidden; background:#05070a; }
    #lake-scene .lake-map-image { position:absolute; left:50%; top:0; width:auto; height:100%; transform:translateX(-50%); object-fit:contain; object-position:center; image-rendering:auto; pointer-events:none; user-select:none; }
    body.scene-lake main {
      background:#05070a;
      background-image:none;
    }
    body.scene-lake #world {
      background:#05070a;
    }
    #lake-to-city { left:50%; top:91%; transform:translate(-50%,-50%); }
    #blacksmith-scene { overflow:hidden; background:radial-gradient(circle at 50% 48%,#4b2d1b 0%,#21150f 48%,#090807 100%); }
    #blacksmith-scene .blacksmith-map-image {
      position:absolute;
      left:22%;
      top:0;
      width:56%;
      height:100%;
      object-fit:fill;
      image-rendering:auto;
      pointer-events:none;
      user-select:none;
      filter:drop-shadow(0 0 24px rgba(0,0,0,.82));
    }
    #blacksmith-to-city { left:50%; top:91%; transform:translate(-50%,-50%); }
    body.scene-blacksmith #minimap,
    body.scene-blacksmith #view-toggle,
    body.scene-blacksmith #creator-toggle { display:none !important; }
    #lake-to-city:hover { transform:translate(-50%,-54%); }
    #plot-to-city { left:50%; top:10%; transform:translate(-50%,-50%); }
    #plot-to-city:hover { transform:translate(-50%,-54%); }
    body.scene-city #placement-grid,
    body.scene-city #farm-grid,
    body.scene-lake #placement-grid,
    body.scene-lake #farm-grid { display:none !important; }
    /* === City clean design view === */
    body.scene-city.city-clean-view #status-bars,
    body.scene-city.city-clean-view #quick-hub,
    body.scene-city.city-clean-view #inventory,
    body.scene-city.city-clean-view #inventory-panel,
    body.scene-city.city-clean-view #skills-panel,
    body.scene-city.city-clean-view #character-panel,
    body.scene-city.city-clean-view #settings-panel,
    body.scene-city.city-clean-view #profile-panel,
    body.scene-city.city-clean-view #minimap,
    body.scene-city.city-clean-view #view-toggle,
    body.scene-city.city-clean-view #creator-toggle,
    body.scene-city.city-clean-view #rock-coordinates,
    body.scene-city.city-clean-view #collision-label,
    body.scene-city.city-clean-view #collision-layer,
    body.scene-city.city-clean-view #loot-toast,
    body.scene-city.city-clean-view #hint,
    body.scene-city.city-clean-view #city-to-plot {
      display:none !important;
    }
    /* === End city clean design view === */
    /* === End simple scene/map system === */
    /* === Game settings panel === */
    #character-panel { position:absolute; }
    #character-settings {
      position:absolute;
      right:14px;
      top:12px;
      width:36px;
      height:34px;
      display:grid;
      place-items:center;
      border:3px solid #20171f;
      border-radius:5px;
      background:linear-gradient(180deg,#8a5c2f,#3a2818);
      color:#ffcf64;
      font:900 20px/1 monospace;
      text-shadow:2px 2px #171011;
      box-shadow:inset 2px 2px rgba(255,227,157,.18),3px 3px rgba(0,0,0,.34);
      cursor:pointer;
    }
    #settings-panel {
      position:absolute;
      z-index:79;
      left:370px;
      top:98px;
      width:320px;
      padding:14px;
      border:4px solid #1d151d;
      border-radius:7px;
      background:linear-gradient(180deg,#5b3d32,#2c222e);
      box-shadow:0 0 0 3px #d49853,0 0 0 6px rgba(31,20,25,.7),8px 8px 0 rgba(13,10,20,.55),inset 0 2px rgba(255,231,166,.14);
      color:#fff0bb;
      font-family:monospace;
      opacity:0;
      pointer-events:none;
      transform:translateY(-8px) scale(.96);
      transition:opacity .12s ease, transform .12s ease;
    }
    #settings-panel.open { opacity:1; pointer-events:auto; transform:translateY(0) scale(1); }
    .settings-title { display:flex; align-items:center; justify-content:space-between; margin:0 0 12px; color:#ffe39a; font:900 18px/1 monospace; text-shadow:2px 2px #241722; }
    .settings-row { display:grid; grid-template-columns:104px 1fr; gap:10px; align-items:center; margin:10px 0; font:900 12px/1 monospace; }
    .settings-row label { color:#fff0bb; text-shadow:1px 1px #241722; }
    .settings-row select,
    .settings-row button {
      min-height:30px;
      border:2px solid #20171f;
      border-radius:4px;
      background:linear-gradient(180deg,#7c5234,#352331);
      color:#fff0bb;
      font:900 12px/1 monospace;
      text-shadow:1px 1px #241722;
      cursor:pointer;
    }
    .settings-row button.active { background:linear-gradient(180deg,#3f8f58,#25623f); color:#fff8c8; }
    .settings-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:12px; }
    .settings-close { min-width:86px; min-height:31px; border:2px solid #20171f; border-radius:4px; background:linear-gradient(180deg,#b76543,#7c3d32); color:#fff0bb; font:900 12px/1 monospace; cursor:pointer; }
    body.quality-low * { animation:none !important; transition:none !important; }
    body.quality-low #map, body.quality-low .placed-tree, body.quality-low .rock { filter:saturate(.92); }
    body.quality-high #map { filter:saturate(1.08) contrast(1.03); }
    @media (max-width:900px) { #settings-panel { left:12px; top:118px; width:min(320px,calc(100vw - 24px)); } }
    #minimap {
      position:absolute;
      right:72px;
      top:14px;
      z-index:57;
      width:174px;
      padding:7px;
      border:3px solid #1f1720;
      border-radius:7px;
      background:linear-gradient(180deg,#513526,#231922);
      box-shadow:0 0 0 2px #d39a51,0 0 0 5px rgba(34,23,20,.58),5px 5px 0 rgba(13,10,16,.45),inset 0 2px rgba(255,235,166,.14);
      image-rendering:pixelated;
    }
    #minimap::before {
      content:'MAPA';
      display:block;
      margin:0 0 5px;
      color:#fff0b8;
      font:900 10px/1 monospace;
      letter-spacing:1px;
      text-align:center;
      text-shadow:2px 2px #241722;
    }
    #minimap-canvas {
      display:block;
      width:100%;
      height:126px;
      border:2px solid #171219;
      background:#111029;
      box-shadow:inset 0 0 0 2px rgba(255,227,154,.08);
      image-rendering:pixelated;
    }
    @media (max-width:900px) { #minimap { right:58px; top:10px; width:148px; } #minimap-canvas { height:108px; } }
    /* === End game settings panel === */
    /* === End player profile panel === */
  

    /* CODEX_FISHING_FEATURE_START */
    .player-tool.fishing { left:-20px; top:-25px; width:62px; height:62px; background:url('../../assets/gameplay/fishing/fishing-rod.png') center/contain no-repeat; filter:drop-shadow(1px 2px 0 rgba(20,15,29,.45)); transform-origin:45px 50px; transform:rotate(18deg); z-index:7; }
    .player.equipped-fishing-rod .player-tool.fishing { opacity:1; }
    .player.cast-fishing .player-tool.fishing { animation:fishing-cast .62s steps(4,end); }
    @keyframes fishing-cast { 0% { transform:rotate(18deg) translate(0,0); } 45% { transform:rotate(54deg) translate(2px,-4px); } 100% { transform:rotate(18deg) translate(0,0); } }
    .item-icon.fishing-rod, .item-icon.fish-item { width:36px; height:36px; image-rendering:pixelated; background-position:center; background-repeat:no-repeat; background-size:contain; }
    .item-icon.fishing-rod { background-image:url('../../assets/gameplay/fishing/fishing-rod.png'); }
    .item-icon.fish-item { background-image:var(--fish-icon); filter:drop-shadow(1px 2px 0 rgba(0,0,0,.42)); }
    .inventory-slot.rarity-legendary { box-shadow:inset 0 0 0 2px rgba(255,205,74,.44); }
    .inventory-slot.rarity-divine { box-shadow:inset 0 0 0 2px rgba(106,231,255,.52); }
    .inventory-slot.rarity-celestial { box-shadow:inset 0 0 0 2px rgba(214,145,255,.6); }
    .fisher-fish-list { display:flex; flex-direction:column; gap:8px; max-height:260px; overflow:auto; padding-right:4px; }
    .fisher-empty { color:#cdb790; font-size:11px; line-height:1.5; }    #fisher-dialog { position:fixed; z-index:48; left:50%; top:50%; transform:translate(-50%,-50%); width:min(430px,calc(100vw - 28px)); padding:14px; border:4px solid #221a22; background:linear-gradient(180deg,#5c392b,#321f22); box-shadow:0 0 0 3px #b5793e,8px 8px 0 rgba(0,0,0,.55); color:#ffe9a8; font:12px/1.35 monospace; display:none; }
    #fisher-dialog.open { display:block; }
    .fisher-title { margin:0 0 8px; color:#fff0ba; font:900 19px/1 monospace; text-shadow:2px 2px #1d1520; }
    .fisher-text { margin:0 0 12px; color:#f8dca0; }
    .fisher-row { display:grid; grid-template-columns:46px 1fr auto; gap:10px; align-items:center; padding:8px; border:2px solid #2c2030; background:rgba(35,24,28,.72); margin:7px 0; }
    .fisher-row .item-icon { transform:none; }
    .fisher-row strong { display:block; color:#fff5bf; }
    .fisher-row small { color:#d8b982; }
    .fisher-actions { display:flex; gap:8px; justify-content:flex-end; margin-top:12px; flex-wrap:wrap; }
    .fisher-btn { border:3px solid #241923; background:#8d5834; color:#fff0bb; font:900 12px/1 monospace; padding:9px 12px; cursor:pointer; box-shadow:inset 2px 2px rgba(255,225,155,.25), inset -3px -3px rgba(0,0,0,.38); }
    .fisher-btn:hover { filter:brightness(1.14); }
    .fisher-btn:disabled { opacity:.48; cursor:not-allowed; filter:saturate(.45); }
    .fisher-close { background:#943f35; }
    #blacksmith-dialog { position:fixed; z-index:50; left:50%; top:50%; transform:translate(-50%,-50%); width:min(470px,calc(100vw - 28px)); padding:15px; border:4px solid #211820; border-radius:8px; background:linear-gradient(180deg,#68402b,#352329); box-shadow:0 0 0 3px #d18a3e,9px 9px 0 rgba(0,0,0,.58),inset 0 2px rgba(255,225,155,.14); color:#ffe9a8; font:12px/1.4 monospace; display:none; }
    #blacksmith-dialog.open { display:block; }
    .blacksmith-heading { display:flex; align-items:center; gap:10px; margin-bottom:10px; padding:9px 11px; border:2px solid #261a1d; background:linear-gradient(180deg,#9a5931,#613522); box-shadow:inset 0 2px rgba(255,227,155,.2); }
    .blacksmith-heading h2 { flex:1; margin:0; color:#fff0ba; font:900 18px/1 monospace; text-shadow:2px 2px #29171b; }
    .blacksmith-close { border:2px solid #25171b; border-radius:4px; background:#9b4135; color:#fff2bd; font:900 13px/1 monospace; padding:6px 9px; cursor:pointer; }
    .blacksmith-product { display:grid; grid-template-columns:54px minmax(0,1fr) auto; gap:11px; align-items:center; padding:11px; border:2px solid #332129; border-radius:6px; background:rgba(39,25,28,.72); }
    .blacksmith-product .item-icon { transform:none; }
    .blacksmith-product strong,.blacksmith-product small { display:block; }
    .blacksmith-product small { margin-top:4px; color:#e2c68e; }
    .blacksmith-price { margin-top:5px; color:#ffd65f; font-weight:900; }
    .blacksmith-note { margin:11px 1px 0; padding:9px; border:1px dashed #c58c52; background:rgba(255,224,151,.08); color:#e6c994; }
    #market-dialog {
      position:fixed; z-index:49; left:50%; top:50%; transform:translate(-50%,-50%);
      width:min(840px,calc(100vw - 28px)); max-height:min(740px,calc(100vh - 28px)); overflow:auto;
      padding:14px; border:4px solid #244838; border-radius:15px;
      background:linear-gradient(180deg,#fff9df,#eadfb7);
      box-shadow:0 0 0 4px #d7a84c,9px 9px 0 rgba(18,39,31,.48);
      color:#294035; font:12px/1.35 monospace; display:none;
    }
    #market-dialog.open { display:block; }
    .market-heading { display:flex; align-items:center; gap:10px; padding:11px 13px; border:3px solid #284b3b; border-radius:9px; background:linear-gradient(#4f8464,#35634d); color:#fff8d5; }
    .market-heading h2 { flex:1; margin:0; font:900 21px/1 monospace; text-shadow:2px 2px #21382e; }
    .market-local-badge { padding:5px 8px; border:2px solid #e6c768; border-radius:999px; background:#fff4b9; color:#4b5e35; font:900 10px/1 monospace; }
    .market-close { width:30px; height:30px; border:2px solid #263f34; border-radius:7px; background:#a6493d; color:white; font:900 15px/1 monospace; cursor:pointer; }
    .market-intro { margin:10px 2px; color:#496052; }
    .market-tabs { display:flex; gap:7px; margin-bottom:10px; }
    .market-tab { flex:1; padding:9px; border:2px solid #4c6d59; border-radius:8px; background:#dce8c5; color:#345242; font:900 11px/1 monospace; cursor:pointer; }
    .market-tab.active { background:#477b5d; color:#fff8d5; box-shadow:inset 0 -3px rgba(0,0,0,.15); }
    .market-list { display:flex; flex-direction:column; gap:8px; min-height:120px; }
    .market-empty { display:grid; place-items:center; min-height:116px; padding:14px; border:2px dashed #8da081; border-radius:10px; background:rgba(255,255,255,.34); color:#687461; text-align:center; }
    .market-row { display:grid; grid-template-columns:48px minmax(0,1fr) auto; gap:10px; align-items:center; padding:9px; border:2px solid #809477; border-radius:10px; background:#fffaf0; }
    .market-row strong,.market-row small { display:block; }
    .market-row small { margin-top:3px; color:#6c7564; }
    .market-row .item-icon { transform:none; }
    .market-btn { padding:9px 11px; border:2px solid #2f513f; border-radius:7px; background:#4f8464; color:#fff9dc; font:900 11px/1 monospace; cursor:pointer; box-shadow:inset 0 -3px rgba(0,0,0,.14); }
    .market-btn:hover { filter:brightness(1.08); }
    .market-btn:disabled { opacity:.45; cursor:not-allowed; }
    .market-btn.cancel { background:#9d5044; }
    .market-sell-form { display:grid; grid-template-columns:minmax(150px,1fr) 90px 125px auto; gap:8px; align-items:end; padding:12px; border:2px solid #809477; border-radius:10px; background:rgba(255,255,255,.46); }
    .market-item-field { grid-column:1/-1; }
    .market-item-grid { display:flex; gap:8px; padding:8px; overflow-x:auto; border:2px solid #789078; border-radius:9px; background:#eef2d7; }
    .market-item-choice { position:relative; flex:0 0 58px; width:58px; height:58px; display:grid; place-items:center; border:3px solid #a6b591; border-radius:9px; background:#fffaf0; cursor:pointer; box-shadow:inset 0 -4px rgba(58,89,67,.12); }
    .market-item-choice:hover:not(:disabled) { transform:translateY(-2px); border-color:#4f8464; }
    .market-item-choice.selected { border-color:#295941; background:#dcefc7; box-shadow:0 0 0 2px #e2b94f,inset 0 -4px rgba(58,89,67,.12); }
    .market-item-choice:disabled { opacity:.38; cursor:not-allowed; filter:grayscale(.7); }
    .market-item-choice .item-icon { transform:none; pointer-events:none; }
    .market-item-quantity { position:absolute; right:3px; bottom:3px; min-width:17px; padding:2px 3px; border:1px solid #284b3b; border-radius:5px; background:#416e54; color:#fff9dc; font:900 9px/1 monospace; pointer-events:none; }
    #market-buy-view { display:grid; grid-template-columns:172px minmax(0,1fr); grid-template-areas:"intro intro" "items book"; gap:12px; align-items:start; }
    #market-buy-view[hidden] { display:none; }
    #market-buy-view > .market-intro { grid-area:intro; margin:2px 2px 0; }
    .market-catalog { grid-area:items; min-width:0; padding:9px; border:2px solid #789078; border-radius:11px; background:linear-gradient(180deg,#e8efd1,#d8e3bd); box-shadow:inset 0 0 0 2px rgba(255,255,255,.35); }
    .market-catalog-title { margin-bottom:8px; padding:7px; border-radius:7px; background:#456f57; color:#fff8dc; font:900 11px/1 monospace; text-align:center; letter-spacing:.08em; }
    .market-browse-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-height:365px; overflow-y:auto; padding:2px 4px 2px 2px; }
    .market-orderbook { grid-area:book; min-width:0; min-height:390px; padding:10px; border:2px solid #789078; border-radius:11px; background:rgba(255,253,239,.72); box-shadow:inset 0 0 0 2px rgba(255,255,255,.42); }
    .market-browse-choice { position:relative; width:100%; aspect-ratio:1; min-height:64px; display:grid; place-items:center; border:3px solid #a6b591; border-radius:10px; background:#fffaf0; cursor:pointer; box-shadow:inset 0 -4px rgba(58,89,67,.1); }
    .market-browse-choice:hover,.market-browse-choice.selected { border-color:#295941; background:#dcefc7; box-shadow:0 0 0 2px #e2b94f,inset 0 -4px rgba(58,89,67,.1); }
    .market-browse-choice .item-icon { transform:none; pointer-events:none; }
    .market-offer-count { position:absolute; right:3px; top:3px; min-width:17px; padding:2px 3px; border:1px solid #6c4711; border-radius:999px; background:#d69a2d; color:#fff; font:900 9px/1 monospace; }    .market-orderbook-head { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:7px; padding:8px 10px; border-radius:8px; background:#d7e3bd; color:#315341; }
    .market-orderbook-head small { color:#687461; text-align:right; }
    .market-orderbook .market-empty { min-height:300px; border:1px dashed #9caf88; background:rgba(244,248,220,.72); }
    .market-empty-guide { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; text-align:center; color:#5f6f57; }
    .market-empty-guide strong { color:#2f6148; font-size:13px; letter-spacing:.08em; }
    .market-empty-guide span { max-width:330px; line-height:1.55; }
    .market-row.locked { opacity:.58; background:#e5e3d8; filter:grayscale(.55); }
    .market-lock-note { color:#8b4f45 !important; font-weight:900; }
    .market-price-group { grid-template-columns:48px minmax(0,1fr) minmax(174px,auto); }
    .market-buy-box { display:grid; grid-template-columns:68px minmax(96px,auto); gap:6px; align-items:end; }
    .market-buy-box label { display:flex; flex-direction:column; gap:4px; color:#5d6d5f; font:900 9px/1 monospace; }
    .market-buy-quantity { width:68px; min-width:0; padding:8px 6px; border:2px solid #789078; border-radius:7px; background:#fffdf2; color:#294035; font:900 12px/1 monospace; }
    .market-buy-box .market-btn { min-width:96px; }
    .market-available-note { color:#315d43 !important; font-weight:900; }
    .market-price-open { min-width:128px; }
    .market-seller-head { display:flex; align-items:center; gap:9px; margin-bottom:8px; padding:8px; border:2px solid #8ea080; border-radius:8px; background:#eef2d7; }
    .market-seller-head strong { flex:1; }
    .market-back { border:2px solid #496b58; border-radius:7px; padding:7px 9px; background:#fff9df; color:#345242; font:900 10px/1 monospace; cursor:pointer; }
    .market-seller-row { grid-template-columns:48px minmax(0,1fr) minmax(174px,auto); }
    .market-activity-row { display:grid; grid-template-columns:42px 1fr auto; gap:9px; align-items:center; padding:9px; border:2px solid #91a386; border-radius:9px; background:#fffaf0; }
    .market-activity-row .item-icon { transform:none; }
    .market-activity-row time { color:#727b69; font-size:10px; text-align:right; }
    .market-orderbook .market-list, #market-activity-list, #market-my-list { max-height:285px; overflow:auto; padding-right:3px; }
    .market-field { display:flex; flex-direction:column; gap:5px; color:#4b6254; font-weight:900; }
    .market-field select,.market-field input { min-width:0; padding:9px; border:2px solid #789078; border-radius:7px; background:#fffdf2; color:#294035; font:700 12px monospace; }
    .market-balance { margin:11px 2px 0; text-align:right; color:#73541c; font-weight:900; }
    @media (max-width:700px) { #market-buy-view { grid-template-columns:132px minmax(0,1fr); gap:8px; } .market-browse-grid { grid-template-columns:1fr; max-height:340px; } .market-catalog { padding:6px; } .market-orderbook { padding:7px; } .market-sell-form { grid-template-columns:1fr 1fr; } .market-row { grid-template-columns:42px 1fr; } .market-row .market-btn,.market-row .market-buy-box { grid-column:1/-1; } }
    .fishing-bobber { position:absolute; width:1.2%; aspect-ratio:1; transform:translate(-50%,-50%); z-index:35; pointer-events:none; background:radial-gradient(circle at 50% 32%,#fff 0 24%,#e33b32 25% 55%,#2a1920 56% 70%,transparent 71%); filter:drop-shadow(0 2px 0 rgba(0,0,0,.38)); animation:fishing-bobber 850ms ease-in-out infinite; }
    @keyframes fishing-bobber { 0%,100% { transform:translate(-50%,-50%) translateY(0); } 50% { transform:translate(-50%,-50%) translateY(4px); } }
    .player.cast-fishing #player-sprite { animation:player-fishing-cast .62s steps(4,end); transform-origin:50% 80%; }

    /* === Vista de juego unificada: minimapa, barra rapida e interaccion E === */
    #minimap {
      right:18px; top:16px; width:190px; padding:8px;
      border:1px solid rgba(255,255,255,.18); border-radius:14px;
      background:rgba(27,55,45,.93); box-shadow:0 12px 30px rgba(0,0,0,.25);
      backdrop-filter:blur(8px);
    }
    #minimap::before {
      content:'MAPA'; margin:0 0 7px; color:#f7eed0; font-size:9px;
      letter-spacing:.14em; text-shadow:none;
    }
    #minimap-canvas {
      height:174px; border:0; border-radius:8px; background:#68b7c7;
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
    }
    #quick-hub { top:244px; right:18px; }
    #inventory {
      padding:9px; gap:7px; border:1px solid rgba(255,255,255,.18);
      border-radius:14px; background:rgba(21,46,38,.88);
      box-shadow:0 12px 30px rgba(0,0,0,.28); backdrop-filter:blur(8px);
    }
    #inventory::before { content:none; }
    #inventory .inventory-slot {
      width:52px; height:52px; border:2px solid rgba(255,255,255,.22);
      border-radius:10px; background:#f1e5bd;
      box-shadow:inset 0 -6px rgba(92,68,39,.16),inset 0 1px rgba(255,255,255,.68);
    }
    #inventory .inventory-slot:hover { filter:brightness(1.05); transform:translateY(-3px); }
    #inventory .inventory-slot.active {
      border-color:#f6ca63; background:#f6e9bf;
      box-shadow:0 0 0 3px rgba(246,202,99,.22),inset 0 -6px rgba(92,68,39,.16);
    }
    #inventory .inventory-key { color:#493820; text-shadow:none; }
    #inventory .inventory-count { color:#493820; text-shadow:0 1px #fff3cd; }
    #context-action {
      position:fixed; z-index:75; left:50%; top:70%; min-width:168px;
      padding:9px 14px; transform:translate(-50%,14px);
      border:3px solid #3e6852; border-radius:11px; background:#fff8da;
      box-shadow:0 9px 24px rgba(0,0,0,.28); color:#294035;
      font:900 12px/1 monospace; text-align:center; opacity:0;
      pointer-events:none; transition:opacity .16s,transform .16s;
    }
    #context-action.show { opacity:1; transform:translate(-50%,0); }
    #context-action.disabled { filter:saturate(.45); }
    #context-action kbd {
      display:inline-grid; place-items:center; min-width:25px; height:25px;
      margin-right:7px; border:2px solid #294035; border-radius:5px;
      background:#3f7057; color:#fff8da; box-shadow:inset 0 -3px rgba(0,0,0,.18);
      font:900 12px/1 monospace;
    }
    @media (max-width:900px) {
      #minimap { right:10px; top:10px; width:148px; }
      #minimap-canvas { height:132px; }
      #quick-hub { display:none; }
      #inventory { bottom:10px; gap:3px; padding:6px; }
      #inventory .inventory-slot { width:40px; height:40px; }
    }
    /* === Fin vista de juego unificada === */
    @keyframes player-fishing-cast { 0%,100% { transform:translateY(0) rotate(0deg); } 35% { transform:translateY(-2px) rotate(-4deg); } 62% { transform:translateY(1px) rotate(3deg); } }
    #fishing-minigame { position:fixed; z-index:95; left:50%; bottom:145px; transform:translateX(-50%); width:min(420px,calc(100vw - 40px)); padding:8px 10px 10px; color:#fff1b6; font:900 11px/1 monospace; user-select:none; filter:drop-shadow(0 4px 5px rgba(0,0,0,.55)); }
    #fishing-minigame .fish-title { display:flex; justify-content:space-between; align-items:center; width:78%; margin:0 auto 4px; padding:3px 8px; border-radius:3px; background:rgba(26,17,20,.68); text-shadow:2px 2px #171016; }
    #fishing-minigame .albion-fishing-wrap { position:relative; height:76px; }
    #fishing-minigame .albion-catch-bar { position:absolute; left:8%; right:8%; top:12px; height:20px; border-radius:13px; border:2px solid rgba(18,42,22,.72); background:linear-gradient(90deg,#b42822 0 11%,#f09323 11% 18%,#f09323 82% 89%,#b42822 89% 100%); box-shadow:inset 0 2px rgba(255,255,255,.22), inset 0 -4px rgba(0,0,0,.18),0 2px 0 rgba(0,0,0,.42); overflow:hidden; }
    #fishing-minigame .albion-green-window { position:absolute; top:0; bottom:0; left:18%; right:18%; background:linear-gradient(180deg,#6fe354,#34a83e); box-shadow:inset 0 2px rgba(255,255,255,.24), inset 0 -4px rgba(0,0,0,.16); }
    #fishing-minigame .albion-catch-bar::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent 0 13%,rgba(255,255,255,.14) 14% 17%,transparent 18% 82%,rgba(255,255,255,.14) 83% 86%,transparent 87%); }
    #fishing-minigame .albion-player-marker { position:absolute; top:-1px; left:50%; width:26px; height:38px; transform:translateX(-50%); z-index:4; }
    #fishing-minigame .albion-player-marker::before { content:''; position:absolute; left:7px; top:0; width:12px; height:18px; background:linear-gradient(180deg,#ffd85a,#e58d20); clip-path:polygon(50% 0,100% 48%,62% 48%,62% 100%,38% 100%,38% 48%,0 48%); filter:drop-shadow(1px 2px 0 rgba(0,0,0,.45)); }
    #fishing-minigame .albion-player-marker::after { content:''; position:absolute; left:8px; top:18px; width:10px; height:14px; border-radius:50% 50% 46% 46%; background:linear-gradient(180deg,#ffffff 0 45%,#d63a2d 46% 100%); border:2px solid #54301b; box-shadow:0 2px 0 rgba(0,0,0,.36); }
    #fishing-minigame .albion-fish-bar { position:absolute; left:15%; right:15%; top:42px; height:14px; border-radius:3px; background:linear-gradient(180deg,#58a9d8,#2b78b7); box-shadow:inset 0 2px rgba(255,255,255,.25), inset 0 -3px rgba(0,0,0,.17),0 2px 0 rgba(0,0,0,.40); }
    #fishing-minigame .albion-goal { position:absolute; right:-10px; top:-5px; width:20px; height:24px; background:linear-gradient(180deg,#ffe777,#e7a626); clip-path:polygon(20% 0,100% 50%,20% 100%,46% 50%); filter:drop-shadow(1px 2px 0 rgba(0,0,0,.45)); z-index:2; }
    #fishing-minigame .albion-fish-marker { position:absolute; top:-7px; left:50%; width:30px; height:24px; transform:translateX(-50%); background:center/contain no-repeat; image-rendering:pixelated; filter:brightness(0) invert(1) drop-shadow(1px 2px 0 rgba(0,0,0,.45)); z-index:3; }
    #fishing-minigame .albion-progress { position:absolute; left:18%; right:18%; bottom:0; height:7px; border:2px solid rgba(20,15,29,.75); border-radius:5px; background:rgba(32,18,28,.76); overflow:hidden; }
    #fishing-minigame .albion-progress span { display:block; width:0%; height:100%; background:linear-gradient(90deg,#43cf66,#f1d65b); }
    #fishing-minigame .fish-pull-alert { position:absolute; left:50%; top:32px; transform:translateX(-50%); padding:2px 7px; border:2px solid rgba(72,29,20,.75); border-radius:3px; background:rgba(190,62,35,.86); color:#fff4b8; text-shadow:1px 1px #2a1712; opacity:0; pointer-events:none; transition:opacity 90ms linear; }
    #fishing-minigame.is-pulling .fish-pull-alert { opacity:1; }
    #fishing-minigame.is-pulling .albion-player-marker { filter:drop-shadow(0 0 5px #ffec6a); }
    #fishing-minigame.is-pulling .albion-fish-marker { animation:fish-resist-shake 110ms steps(2,end) infinite; filter:brightness(0) invert(1) drop-shadow(0 0 5px #ffdf58) drop-shadow(1px 2px 0 rgba(0,0,0,.45)); }
    #catch-notice { position:fixed; z-index:120; left:50%; top:29%; transform:translate(-50%,-50%) scale(.94); min-width:280px; max-width:calc(100vw - 36px); padding:16px 18px 15px; border:4px solid #21171e; border-radius:8px; background:linear-gradient(180deg,#714126,#33202a); box-shadow:0 0 0 3px #d49a46,0 12px 0 rgba(0,0,0,.45),0 0 32px rgba(255,209,92,.34); color:#fff0bb; font:900 13px/1.2 monospace; text-align:center; text-shadow:2px 2px #24151b; pointer-events:auto; animation:catch-pop .22s ease-out forwards; }
    #catch-notice .catch-title { display:block; margin-bottom:9px; color:#ffe071; font-size:22px; letter-spacing:0; }
    #catch-notice .catch-fish { display:flex; align-items:center; justify-content:center; gap:12px; margin:8px 0; }
    #catch-notice .catch-fish-icon { width:54px; height:42px; background:var(--catch-icon) center/contain no-repeat; image-rendering:pixelated; filter:drop-shadow(2px 3px 0 rgba(0,0,0,.42)); }
    #catch-notice .catch-name { display:block; color:#ffffff; font-size:15px; }
    #catch-notice .catch-meta { display:block; margin-top:4px; color:#f6c778; font-size:11px; }
    @keyframes catch-pop { from { opacity:0; transform:translate(-50%,-50%) scale(.82); } to { opacity:1; transform:translate(-50%,-50%) scale(1); } }
    @keyframes fish-resist-shake { 0% { margin-left:-7px; } 50% { margin-left:5px; } 100% { margin-left:-5px; } }

    /* CODEX_FISHING_FEATURE_END */

    #stump-size-control { position:fixed; left:16px; bottom:112px; z-index:9999; display:none; width:226px; padding:8px; border:3px solid #2b1c1c; background:rgba(73,54,47,.98); color:#fff0bb; font:700 11px/1.25 monospace; box-shadow:4px 4px 0 rgba(0,0,0,.35); text-shadow:1px 1px #000; pointer-events:auto; }
    body.creator-mode #stump-size-control, body.show-collisions #stump-size-control, body.city-editor-open #stump-size-control, body.lake-editor-open #stump-size-control { display:block; }
    #stump-size-control label { display:block; margin-bottom:6px; }
    .stump-row { display:grid; grid-template-columns:64px 1fr 64px; gap:6px; }
    .stump-row button, .stump-row input { min-height:28px; border:2px solid #2b1c1c; background:#8a5633; color:#fff0bb; font:700 12px monospace; text-align:center; }
    .stump-row input { background:#2f2535; }
  
  /* === CODEX INVENTORY GREEN STYLE START === */
  #inventory-panel {
    border:3px solid #102a22 !important;
    border-radius:18px !important;
    background:linear-gradient(155deg,#285644 0%,#193b31 48%,#102820 100%) !important;
    box-shadow:0 0 0 3px #e7d79f,0 0 0 7px rgba(15,42,34,.92),12px 14px 0 rgba(8,18,15,.5),inset 0 2px rgba(255,255,255,.12) !important;
    color:#f6efd6 !important;
    overflow:hidden !important;
  }
  #inventory-panel .inventory-heading {
    border:0 !important;
    border-bottom:2px solid #c9b875 !important;
    border-radius:13px 13px 7px 7px !important;
    background:linear-gradient(180deg,#fff8df 0%,#eadcae 100%) !important;
    box-shadow:inset 0 -3px rgba(115,91,40,.12),0 4px 0 rgba(8,28,22,.28) !important;
    color:#173f32 !important;
    text-shadow:0 1px #fff !important;
  }
  #inventory-panel .inventory-heading span {
    color:#173f32 !important;
    text-shadow:0 1px #fff !important;
    letter-spacing:.12em !important;
  }
  #inventory-panel .inventory-close {
    border:2px solid #682f29 !important;
    border-radius:9px !important;
    background:linear-gradient(180deg,#d77a59,#a6463a) !important;
    color:#fff9df !important;
    box-shadow:inset 1px 1px rgba(255,255,255,.28),0 3px 0 #642c27 !important;
    text-shadow:1px 1px #642c27 !important;
  }
  #inventory-panel .inventory-close:hover { filter:brightness(1.1) !important; transform:translateY(-1px); }
  #inventory-panel .inventory-tabs {
    padding:0 3px !important;
    border-bottom:2px solid #cfbd7d !important;
  }
  #inventory-panel .inventory-tab {
    border:2px solid #0d261f !important;
    border-bottom:0 !important;
    border-radius:9px 9px 0 0 !important;
    background:linear-gradient(180deg,#2f624f,#1d4437) !important;
    color:#dfe9d8 !important;
    box-shadow:inset 0 1px rgba(255,255,255,.1) !important;
    text-shadow:1px 1px #10251e !important;
    transition:filter .12s ease,transform .12s ease !important;
  }
  #inventory-panel .inventory-tab:hover { filter:brightness(1.12) !important; transform:translateY(-1px); }
  #inventory-panel .inventory-tab.active {
    border-color:#d3be72 !important;
    background:linear-gradient(180deg,#fff5d6,#dccb94) !important;
    color:#174033 !important;
    box-shadow:0 -2px 0 #f5df8c,inset 0 -3px rgba(112,91,41,.13) !important;
    text-shadow:0 1px #fff !important;
  }
  #inventory-panel .inventory-bag {
    border:2px solid #cfbd7d !important;
    border-radius:12px !important;
    background:linear-gradient(180deg,#112d25,#0b211b) !important;
    box-shadow:inset 0 0 0 3px rgba(65,111,91,.28),inset 0 14px 30px rgba(0,0,0,.18) !important;
    scrollbar-color:#d8c47d #16382d;
    scrollbar-width:thin;
  }
  #inventory-panel .inventory-bag::-webkit-scrollbar { width:10px; }
  #inventory-panel .inventory-bag::-webkit-scrollbar-track { background:#16382d; border-radius:8px; }
  #inventory-panel .inventory-bag::-webkit-scrollbar-thumb { background:#d8c47d; border:2px solid #16382d; border-radius:8px; }
  #inventory-panel .inventory-bag .inventory-slot {
    border:2px solid #315a49 !important;
    border-radius:10px !important;
    background:linear-gradient(145deg,#fff7dc 0%,#eadbad 58%,#cdbb82 100%) !important;
    box-shadow:inset 2px 2px rgba(255,255,255,.72),inset -3px -3px rgba(105,83,41,.2),0 3px 0 rgba(4,18,14,.52) !important;
    transition:transform .12s ease,filter .12s ease,box-shadow .12s ease !important;
  }
  #inventory-panel .inventory-bag .inventory-slot:hover {
    filter:brightness(1.06) saturate(1.05) !important;
    transform:translateY(-3px) !important;
    box-shadow:inset 2px 2px rgba(255,255,255,.8),inset -3px -3px rgba(105,83,41,.18),0 5px 0 rgba(4,18,14,.42) !important;
  }
  #inventory-panel .inventory-bag .inventory-slot.active,
  #inventory-panel .inventory-bag .inventory-slot.selected {
    border-color:#f2c94c !important;
    box-shadow:0 0 0 2px #8f7129,0 0 14px rgba(255,218,92,.48),inset 2px 2px rgba(255,255,255,.76),inset -3px -3px rgba(105,83,41,.2) !important;
  }
  #inventory-panel .inventory-bag .inventory-empty {
    border-color:#315244 !important;
    background:linear-gradient(145deg,#314b3f,#22382f) !important;
    box-shadow:inset 2px 2px rgba(107,147,126,.18),inset -3px -3px rgba(5,18,14,.36) !important;
    opacity:.72 !important;
  }
  #inventory-panel .inventory-bag .rarity-uncommon { border-color:#53b96b !important; }
  #inventory-panel .inventory-bag .rarity-rare { border-color:#5aa8db !important; }
  #inventory-panel .inventory-bag .rarity-epic { border-color:#b47ad8 !important; }
  #inventory-panel .inventory-count {
    border:1px solid #0b261e !important;
    border-radius:7px !important;
    background:rgba(18,61,48,.94) !important;
    color:#fff4c9 !important;
    box-shadow:0 1px 0 rgba(255,255,255,.15) !important;
    text-shadow:1px 1px #092019 !important;
  }
  #inventory-panel .inventory-footer {
    border-top:1px solid rgba(231,215,159,.38) !important;
    background:linear-gradient(180deg,rgba(47,96,77,.22),rgba(8,29,23,.18)) !important;
  }
  #inventory-panel .inventory-weight { color:#f6edcc !important; text-shadow:1px 1px #0a211a !important; }
  #inventory-panel .inventory-weight-icon {
    border:2px solid #8f7838 !important;
    border-radius:7px !important;
    background:linear-gradient(180deg,#fff3c9,#d5bf7d) !important;
    color:#1b4939 !important;
    box-shadow:inset 1px 1px #fff,0 2px 0 #705c2e !important;
  }
  #inventory-panel .inventory-weight-bar {
    border:2px solid #0b231c !important;
    border-radius:999px !important;
    background:#0a1f19 !important;
    box-shadow:inset 0 2px rgba(0,0,0,.35) !important;
  }
  #inventory-panel #inventory-weight-fill { background:linear-gradient(90deg,#55b89a,#e4c75f) !important; box-shadow:inset 0 1px rgba(255,255,255,.35) !important; }
  #inventory-panel .inventory-action {
    border:2px solid #102820 !important;
    border-radius:9px !important;
    color:#fff8dc !important;
    text-shadow:1px 1px #10231c !important;
    box-shadow:inset 1px 1px rgba(255,255,255,.18),0 3px 0 rgba(5,20,15,.58) !important;
  }
  #inventory-panel .inventory-action:hover { filter:brightness(1.1) !important; transform:translateY(-1px); }
  #inventory-panel #inventory-sort { background:linear-gradient(180deg,#4d7f73,#315b52) !important; }
  #inventory-panel #inventory-split { background:linear-gradient(180deg,#8f914d,#62682f) !important; }
  #inventory-panel #inventory-trash { background:linear-gradient(180deg,#c96b50,#8d3d34) !important; }
  #inventory-panel button:focus-visible { outline:3px solid #f7d66c !important; outline-offset:2px !important; }
  /* === CODEX INVENTORY GREEN STYLE END === */
/* Las herramientas de creación solo se muestran en el entorno local. */
html[data-creator-tools="disabled"] #creator-toggle,
html[data-creator-tools="disabled"] #city-editor-toggle,
html[data-creator-tools="disabled"] #city-editor-panel,
html[data-creator-tools="disabled"] #blacksmith-editor-panel,
html[data-creator-tools="disabled"] .creator-only,
html[data-creator-tools="disabled"] #collision-label,
html[data-creator-tools="disabled"] #collision-layer,
html[data-creator-tools="disabled"] #rock-coordinates { display:none !important; }
