:root{--ink: #efe6d2;--ink-dim: #b9ad93;--wood: #6b4423;--wood-light: #a8733f;--panel: rgba(12, 10, 8, .72);--warn: #d9583b;font-family:Georgia,Times New Roman,serif;color:var(--ink)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#06050a}#game{display:block;width:100vw;height:100vh}.hidden{display:none!important}#hud{position:fixed;inset:0;pointer-events:none}.panel{position:absolute;background:var(--panel);border:1px solid rgba(168,115,63,.5);border-radius:4px;padding:10px 14px;min-width:160px}.top-left{top:16px;left:16px}.top-right{top:16px;right:16px;text-align:right}.bottom-center{position:absolute;bottom:16px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:8px}.bottom-left{bottom:16px;left:16px;line-height:1.6}#hud-mode{position:static;font-size:13px;letter-spacing:.04em;white-space:nowrap}#hud-hint{min-height:1em;font-size:13px;color:var(--warn);text-shadow:0 1px 2px #000}#hud-hotbar{display:flex;gap:4px;pointer-events:auto}.slot{position:relative;padding:3px;background:var(--panel);border:1px solid rgba(168,115,63,.5);border-radius:4px;cursor:pointer}.slot canvas{display:block;width:32px;height:32px;image-rendering:pixelated}.slot .key{position:absolute;top:1px;left:3px;font-size:10px;color:var(--ink);text-shadow:0 1px 2px #000}.slot.selected{border-color:var(--ink);box-shadow:0 0 8px #ffc87899}.slot .count,.item .count{position:absolute;bottom:1px;right:3px;font-size:11px;color:var(--ink);text-shadow:0 1px 2px #000}.slot.drop{border-color:#bfe8a0}.item[draggable=true]{cursor:grab}.slot.empty canvas{opacity:.3}.warn{color:var(--warn)}#hud-health{width:160px;height:8px;margin:6px 0 4px;background:#00000080;border:1px solid rgba(168,115,63,.6);border-radius:3px;overflow:hidden}#hud-health-fill{height:100%;width:100%;background:#b8432e;transition:width .15s}#hud-health-fill.low{background:#ff5a3a;animation:pulse .8s ease-in-out infinite alternate}@keyframes pulse{to{opacity:.5}}#hurt{position:absolute;inset:0;pointer-events:none;opacity:0;box-shadow:inset 0 0 120px 30px #c81e14cc}#hurt.on{animation:hurt .6s ease-out}@keyframes hurt{0%{opacity:1}to{opacity:0}}.slot .condition{position:absolute;left:3px;bottom:2px;height:2px;max-width:calc(100% - 6px);background:#7fd06a}.slot .condition.low{background:#ff5a3a}#craft{top:50%;left:16px;transform:translateY(-50%);width:min(380px,calc(100vw - 32px));max-height:calc(100vh - 220px);overflow-y:auto;pointer-events:auto}#craft h2{margin:4px 0 8px;font-size:15px;font-weight:400;letter-spacing:.08em}.craft-close{position:absolute;top:6px;right:6px;width:26px;height:26px;color:var(--ink);background:none;border:1px solid rgba(168,115,63,.6);border-radius:4px;cursor:pointer}.craft-items{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:12px;font-size:12px;color:var(--ink-dim)}.item{position:relative;padding:3px;border:1px solid rgba(168,115,63,.4);border-radius:4px}.item canvas,.recipe canvas{display:block;width:32px;height:32px;image-rendering:pixelated}.craft-bench{margin-bottom:8px}.craft-bench.ok{color:#bfe8a0}.recipe{display:flex;align-items:center;gap:8px;padding:5px 0;border-top:1px solid rgba(168,115,63,.2)}.recipe.locked{opacity:.55}.recipe-text{flex:1;display:flex;flex-direction:column;font-size:13px}.recipe .tag{font-size:10px;padding:0 4px;border:1px solid var(--wood-light);border-radius:3px;color:var(--ink-dim)}.recipe button{font:inherit;font-size:12px;padding:4px 10px;color:var(--ink);background:var(--wood);border:1px solid var(--wood-light);border-radius:4px;cursor:pointer}.recipe button:disabled{cursor:default;background:none}.name{font-size:18px;letter-spacing:.04em}.small{font-size:12px;color:var(--ink-dim)}#hud-status{position:absolute;top:16px;left:50%;transform:translate(-50%);font-size:13px;color:var(--ink-dim)}#map{position:absolute;right:16px;bottom:16px;width:200px;height:200px;background:var(--panel);border:1px solid rgba(168,115,63,.5);border-radius:4px;overflow:hidden;pointer-events:auto;cursor:zoom-in}#map-canvas{display:block;width:100%;height:100%}#map .map-caption,#map-close{display:none}#map.big{right:50%;bottom:50%;width:min(86vw,86vh);height:min(86vw,86vh);transform:translate(50%,50%);border-color:var(--wood-light);box-shadow:0 0 0 100vmax #0000008c;cursor:crosshair}#map.big .map-caption{display:block;position:absolute;bottom:10px;left:50%;transform:translate(-50%);white-space:nowrap;text-shadow:0 1px 2px #000;pointer-events:none}#map.big #map-close{display:block;position:absolute;top:8px;right:8px;width:30px;height:30px;font-size:20px;line-height:1;color:var(--ink);background:var(--panel);border:1px solid rgba(168,115,63,.6);border-radius:4px;cursor:pointer}#join{position:fixed;inset:0;display:grid;place-items:center;background:radial-gradient(ellipse at center,#1a1410,#06050a 70%)}#join-form{width:min(420px,90vw);padding:32px;background:var(--panel);border:1px solid rgba(168,115,63,.6);border-radius:6px;text-align:center}#join-form h1{margin:0 0 8px;font-weight:400;letter-spacing:.3em;font-size:36px}#join-form p{color:var(--ink-dim);font-size:14px;line-height:1.5;margin:0 0 24px}#join-form input,#join-form button{font:inherit;font-size:16px;padding:10px 14px;border-radius:4px;border:1px solid var(--wood-light);width:100%;margin-bottom:10px}#join-form input{background:#110d0a;color:var(--ink)}#join-form button{background:var(--wood);color:var(--ink);cursor:pointer}#join-form button:hover{background:var(--wood-light)}.chest-items{min-height:40px;padding:4px;border:1px dashed rgba(168,115,63,.4);border-radius:4px}.chest .item{cursor:pointer}#low-health{position:absolute;inset:0;pointer-events:none;opacity:0;box-shadow:inset 0 0 160px 40px #aa140fbf;transition:opacity .6s}#low-health.on{opacity:1;animation:low-health 1.2s ease-in-out infinite alternate}@keyframes low-health{0%{opacity:.35}to{opacity:.9}}#hud-pack{margin-top:2px;font-size:11px}#hud-settings{float:right;margin:-4px -6px 2px 8px;width:24px;height:24px;padding:0;font-size:15px;line-height:1;color:var(--ink-dim);background:none;border:1px solid rgba(168,115,63,.5);border-radius:4px;cursor:pointer;pointer-events:auto}#hud-settings:hover{color:var(--ink);border-color:var(--wood-light)}#hud-tooltip{position:absolute;top:0;left:0;max-width:280px;padding:4px 8px;font-size:13px;background:var(--panel);border:1px solid rgba(168,115,63,.6);border-radius:3px;pointer-events:none;white-space:pre-wrap;overflow-wrap:break-word}#hud.photo>:not(#photo-hint){display:none!important}#photo-hint{display:none;position:absolute;bottom:24px;left:50%;transform:translate(-50%);font-size:13px;color:var(--ink-dim);text-shadow:0 1px 2px #000;white-space:nowrap;opacity:0}#hud.photo #photo-hint{display:block}#photo-hint.on{animation:photo-hint 3.6s ease-in forwards}@keyframes photo-hint{0%,80%{opacity:.75}to{opacity:0}}#indicators{position:absolute;inset:0;pointer-events:none;overflow:hidden}.indicator{position:absolute;top:0;left:0;width:0;height:0;--c: var(--ink);color:var(--c)}.indicator.pirate{--c: #ff4a3a}.indicator.crew{--c: #8fd0ff}.indicator.ship{--c: #ffc070}.indicator.whale{--c: #5fd8c8}.indicator-arrow{position:absolute;top:-8px;left:-8px;width:16px;height:16px}.indicator-arrow:after{content:"";position:absolute;top:2px;left:2px;border-left:13px solid var(--c);border-top:6px solid transparent;border-bottom:6px solid transparent;filter:drop-shadow(0 0 2px #000)}.indicator-label{position:absolute;top:10px;left:0;transform:translate(-50%);font-size:11px;white-space:nowrap;text-shadow:0 1px 2px #000}#craft h2 .craft-pack{margin-left:6px;letter-spacing:0}.guide-toggle{font:inherit;letter-spacing:inherit;padding:0;color:var(--ink);background:none;border:none;cursor:pointer}.guide-toggle:hover{color:var(--wood-light)}.guide-filter,.sign-text{font:inherit;font-size:13px;width:100%;padding:5px 8px;margin-bottom:6px;color:var(--ink);background:#110d0a;border:1px solid var(--wood-light);border-radius:4px}.guide-row{display:flex;align-items:flex-start;gap:8px;padding:5px 0;border-top:1px solid rgba(168,115,63,.2)}.guide-row canvas{flex:none;display:block;width:32px;height:32px;image-rendering:pixelated}.guide-row .small{line-height:1.4}#settings{top:50%;left:50%;transform:translate(-50%,-50%);width:min(460px,calc(100vw - 32px));max-height:calc(100vh - 64px);overflow-y:auto;pointer-events:auto}#settings h2,#sign-editor h2{margin:4px 0 8px;font-size:15px;font-weight:400;letter-spacing:.08em}#settings h3{margin:14px 0 6px;font-size:13px;font-weight:400;letter-spacing:.06em;color:var(--wood-light)}.settings-row{display:flex;align-items:center;gap:8px;padding:3px 0;font-size:13px;border-top:1px solid rgba(168,115,63,.2)}.settings-name{flex:1}.settings-chips{display:flex;gap:3px}.chip{min-width:20px;padding:0 5px;font-size:11px;text-align:center;border:1px solid var(--wood-light);border-radius:3px;color:var(--ink)}.chip.waiting{border-style:dashed;color:#bfe8a0}.settings-row button,.settings-button{font:inherit;font-size:12px;padding:3px 10px;color:var(--ink);background:var(--wood);border:1px solid var(--wood-light);border-radius:4px;cursor:pointer}.settings-row button.on{background:var(--wood-light)}.settings-reset{margin-top:8px}.settings-slider,.settings-check{display:flex;align-items:center;gap:8px;margin:4px 0;font-size:13px}.settings-slider input{flex:1;accent-color:var(--wood-light)}.settings-check input{accent-color:var(--wood-light)}.settings-value{min-width:44px;text-align:right;color:var(--ink-dim);font-size:12px}#sign-editor{top:50%;left:50%;transform:translate(-50%,-50%);width:min(360px,calc(100vw - 32px));pointer-events:auto}.sign-buttons{display:flex;justify-content:flex-end;gap:6px}#join-look{display:flex;align-items:center;gap:14px;margin-bottom:10px;text-align:left}#look-preview{flex:none;width:72px;height:104px;background:#110d0a;border:1px solid rgba(168,115,63,.6);border-radius:4px}.look-fields{flex:1;display:flex;flex-direction:column;gap:8px;font-size:14px;color:var(--ink-dim)}.look-fields label{display:flex;align-items:center;gap:8px}#join-form .look-fields input{flex:1;width:auto;margin:0;padding:0;border:none;background:none;accent-color:var(--wood-light)}.look-fields select{flex:1;font:inherit;font-size:14px;padding:4px 6px;color:var(--ink);background:#110d0a;border:1px solid var(--wood-light);border-radius:4px}#account{margin-top:10px;display:flex;gap:8px;align-items:center;justify-content:center}#account.hidden{display:none}#account button{font:inherit;padding:2px 8px;cursor:pointer}#join-password.hidden{display:none}
