/* 승인 야영지 탁자 · 논리 해상도 360 × 640 */
#supply-screen { display:flex; flex-direction:column; gap:0; padding:0; border:0; background:#0b1715; color:#eadabc; font-family:'Myeongwon',serif; }
#supply-screen button { text-shadow:none; }
#supply-screen .supply-hud { display:block; flex-shrink:0; margin:0; padding:10px 21px 3px; background:#0b1715; }
#supply-screen .supply-status { display:flex; align-items:center; justify-content:space-between; gap:10px; }
#supply-screen #supply-position { font-size:11px; letter-spacing:0; color:#cdbb91; }
#supply-screen #supply-health { font-size:13px; color:#b6d0bd; }
#supply-screen .supply-inventory { display:flex; align-items:center; justify-content:space-between; gap:8px; }
#supply-screen .supply-inventory button { display:flex; align-items:center; gap:6px; min-height:37px; padding:0; color:#e2c795; font-size:14px; background:none; border:0; box-shadow:none; }
#supply-screen .supply-inventory button::before,#supply-screen .supply-inventory button::after { display:none; }
#supply-screen .supply-inventory svg { width:22px; height:24px; }
#supply-screen .supply-inventory b { font:17px Georgia,serif; }
#supply-screen .supply-scene { display:flex; flex-direction:column; flex:1; min-height:0; padding-bottom:38px; background:#293025 url('assets/shelter-ui-v2/camp-table-upper.webp') center bottom/100% 100% no-repeat; }
#supply-screen .supply-intro { padding:9px 23px 1px; }
#supply-screen #supply-heading { margin:0; font-size:29px; line-height:1.2; font-weight:400; letter-spacing:0; color:#f1e4c7; text-shadow:2px 3px #101613; text-align:left; }
#supply-screen .supply-pickline { display:flex; align-items:center; gap:8px; margin-top:6px; color:#e2cba5; font-size:12px; min-height:25px; }
#supply-screen #supply-count { margin-left:auto; font:17px Georgia,serif; color:#f1dfb3; white-space:nowrap; }
#supply-screen #supply-help { min-width:26px; min-height:26px; padding:0; background:#101b17b0; border:1px solid #b8a176; border-radius:46% 54% 45% 51%; font:16px Georgia,serif; color:#e2c795; }
#supply-screen #supply-help::before,#supply-screen #supply-help::after { display:none; }
#supply-screen .supply-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); flex:1; min-height:0; gap:3px 16px; padding:4px 20px 0; overflow:visible; }
#supply-screen .supply-options button { --tilt:-5deg; display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:0; min-width:0; padding:0; border:0; border-radius:0; background:none; box-shadow:none; text-align:center; color:#eddfc0; isolation:isolate; }
#supply-screen .supply-options button::before,#supply-screen .supply-options button::after { display:none; }
#supply-screen .supply-options button:nth-child(2) { --tilt:5deg; }
#supply-screen .supply-options button:nth-child(3) { --tilt:2deg; }
#supply-screen .supply-options button:nth-child(4) { --tilt:-3deg; }
#supply-screen .supply-object { position:relative; isolation:isolate; display:grid; place-items:center; flex-shrink:1; min-height:52px; height:88px; width:100%; }
#supply-screen .supply-board { position:absolute; z-index:-1; height:100%; width:105px; object-fit:fill; transform:rotate(var(--tilt)); filter:brightness(.67) saturate(.7) drop-shadow(2px 3px #090e0bb0); transition:filter .15s; }
#supply-screen .selected .supply-board { filter:brightness(1.13) saturate(.85) drop-shadow(2px 4px #090e0bd9); }
#supply-screen .supply-art { width:91px; height:83px; object-fit:contain; transform:rotate(-7deg); filter:drop-shadow(2px 4px 1px #090e0caa); }
#supply-screen .supply-options button:nth-child(even) .supply-art { transform:rotate(8deg); }
#supply-screen .supply-symbol { display:grid; place-items:center; color:#312c22; filter:drop-shadow(1px 2px #bba16e); }
#supply-screen .supply-symbol svg { width:54px; height:60px; stroke-width:1.5; }
#supply-screen .has-art .supply-symbol { display:none; }
#supply-screen .supply-order { position:absolute; right:calc(50% - 54px); top:-2px; z-index:2; width:23px; height:23px; display:grid; place-items:center; background:linear-gradient(145deg,#36534a,#162d27); border:1px solid #dec38c; border-radius:50%; box-shadow:inset 0 0 0 2px #172b25,0 2px 5px #05100dc0; color:#f5dfa5; font:600 17px/1 system-ui,sans-serif; transform:rotate(-8deg); }
#supply-screen .supply-category { position:absolute; top:1px; left:4px; z-index:1; padding:2px 7px 3px; background:#13221ee8; border-bottom:1px solid #bca574; color:#e3c991; font-size:11px; line-height:1.2; letter-spacing:1px; }
#supply-screen [data-category="item"] .supply-category { border-color:#82bdc4; color:#b5e2e6; background:#13282ee8; }
#supply-screen [data-category="maintenance"] .supply-category { border-color:#8fa891; color:#c1d3bd; }
#supply-screen button:not(.selected):not(.claimed) .supply-order { visibility:hidden; }
#supply-screen .supply-options strong { position:relative; isolation:isolate; display:block; flex-shrink:0; margin:0; min-width:110px; max-width:100%; padding:2px 7px 4px; font-size:16px; line-height:1.2; font-weight:400; color:#e7d2ab; }
#supply-screen .supply-options strong::before { content:''; position:absolute; inset:0; z-index:-1; background:#111b17; clip-path:polygon(4% 10%,94% 0,100% 78%,88% 91%,0 100%); transform:rotate(-2deg); }
#supply-screen .supply-options .selected strong { color:#382a1e; }
#supply-screen .supply-options .selected strong::before { background:#ecd9b3; transform:rotate(2deg); }
#supply-screen .supply-options small { display:block; max-width:100%; margin:4px 0 0; color:#eadcc0; font-size:13px; line-height:1.35; min-height:35px; white-space:pre-line; text-shadow:1px 2px #101810; }
#supply-screen .supply-options button:disabled { opacity:.55; }
#supply-screen .supply-options button.claimed { opacity:.8; }
#supply-screen .supply-options button:hover:not(:disabled) { filter:brightness(1.06); }
#supply-screen .supply-footer { flex-shrink:0; background:#0b1715; padding:7px 23px 10px; margin:0; text-align:left; color:inherit; }
#supply-screen #supply-chosen { min-height:18px; font-size:12px; line-height:1.5; color:#dbc19a; }
#supply-screen .supply-next-row { display:flex; justify-content:space-between; align-items:center; gap:8px; margin:4px 0 6px; }
#supply-screen #supply-next { font-size:12px; line-height:1.4; color:#d2c6ab; margin:0; }
#supply-screen #supply-next.boss-warning { color:#ebc598; }
#supply-screen #supply-next-stage { font:23px Georgia,serif; color:#bdae8d; }
#supply-screen #supply-continue { width:100%; min-height:45px; padding:8px 22px; font-size:18px; text-align:left; }
#supply-screen #supply-continue:disabled { opacity:1; --edge:#536050; --face:#28372e; color:#afb4a1; filter:none; }
#supply-screen #supply-confirm-note { margin-top:6px; font-size:13px; line-height:1.45; color:#b4baa6; text-align:center; }
#supply-screen #supply-payout { margin:1px 0 4px; padding:0; font-size:11px; line-height:1.4; color:#e2c795; border:0; background:none; }
#supply-screen.has-payout .supply-object { height:75px; }
#supply-screen.has-payout .supply-art { height:70px; }
.supply-detail-list { margin:0; padding:0; list-style:none; }
.supply-detail-list li { padding:10px 0; border-bottom:1px solid #927b5355; }
.supply-detail-list strong { font-weight:400; }
.supply-detail-list p { margin:4px 0 0; }
@media(prefers-reduced-motion:reduce) { #supply-screen .supply-board { transition:none; } }
.reduce-motion #supply-screen .supply-board { transition:none; }
