/* ArcCraft presentation layer. Gameplay and input remain in index.html. */
:root{color-scheme:dark;--ice:#a6e8ff;--muted:#89a1b8;--line:rgba(175,218,246,.16);--glass:rgba(5,16,31,.78);--white:#f2f8ff}
*{box-sizing:border-box;letter-spacing:0!important}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#030b18;color:var(--white);font-variant-numeric:tabular-nums}
button{font:inherit;cursor:pointer;transition:background .18s,border-color .18s,box-shadow .18s,transform .18s;color:var(--white)}
button:active:not(:disabled){transform:translateY(1px)}
button:focus-visible{outline:2px solid var(--ice);outline-offset:4px}
button:disabled{cursor:default;opacity:.4}
button svg{width:17px;height:17px;stroke-width:1.6;flex:none}
.section-kicker{font-size:10px;font-weight:600;color:var(--ice);line-height:1.5}
#blocker{background:#030b18 url('assets/arc-block.png') no-repeat right center;background-size:auto 110%;text-align:left;cursor:default;overflow:auto}
#blocker::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#030b18 0%,rgba(3,11,24,.96) 23%,rgba(3,11,24,.5) 49%,rgba(3,11,24,0) 72%);pointer-events:none}
#panel{position:relative;width:100%;min-height:100%;padding:38px 6%;display:flex;flex-direction:column;justify-content:center}
.title-masthead{position:absolute;top:34px;left:6%;right:6%;display:flex;align-items:center;gap:12px;font-size:12px;font-weight:650}
.brand-emblem{display:grid;place-items:center;width:30px;height:30px;border:1px solid #8edfff;color:#ceefff;font-size:19px;border-radius:5px;box-shadow:inset 0 0 15px #64caff22}
.edition{margin-left:auto;font-size:10px;color:#b7d1e5}
.title-content{width:540px;max-width:100%;padding:110px 0 125px;animation:title-in .8s ease both}
#panel h1{font-size:76px;font-weight:600;line-height:1.05;margin:20px 0 18px;color:#f5faff;text-shadow:none}
#panel .tagline{font-size:19px;font-weight:400;color:#acc5dc;margin-bottom:34px}
.intro-copy{margin:0 0 27px;color:#e8f6ff;font-size:18px;line-height:1.45;font-weight:500}
#panel .season{display:flex;align-items:center;gap:8px;padding:0;border:0;border-radius:0;background:none;color:#8fa8c1;font-size:10px;font-weight:500;margin:0 0 18px}
#panel .season::before{content:"";width:5px;height:5px;background:#a8e9ff;border-radius:50%;box-shadow:0 0 9px #8fe3ff}
.title-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
#panel .start{animation:none;margin:0;padding:17px 25px;min-width:208px;min-height:54px;border:1px solid #c2efff;border-radius:4px;background:#c1ecff;color:#092137;font-size:13px;font-weight:650;text-align:left;box-shadow:0 4px 30px #7fd7ff15}
#panel .start::after{content:'\2197';float:right;margin-left:25px;font-size:17px}
#panel .start:hover{background:#e5f7ff;box-shadow:0 0 32px #9bdfff35;transform:translateY(-2px)}
#new-world{margin:0;padding:15px 18px;background:transparent;border:1px solid var(--line);color:#a5bdd2;font-size:12px;border-radius:4px}
#new-world:hover{border-color:var(--ice);color:white}
#panel .seed{font-size:10px;color:#658099;margin-top:19px}
.quick-controls{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px;width:min(500px,100%);color:#7895ae;font-size:10px}
.quick-controls span{padding:7px 9px;border:1px solid #a9dfff18;background:#06172a88;border-radius:4px}
.artifact-caption{position:absolute;right:9%;bottom:18%;display:flex;flex-direction:column;gap:8px;text-align:right}
.artifact-caption strong{font-size:26px;font-weight:500}
.artifact-caption>span:last-child{color:#7f9dbb;font-size:11px}
.title-footer{position:absolute;bottom:30px;left:6%;right:6%;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;font-size:9px;color:#7a94ad}
#panel .controls{display:none!important}
body.started #blocker{background:rgba(3,11,24,.84);backdrop-filter:blur(12px)}
body.started #blocker::before{display:none}
body.started .artifact-caption{display:none}
body.started #panel .start{font-size:0}
body.started #panel .start::before{content:'Resume expedition';font-size:13px}
body.started #panel .start::after{font-size:17px}
#arc-hud-left,#arc-hud-center,#arc-hud-right{top:22px;text-shadow:0 2px 8px #0007}
#arc-hud-left{left:24px;padding:0;border:0;border-radius:0;background:none;line-height:1.6}
#arc-hud-left strong{font-size:12px;font-weight:650;margin-bottom:4px}
#arc-hud-left #season-points{font-size:23px;font-weight:450;color:#fff;line-height:1.25}
#arc-hud-left #pickaxe-label{font-size:9px;color:#b3c9d9;margin-top:6px;font-weight:500}
#arc-hud-center{padding:7px 18px;background:rgba(5,16,31,.45);border:1px solid #e0f3ff18;border-radius:4px;backdrop-filter:blur(12px);font-weight:500;text-align:center;font-size:13px;min-width:118px}
#zone-value{font-size:8px;color:#aac8de;line-height:1.8}
#arc-hud-right{right:24px;gap:6px}
.arc-mini-btn,#btn-craft{background:var(--glass);border:1px solid var(--line);border-radius:4px;font-size:11px;font-weight:500;padding:10px 12px;backdrop-filter:blur(16px);display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px}
.arc-mini-btn:hover,#btn-craft:hover{background:#16314a;border-color:#9adaff80;box-shadow:0 0 18px #92d8ff10}
#arc-hud-right .arc-mini-btn{width:36px;height:36px;padding:8px}
#arc-hud-right .arc-mini-btn.attention{border-color:#bceeff;box-shadow:0 0 24px #7fdfff44,inset 0 0 16px #8edfff18;animation:arc-attention 1.4s ease-in-out infinite}
#arc-hud-right .arc-mini-btn span{display:none}
#btn-craft{right:24px;top:66px;padding:9px;width:36px;height:36px}
body.started #btn-craft{display:flex}
#btn-craft span{display:none}
#mine-objective{top:auto;bottom:131px;font-size:10px;font-weight:500;border:0;border-radius:0;padding:5px 10px;background:rgba(3,12,25,.3);color:#d0dfeb;max-width:90vw;white-space:normal}
#mine-objective::before{content:'\25C7';color:var(--ice);margin-right:9px}
#mine-objective span{color:#89e3ff;margin-left:7px}
#tutorial-card,#context-hint,#mine-marker{position:fixed;left:50%;transform:translateX(-50%);z-index:9;pointer-events:none;text-align:center;text-shadow:0 2px 10px #0008;opacity:0;transition:opacity .24s,transform .24s}
#tutorial-card.show,#context-hint.show,#mine-marker.show{opacity:1}
#tutorial-card{top:18%;width:min(360px,86vw);padding:18px 20px;background:rgba(5,18,34,.72);border:1px solid #b8e8ff33;border-radius:6px;backdrop-filter:blur(14px);box-shadow:0 18px 55px #0005}
#tutorial-card b{display:block;color:#f4fbff;font-size:20px;font-weight:560;margin-bottom:9px}
#tutorial-card span{display:block;color:#b9d4e8;font-size:12px;line-height:1.55}
#context-hint{top:calc(50% + 52px);padding:9px 13px;color:#e7f8ff;font-size:10px;line-height:1.6;background:rgba(3,12,25,.58);border:1px solid #a8e3ff22;border-radius:4px;backdrop-filter:blur(10px)}
#mine-marker{top:43%;color:#b9edff;font-size:10px;font-weight:600;padding:8px 11px;background:rgba(4,18,34,.52);border:1px solid #a8e5ff24;border-radius:4px;animation:marker-bob 1.3s ease-in-out infinite}
#hotbar{bottom:25px;gap:5px;padding:5px;background:rgba(4,13,25,.66);border:1px solid var(--line);border-radius:6px;backdrop-filter:blur(16px)}
.slot{width:46px;height:46px;border:1px solid #c5e6ff13;border-radius:3px;background:#12243766;transition:border-color .16s,background .16s,box-shadow .16s,transform .16s}
.slot.sel{transform:none;border-color:#a1dfff;background:#9fdcff15;box-shadow:inset 0 0 14px #85cfff18,0 0 12px #70cfff12}
.slot.sel::after{content:"";position:absolute;bottom:-6px;left:12px;right:12px;height:2px;background:#bceaff;box-shadow:0 0 8px #8adfff}
.slot .n{font-size:8px;left:4px;top:3px;color:#7b98b0}
.slot .cnt{font-size:10px;right:4px;bottom:3px;font-weight:500}
.slot .sw{width:25px;height:25px;border-radius:2px}
.slot .nm{bottom:-25px;font-size:9px;color:#bad2e4}
#hud-stats{bottom:94px;gap:5px}
.heart{width:13px;height:13px;font-size:12px;line-height:13px;filter:drop-shadow(0 1px 2px #0008)}
.heart.full{background:#c1e9f5}.heart.half{background:linear-gradient(90deg,#c1e9f5 50%,#526172 50%)}
#crosshair{width:14px;height:14px;opacity:.9}
#crosshair::before{left:6px;top:2px;width:1px;height:10px}
#crosshair::after{top:6px;left:2px;width:10px;height:1px}
#crosshair-feedback{font-size:16px;font-weight:550;color:#dbf4ff}
#streak-indicator{font-size:10px;font-weight:500}
.arc-modal,#craft{z-index:30;background:rgba(2,8,18,.62);backdrop-filter:blur(15px);padding:20px}
.arc-panel,#craft .panel{box-sizing:border-box;width:min(560px,100%);max-height:85dvh;padding:30px;background:rgba(7,19,34,.96);border:1px solid #bce6ff25;border-radius:8px;box-shadow:0 32px 100px #0008,inset 0 1px #ffffff08;animation:panel-in .22s ease both}
.arc-panel h2,#craft h2{font-size:27px;line-height:1.2;font-weight:500;color:#f0f7ff;margin:9px 0 26px}
.arc-panel p,.arc-panel li{font-size:13px;color:#91a9c0;line-height:1.7}
.arc-panel p b{font-size:11px;color:#d8edfc;font-weight:600}
.arc-panel small{font-size:10px;line-height:1.6;color:#708ba3;margin:20px 0 8px}
.arc-close,#craft-close{background:#122a40;border:1px solid #bde7ff26;border-radius:4px;font-size:12px;font-weight:500;padding:13px;margin-top:20px;color:#c3dfef}
.arc-close:hover,#craft-close:hover{background:#203e57;border-color:#a9e3ff77}
.upgrade-row{padding:18px 0;gap:15px;border-color:var(--line);grid-template-columns:minmax(0,1fr) auto}
.upgrade-row b{font-size:13px;font-weight:550}
.upgrade-row span{font-size:11px;line-height:1.6;color:#7e9ab3;margin-top:6px}
.upgrade-row:last-child b,.upgrade-row.upgrade-ready b{color:#b4eaff;text-shadow:0 0 18px #8cddff55}
.upgrade-row.upgrade-ready{background:#9edfff09;margin:0 -10px;padding-left:10px;padding-right:10px}
.lb-row{font-size:13px;padding:16px 8px;border-color:var(--line);grid-template-columns:30px minmax(0,1fr) auto}
.lb-row b{font-weight:500}.lb-row>b:first-child{color:#617f9a}.lb-row.you{background:#9edfff0b;color:#b2eaff}
.recipe{background:none;border-bottom:1px solid var(--line);border-radius:0;margin:0;padding:15px 0;gap:10px}
.recipe .lbl{font-size:12px}.recipe .lbl small{font-size:10px;color:#809bb2}
.r-btn{border:1px solid #c0eaff33;background:#16354d;font-size:11px;padding:9px 12px;border-radius:4px}
.r-btn:disabled{background:#102133;border-color:#abcfff18;color:#7490a5}
#toast{top:110px;font-size:12px;border-radius:4px;padding:12px 20px;background:rgba(7,20,36,.92);border-color:#afdfff33;box-shadow:0 10px 36px #0004;backdrop-filter:blur(15px);max-width:85vw;text-align:center}
#zone-banner{top:18%;min-width:0;width:min(370px,86vw);background:rgba(5,17,31,.86);border:1px solid #a9dcff33;border-radius:4px;padding:20px;font-size:19px;font-weight:500;box-shadow:0 12px 45px #0004;backdrop-filter:blur(14px)}
#zone-banner small{font-size:10px;margin-top:8px;color:#8baac3}
#arc-event{top:14%;width:min(360px,86vw);min-width:0;border-radius:6px;background:rgba(4,15,30,.96);padding:0 24px 26px;border:1px solid #b2e9ff77;box-shadow:0 0 80px #51bdff25,0 24px 80px #0007;overflow:hidden;font-weight:500;transform:translateX(-50%) translateY(15px) scale(.97);transition:opacity .4s,transform .5s cubic-bezier(.2,.7,.2,1)}
#arc-event.show{transform:translateX(-50%) translateY(0) scale(1)}
#arc-event img{display:block;width:150px;height:135px;object-fit:cover;margin:0 auto 14px;mix-blend-mode:screen}
#arc-event b{display:block;font-size:30px;font-weight:500;margin:9px 0 15px}
#arc-event small{font-size:11px;color:#b3e9ff}.rarity-label{font-size:9px!important;color:#89b8d7!important}
#death{background:rgba(15,9,23,.76);backdrop-filter:blur(10px);font-size:32px;font-weight:500;text-shadow:none}#death span{color:#a9b5c8;font-size:13px}
.tbtn,#joystick-base{background:rgba(5,19,35,.4);border:1px solid #c4e8ff55;backdrop-filter:blur(8px)}
#joystick-knob{background:#b5e1f077;box-shadow:none}#btn-place,#btn-break{border-color:#a9dfff66;color:#d2edff}
@keyframes title-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes panel-in{from{opacity:0;transform:translateY(9px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes marker-bob{50%{transform:translateX(-50%) translateY(6px)}}
@keyframes arc-attention{50%{box-shadow:0 0 32px #9de8ff66,inset 0 0 20px #8edfff26}}
@media(max-width:700px){
 #blocker{background-position:center 10%;background-size:auto 70%}
 #blocker::before{background:linear-gradient(0deg,#030b18 5%,#030b18ee 32%,#030b1822 80%)}
 #panel{padding:24px;justify-content:flex-end;min-height:100dvh}
 .title-masthead{top:23px;left:24px;right:24px}.title-content{padding:260px 0 88px;width:100%}
 #panel h1{font-size:48px;margin:12px 0}#panel .tagline{font-size:16px;margin-bottom:16px}.intro-copy{font-size:14px;margin-bottom:20px}
 .quick-controls{font-size:9px;gap:6px}.quick-controls span{padding:6px 7px}
 .artifact-caption{display:none}.title-footer{left:24px;right:24px;bottom:20px;font-size:8px}.title-footer span:last-child{display:none}
 #arc-hud-left{left:14px;top:16px}#arc-hud-left strong{font-size:10px}#arc-hud-left #season-points{font-size:19px}#arc-hud-left #pickaxe-label{font-size:8px}
 #arc-hud-center{top:16px;padding:6px 9px;min-width:95px;font-size:11px}
 #arc-hud-right{right:12px;top:16px;gap:4px}#arc-hud-right .arc-mini-btn{width:30px;height:32px;min-height:32px;padding:6px}
 #btn-craft{right:12px;top:55px;width:30px;height:32px;min-height:32px}
 #hotbar{gap:3px;bottom:22px;padding:4px;width:max-content;max-width:calc(100vw - 20px)}
 .slot{width:30px;height:34px}.slot .sw{width:20px;height:20px}.slot .cnt{font-size:9px}
 #hud-stats{bottom:74px}#mine-objective{bottom:102px;font-size:9px;width:max-content;max-width:85vw}
 #tutorial-card{top:16%;padding:15px 16px}#tutorial-card b{font-size:17px}#context-hint{top:calc(50% + 48px)}#mine-marker{top:39%}
 .arc-modal,#craft{padding:14px}.arc-panel,#craft .panel{padding:22px;max-height:88dvh}.arc-panel h2,#craft h2{font-size:24px}
 .upgrade-row{gap:9px}.upgrade-row span{font-size:10px}.upgrade-row .arc-mini-btn{padding:9px;font-size:10px}
 #arc-event{top:12%;padding-bottom:18px}#arc-event img{width:115px;height:95px}#arc-event b{font-size:25px}
}
@media(max-height:550px){.title-content{padding:95px 0 65px}#panel h1{font-size:45px;margin:8px 0}#panel .tagline{margin-bottom:15px}.title-masthead{top:18px}.title-footer{bottom:15px}#panel .seed{margin-top:10px}#arc-event img{display:none}#arc-event{padding-top:20px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Expedition entry, camp and equipment. */
#blocker{align-items:flex-start}
#game:focus{outline:none}
.drag-option{display:block;font-size:10px;color:#9db9cf;margin-top:13px}
.drag-option input{vertical-align:middle;accent-color:#a6e8ff}
[hidden]{display:none!important}
#panel .title-content{padding:95px 0 85px;width:560px}
#panel h1{font-size:58px;margin:12px 0}
#panel .intro-copy{font-size:14px;margin-bottom:16px}
#panel .tagline{margin-bottom:18px}
.explorer-form{display:grid;gap:8px;width:min(440px,100%);padding:18px;background:#051326de;border:1px solid #a6e8ff30;border-radius:6px;margin:18px 0}
.explorer-form label{color:#d4eaff;font-size:11px}
.explorer-form input{width:100%;padding:11px 12px;border:1px solid #9bddff40;border-radius:4px;background:#020b17;color:#eefaff;font:inherit;font-size:13px;user-select:text;touch-action:manipulation}
.explorer-form input:focus{outline:2px solid #a6e8ff;outline-offset:2px}
.entry-note{font-size:10px;line-height:1.6;color:#8eabc2;margin:4px 0}
#profile-error{color:#ffb3a5;font-size:11px;margin:0}
#profile-summary{display:flex;align-items:center;gap:15px;margin:20px 0;color:#a6d8ee;font-size:12px}
#arc-hud-left #player-name{display:inline;font-size:10px;color:#a6e8ff}
#arc-hud-left .payout-note{font-size:9px;color:#98b9cf;margin-top:4px}
#arc-hud-left{background:#041427bd;padding:10px 12px;border:1px solid #b4e7ff20;border-radius:5px}
#field-status{display:none;position:fixed;bottom:155px;left:50%;transform:translateX(-50%);z-index:8;font-size:9px;color:#a6e8ff;background:#061528a6;padding:6px 10px;border-radius:3px;pointer-events:none;white-space:nowrap}
body.started #field-status{display:block}
.expedition-panel{width:min(690px,100%)}
.modal-dismiss{float:right;position:sticky;top:0;width:32px;height:32px;border:1px solid #9bdfff40;border-radius:4px;background:#0d2539;font-size:23px;z-index:1}
.region-panel{width:min(980px,100%)}
.region-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(230px,1fr);gap:24px}
.chart-wrap{position:relative}.map-north{position:absolute;right:12px;top:10px;font-size:12px;color:#fff;text-shadow:0 1px 4px #000}
#region-chart{width:100%;height:auto;border:1px solid #aacbde40;border-radius:5px;cursor:crosshair;image-rendering:auto}
.chart-wrap p{font-size:11px}.map-site{display:block;text-align:left;width:100%;padding:12px;margin-bottom:8px;background:#0b2232;border:1px solid #9ddfff20;border-radius:5px}
.map-site.selected{border-color:#95d6ec;background:#163d4d}.map-site b,.map-site span,.map-site small{display:block}
.map-site b{font-size:13px}.map-site span{font-size:11px;color:#a4bacb;line-height:1.5;margin-top:5px}.map-site small{font-size:10px;color:#92c8ce;margin:6px 0 0}
#compass-line{display:none;position:fixed;left:50%;top:84px;transform:translateX(-50%);z-index:8;pointer-events:none;background:#041427b8;border:1px solid #a8dfff25;border-radius:4px;padding:7px 12px;color:#c2e6ef;font-size:10px;white-space:nowrap}
body.started #compass-line{display:block}
@media(max-width:700px){.region-grid{grid-template-columns:1fr;gap:16px}#compass-line{top:162px;font-size:9px}#arc-hud-right{gap:3px}#arc-hud-right .arc-mini-btn{width:27px;padding:5px}}
.expedition-panel h3{font-size:15px;font-weight:550;color:#dff5ff;margin:25px 0 14px}
.payout-banner{padding:14px 16px;border:1px solid #8fe1ff30;background:#12344855;border-radius:5px}
.payout-banner b,.payout-banner span{display:block;font-size:12px}
.payout-banner span{font-size:10px;color:#9fbace;margin-top:6px}
.equipment-actions{display:flex;flex-wrap:wrap;gap:8px}
.expedition-panel .equipment-help{font-size:11px}
.mission-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 0;border-bottom:1px solid var(--line)}
.mission-row>div{flex:1}.mission-row b{font-size:13px;font-weight:550}.mission-row p{font-size:11px;margin:5px 0 10px}.mission-row small{margin:6px 0 0}
.mission-row progress{display:block;width:100%;height:5px;accent-color:#a6e8ff}
.mission-row{flex-wrap:wrap}.mission-row>div{flex:1 1 220px}
.mission-row button{flex:none;font-size:10px}
.bounty-btn{border-color:#8fe1ff80;background:#0f3a52}
.bounty-chips{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 14px}
.bounty-chip{padding:6px 9px;border:1px solid #a9dfff2a;background:#06172a88;border-radius:4px;font-size:10px;color:#a6c9de}
#payout-panel p{font-size:11px;margin:0 0 8px}#payout-panel a{color:var(--ice)}
#payout-panel .payout-status{color:#dff5ff;font-weight:550}
.payout-list{display:flex;flex-direction:column;gap:6px;margin:8px 0 12px;font-size:11px;color:#89a8be}
.payout-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 12px;padding:10px;background:#0d2539;border:1px solid #9bdfff30;border-radius:4px}
#storage-list{display:flex;flex-wrap:wrap;gap:8px;font-size:11px;color:#89a8be;margin-top:12px}
.storage-item{padding:10px;background:#0d2539;border:1px solid #9bdfff30;border-radius:4px;font-size:11px}
@media(max-width:700px){
 #panel .title-content{padding:95px 0 70px}#panel h1{font-size:44px}
 #blocker{background-size:auto 100%;background-position:center top}
 #blocker::before{background:linear-gradient(90deg,#030b18f5,#030b18c9)}
 .explorer-form{padding:14px}.title-footer{position:relative;left:auto;right:auto;bottom:auto}
 #field-status{bottom:123px;font-size:8px}#arc-hud-left .payout-note{max-width:140px;font-size:8px}
 #arc-hud-center{top:105px;font-size:11px}.mission-row{gap:9px}.mission-row button{padding:8px}
 #profile-summary{flex-wrap:wrap}.artifact-caption{display:none}
}
