:root{color-scheme:dark;--hud-bg: #12313a;--hud-fg: #e8f4f4;--hud-accent: #33c4c4;--hud-copper: #cf7d3c}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#0a1418;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--hud-fg)}#app{position:fixed;inset:0}canvas.fort-canvas{display:block;width:100%;height:100%;outline:none}#hud{position:fixed;inset:0;pointer-events:none;z-index:10;--slot: clamp(48px, 5.4vmin, 108px);--gap: clamp(6px, .7vmin, 14px);--hud-radius: clamp(6px, .7vmin, 12px);font-size:clamp(11px,1.15vmin,22px)}#hud-crosshair{position:absolute;left:50%;top:50%;width:clamp(18px,2.1vmin,40px);height:clamp(18px,2.1vmin,40px);transform:translate(-50%,-50%);color:var(--hud-fg);opacity:.9;filter:drop-shadow(0 0 2px rgba(0,0,0,.7))}#hud-crosshair svg{width:100%;height:100%;display:none}#hud-crosshair[data-mode=build] .cx-build,#hud-crosshair[data-mode=edit] .cx-edit,#hud-crosshair[data-mode=mattock] .cx-mattock,#hud-crosshair[data-mode=movement] .cx-mattock{display:block}#hud-corner{position:absolute;right:clamp(14px,1.6vmin,40px);bottom:clamp(14px,1.6vmin,40px);display:flex;flex-direction:column;align-items:flex-end;gap:var(--gap)}#hud-mode{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:800;font-stretch:88%;letter-spacing:.09em;padding:.3em .85em;border-radius:var(--hud-radius);background:#0914189e;border:1px solid rgba(51,196,196,.35);color:var(--hud-accent);text-transform:uppercase;transform:skew(-7deg)}#hud-mode[data-mode=edit]{color:#ff9d2e;border-color:#ff9d2e66}#hud-mode[data-mode=mattock],#hud-mode[data-mode=movement]{color:var(--hud-copper);border-color:#cf7d3c66}#hud-row{display:flex;align-items:flex-end;gap:var(--gap)}#hud-tray{display:flex;gap:var(--gap);padding:var(--gap);border-radius:var(--hud-radius);background:#0914188c;border:1px solid rgba(232,244,244,.12)}.tray-slot{position:relative;width:var(--slot);height:var(--slot);border-radius:calc(var(--hud-radius) * .8);background:#12313ab3;border:2px solid rgba(232,244,244,.18);display:flex;align-items:center;justify-content:center;transition:border-color .08s ease,background .08s ease}.tray-slot svg{width:62%;height:62%;color:var(--hud-fg);opacity:.9}.tray-slot .tray-key{position:absolute;left:.28em;top:.16em;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:.82em;font-weight:800;font-stretch:88%;letter-spacing:.02em;color:var(--hud-fg);opacity:.82;text-shadow:0 1px 2px rgba(0,0,0,.8)}.tray-slot.active{background:#33c4c447;border-color:var(--hud-accent)}.tray-slot.active svg{opacity:1;color:#fff}#hud-material{display:flex;flex-direction:column;align-items:center;gap:.2em;padding:var(--gap);border-radius:var(--hud-radius);background:#0914188c;border:1px solid rgba(232,244,244,.12)}#hud-material .mat-icon{width:calc(var(--slot) * .62);height:calc(var(--slot) * .62)}#hud-material .mat-icon svg{width:100%;height:100%;display:none}#hud-material[data-material=wood] .mat-wood,#hud-material[data-material=stone] .mat-stone,#hud-material[data-material=metal] .mat-metal{display:block}#hud-material .mat-count{font-weight:700;font-size:1.1em;line-height:1;color:var(--hud-fg)}#title{position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 35%,#163a45,#081217 70%);pointer-events:auto;cursor:pointer}#title[hidden]{display:none}.title-card{text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}.title-name{font-size:clamp(48px,11vmin,160px);font-weight:800;letter-spacing:.16em;color:var(--hud-fg);text-shadow:0 3px 18px rgba(51,196,196,.4)}.title-tag{font-size:clamp(13px,1.8vmin,26px);letter-spacing:.28em;text-transform:uppercase;color:var(--hud-accent);opacity:.85}#title-play{margin-top:18px;padding:.6em 2.4em;font:inherit;font-size:clamp(16px,2.2vmin,30px);font-weight:700;letter-spacing:.1em;color:#08181d;background:var(--hud-accent);border:none;border-radius:10px;cursor:pointer;box-shadow:0 6px 20px #33c4c459}#title-play:hover{filter:brightness(1.08)}.title-hint{margin-top:8px;font-size:clamp(11px,1.3vmin,20px);color:var(--hud-fg);opacity:.6}#title-install{margin-top:6px;padding:.4em 1.4em;font:inherit;color:var(--hud-fg);background:transparent;border:1px solid rgba(232,244,244,.3);border-radius:8px;cursor:pointer}#title-install[hidden]{display:none}#settings{position:fixed;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;background:#060e11d1;pointer-events:auto}#settings[hidden]{display:none}.settings-panel{width:min(760px,92vw);max-height:88vh;display:flex;flex-direction:column;gap:14px;padding:clamp(16px,2.4vmin,32px);border-radius:14px;background:#0e2731;border:1px solid rgba(51,196,196,.3);box-shadow:0 12px 40px #0009;color:var(--hud-fg)}.settings-panel h1{font-size:1.5em;letter-spacing:.04em}.settings-panel h3{margin:14px 0 6px;font-size:.82em;text-transform:uppercase;letter-spacing:.12em;color:var(--hud-accent)}.settings-tabs{display:flex;gap:8px}.settings-tabs button{flex:1;padding:.5em .8em;border-radius:8px 8px 0 0;border:1px solid rgba(232,244,244,.14);background:#12313a99;color:var(--hud-fg);font:inherit;cursor:pointer}.settings-tabs button.active{background:#33c4c43d;border-color:var(--hud-accent)}.settings-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding-right:6px}.bind-row,.slider-row,.toggle-row{display:flex;align-items:center;gap:10px;padding:5px 0}.bind-label,.slider-row>span:first-child,.toggle-row>span{flex:1}.bind-key{min-width:96px;padding:.4em .6em;border-radius:6px;border:1px solid rgba(232,244,244,.22);background:#12313acc;color:var(--hud-fg);font:inherit;cursor:pointer}.bind-key.arming{border-color:var(--hud-copper);color:var(--hud-copper)}.bind-reset,.settings-footer button,#bind-conflict button{padding:.4em .8em;border-radius:6px;border:1px solid rgba(232,244,244,.18);background:#12313a99;color:var(--hud-fg);font:inherit;cursor:pointer}.slider-row input[type=range]{flex:2;accent-color:var(--hud-accent)}.slider-value{min-width:48px;text-align:right;color:var(--hud-accent)}.toggle-row{cursor:pointer}.toggle-row input{width:18px;height:18px;accent-color:var(--hud-accent)}#bind-conflict{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;background:#cf7d3c29;border:1px solid rgba(207,125,60,.5)}#bind-conflict[hidden]{display:none}#bind-conflict .conflict-text{flex:1}.settings-footer{display:flex;justify-content:space-between;gap:10px}#settings-close{background:#33c4c43d;border-color:var(--hud-accent)}#minimap{position:fixed;top:clamp(14px,1.6vmin,40px);right:clamp(14px,1.6vmin,40px);width:clamp(120px,15vmin,300px);height:clamp(120px,15vmin,300px);z-index:10;pointer-events:none;border-radius:clamp(6px,.7vmin,12px);box-shadow:0 2px 10px #00000080;image-rendering:auto}