/* 데스크톱(tkinter/ttk) 에디터 느낌의 웹 레이아웃 */
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font:13px/1.35 "Malgun Gothic",system-ui,sans-serif;background:#f0f0f0;color:#111;overflow:hidden}
#topbar{display:flex;gap:10px;align-items:center;padding:3px 10px;background:#e6e6e6;border-bottom:1px solid #bbb;height:28px}
#topbar .brand{font-weight:700}#topbar .dim{color:#777;font-size:12px}#topbar .spacer{flex:1}#topbar a{color:#136;text-decoration:none;font-size:12px}
.bar{display:flex;gap:6px;align-items:center;padding:4px 8px;background:#f0f0f0;border-bottom:1px solid #ddd;flex-wrap:wrap}
.bar .sep{color:#aaa;margin:0 6px}
.tabbar{display:flex;gap:2px;padding:4px 8px 0;background:#f0f0f0;border-bottom:1px solid #aaa}
.tab{padding:4px 12px;border:1px solid #aaa;border-bottom:0;background:#dcdcdc;cursor:pointer;border-radius:4px 4px 0 0}
.tab.on{background:#fff;font-weight:600;position:relative;top:1px}
.page{display:none;padding:6px 8px;height:calc(100vh - 28px - 38px - 31px);overflow:auto}
.page.on{display:block}
.hide{display:none !important}
.row{display:flex;gap:6px;align-items:center;margin:3px 0;flex-wrap:wrap}
.dim{color:#888;font-size:12px}.help{color:#06c;font-size:12px}.status{color:#06c}.ok{color:#080}.hdr{font-size:14px;font-weight:700;color:#036}
input[type=text],select{font:inherit;padding:2px 4px;border:1px solid #9a9a9a;background:#fff}
select.lb{width:100%;font-size:12px}
.tbtn{font:inherit;padding:3px 10px;border:1px solid #999;background:#f6f6f6;border-radius:3px;cursor:pointer}
.tbtn:hover{background:#e8e8e8}.tbtn:disabled{color:#999}
.chk{display:flex;align-items:center;gap:4px}
table{border-collapse:collapse}
.tree{overflow:auto;border:1px solid #bbb;background:#fff}
.tree table{width:100%;font-size:12px}
.tree th{background:#f3f3f3;border:1px solid #ddd;text-align:left;padding:2px 4px;position:sticky;top:0}
.tree td{padding:1px 4px;border-bottom:1px solid #f0f0f0;white-space:nowrap}
.tree tr.sel td{background:#cde4ff}.tree tbody tr:hover td{background:#eef3ff}
.tv{width:100%;font-size:12px;background:#fff;border:1px solid #bbb}.tv th{background:#f3f3f3;text-align:left;padding:2px 4px;border-bottom:1px solid #ccc}.tv td{padding:1px 4px;border-bottom:1px solid #f0f0f0}.tv tr.sel td{background:#cde4ff}
.kv{font-size:12px;background:#fff;border:1px solid #bbb;margin-top:6px;width:100%}.kv td{padding:2px 6px;border-bottom:1px solid #eee}.kv td:first-child{width:130px;color:#444}
fieldset.lf{border:1px solid #bbb;border-radius:4px;padding:8px;background:#f7f7f7}fieldset.lf legend{font-size:12px;color:#333;padding:0 4px}
/* 맵 */
/* 맵 목록 ‖ 맵 캔버스(가변) ‖ NPC 팔레트 ‖ 시나리오·DEO·워프 — ‖=드래그 스플리터(.vsplit, 폭은 JS가 localStorage로 기억) */
#tab-map{overflow:hidden}
.mapgrid{display:grid;grid-template-columns:280px 8px minmax(320px,1fr) 8px 364px 8px 300px;gap:0;height:100%;min-height:0}
.vsplit{cursor:col-resize;background:linear-gradient(to right,transparent 3px,#c3c3c3 3px,#c3c3c3 5px,transparent 5px)}
.vsplit:hover,.vsplit.on{background:linear-gradient(to right,transparent 2px,#6a9ad0 2px,#6a9ad0 6px,transparent 6px)}
.mnpc{overflow:auto;font-size:12px;min-height:0;display:flex;flex-direction:column}
.mnpc #m-npcpanel{display:flex;flex-direction:column;flex:1;min-height:0}
.mleft{display:flex;flex-direction:column;min-height:0}.mleft .tree{flex:1;min-height:200px}
.mmid{min-width:0;display:flex;flex-direction:column;min-height:0}
#m-canvas-wrap{flex:1 1 auto;min-height:320px;display:flex;align-items:center;justify-content:center;background:#000;border:1px solid #666;overflow:hidden;position:relative;cursor:crosshair;user-select:none}
#m-canvas{display:block}
.mright{overflow:auto;font-size:12px}
#m-npcgrid{flex:1 1 auto;min-height:320px;overflow:auto;background:#2a2a2a;border:1px solid #555;display:flex;flex-wrap:wrap;gap:4px;padding:3px;align-content:start;align-items:flex-end}
#m-npcgrid .np{flex:0 0 auto;min-width:74px;padding:3px;background:#3a3a3a;color:#ddd;font-size:10px;text-align:center;cursor:pointer;border:1px solid #444;box-sizing:border-box}
#m-npcgrid .np img{max-width:none;image-rendering:pixelated;display:block;margin:2px auto 4px}
#m-npcgrid .np div{max-width:128px;overflow-wrap:anywhere;margin:auto}
#gd-icon{min-width:110px;min-height:110px;width:max-content;max-width:100%;padding:12px;box-sizing:border-box;background:#000;display:flex;align-items:center;justify-content:center;flex-shrink:0}
#gd-icon img{max-width:none;flex-shrink:0;image-rendering:pixelated}
#m-npcgrid .np.sel{border-color:#ff0;background:#5a5a2a}
.evlist{background:#fff;border:1px solid #bbb;max-height:220px;overflow:auto;font:11px sans-serif;margin:2px 0 6px}
.evlist .ev{padding:3px 5px;border-bottom:1px solid #eee;cursor:pointer}
.evlist .ev:hover,.evlist .ev.sel{background:#fff4d6}
.evlist .ev .h{font-weight:bold}.evlist .ev .d{color:#555}
.evhelp{background:#fffbe8;border:1px solid #e0cf8a;padding:4px 6px;font:11px sans-serif;margin:2px 0}
.evhelp div{margin:2px 0}.evsw{display:inline-block;width:10px;height:10px;margin-right:4px;vertical-align:middle;transform:rotate(45deg)}
pre.srf{background:#fff;border:1px solid #bbb;padding:4px;max-height:260px;overflow:auto;white-space:pre-wrap;font:11px Consolas,monospace;margin:2px 0}
/* 게임 데이터 */
.subtabs{display:flex;gap:2px;margin-bottom:4px}.subtabs .tab{font-size:12px;padding:3px 10px}
/* 게임데이터: 페이지 스크롤 금지 — 목록/상세가 각자 스크롤(목록 클릭 때 화면이 아래로 밀리는 것 방지) */
#tab-data{overflow:hidden}
.gdgrid{display:grid;grid-template-columns:240px 1fr;gap:10px;height:100%;min-height:0}
.gdleft{display:flex;flex-direction:column;height:100%;min-height:0}.gdleft #gd-sel{flex:1;font:12px "Malgun Gothic",sans-serif}
#gd-detail{overflow:auto;min-width:0;height:100%}
#gd-sel{font:12px Consolas,monospace}#gd-detail{overflow:auto}#gd-title{font-size:16px}
/* 데이터 연결 */
.linkgrid{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(620px,1.7fr) minmax(440px,1.3fr);gap:10px 28px;padding:0 14px;box-sizing:border-box;height:calc(100% - 34px)}   /* ★2026-10-11 가운데는 자기 정보 창 폭(620px)으로 고정 / ★2026-10-12 왼쪽:가운데:오른쪽 = 0.8:1.7:1.3 (사용자: 1:2:1 → "왼쪽 좀더 줄이고" → "가운데 조금 줄이고 우측 조금 늘려") — 전체 화면에서 왼쪽(F2 창)만 너무 커지던 것. 창이 좁으면 최소 폭 300·620·440px 유지 / 같은 날 (사용자: "크기는 지금이 좋고 여백을 3칸에 다 줘서") 칸 사이 28px·양 끝 14px 여백 */
/* ★2026-10-10 계정·캐릭터 탭 인벤토리 = 예전 에디터 방식(장비 몸 모양 8칸 + 가방 7열 아이콘 칸) */
.lright{overflow:auto;min-width:0}
.invbadge{display:inline-block;background:#eef;border:1px solid #cce;border-radius:8px;padding:0 8px;font-size:11px;margin-left:4px}.invbadge.over{background:#fee;border-color:#e99}
.inv-eqgrid{display:grid;grid-template-columns:repeat(3,92px);grid-template-areas:". h ." "a b c" "w f s" "r . .";gap:6px}
.inv-baggrid{display:grid;grid-template-columns:repeat(7,56px);gap:4px}
.invcell{position:relative;background:#2b2b2b;border:2px solid #555;min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;color:#ddd;overflow:hidden;box-sizing:border-box;user-select:none}
.invcell:hover{border-color:#9bc}.invcell.sel{border-color:#ffd24a;background:#3d3d2b}.invcell.slot{min-height:96px;padding-top:12px}
.invcell .sl{position:absolute;top:0;left:0;right:0;font-size:10px;background:#444;text-align:center;color:#bbb}
.invcell .in{font-size:10px;text-align:center;line-height:1.1;max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}
.invcell .qty{position:absolute;right:2px;bottom:0;font-size:11px;font-weight:bold;color:#fff;text-shadow:0 0 3px #000,0 0 3px #000}
.invcell .durbar{position:absolute;left:3px;right:3px;bottom:3px;height:4px;background:#5a1d1d;border-radius:2px;overflow:hidden;pointer-events:none}
.invcell .durbar i{display:block;height:100%;background:#4cc14c}.invcell .durbar.mid i{background:#e0b030}.invcell .durbar.low i{background:#e04a3a}
.invcell.broken{outline:2px solid #d33;outline-offset:-2px}.invcell .brk{position:absolute;top:12px;right:3px;background:#d33;color:#fff;font-size:10px;line-height:1;padding:1px 3px;border-radius:2px}
.invdetail{background:#fafafa;border:1px solid #ccc;padding:6px 8px;margin:6px 0 4px;min-height:60px}.invhead{display:flex;gap:8px;align-items:center;margin:4px 0}
.lleft{display:flex;flex-direction:column}.lleft #l-rost{flex:1}
/* ★2026-10-11 보유 지휘관 = 게임 F2 창(배경 그림 위에 칸을 올림, 그림 원래 크기로 그린 뒤 칸 폭에 맞게 축소) */
.f2panel{position:relative;width:100%;overflow:hidden;flex:none;margin:2px 0 4px}
.f2inner{position:absolute;left:0;top:0;transform-origin:0 0;background-repeat:no-repeat;font-family:"Gulim","Malgun Gothic",sans-serif}
.f2slot{position:absolute;display:flex;align-items:center;justify-content:center;cursor:pointer;box-sizing:border-box}
.f2slot img{width:92%;height:92%;object-fit:contain;image-rendering:pixelated;pointer-events:none}
.f2slot span{color:#ccc;font-size:20px}
.f2slot.sel{outline:5px solid #ffd84a;outline-offset:-2px}
.f2slot:not(.empty):hover{outline:4px solid rgba(255,216,74,.6);outline-offset:-2px}
.f2slot.empty{cursor:default}
.f2face{position:absolute;image-rendering:pixelated}
.f2text{position:absolute;display:flex;align-items:center;padding-left:8px;font-size:24px;font-weight:700;color:#1e1006;white-space:nowrap;overflow:hidden}
.f2gold{position:absolute;display:flex;align-items:center;justify-content:flex-end;padding-right:8px;font-size:19px;color:#ffd84a;font-weight:700;box-sizing:border-box}
#l-fields{display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr;gap:2px 6px;align-items:center}
#l-fields .title{grid-column:1/7;font-weight:700;margin-top:8px}
#l-fields label{text-align:right;color:#333}#l-fields input,#l-fields select{width:100%}
#l-fields input.derived{background:#e9e9e9;color:#666}
/* ★2026-10-11 F3 자기 정보 창(게임 화면 모양) */
#l-fields:has(.f3win){display:block}
.f3win{--f3bg:#c9a677;--f3cell:#a8743f;--f3dark:#5a3415;--f3hi:#e4c89c;--f3text:#1e1006;background:var(--f3bg);border:3px solid var(--f3dark);box-shadow:inset 0 0 0 2px var(--f3hi),inset 0 0 0 4px var(--f3dark);padding:10px 12px 12px;max-width:720px;font-family:"Gulim","Malgun Gothic",sans-serif;color:var(--f3text)}
.f3title{text-align:center;font-size:22px;font-weight:700;letter-spacing:6px;padding:4px 0 6px;margin:-4px -6px 8px;border-bottom:3px double var(--f3dark);background:linear-gradient(#d8b98a,#b8915f)}
.f3body{display:grid;grid-template-columns:170px 1fr;gap:12px}
.f3left{display:flex;flex-direction:column;align-items:center;gap:10px}
.f3face{width:136px;height:136px;padding:3px;background:#6e7fb8;border:3px solid var(--f3dark);box-shadow:inset 0 0 0 2px #c8d0f0}
.f3face img{width:128px;height:128px;image-rendering:pixelated;display:block;background:#222}
.f3box{width:150px;border:2px solid var(--f3dark)}
.f3boxh{text-align:center;font-weight:700;font-size:16px;background:var(--f3cell);border-bottom:2px solid var(--f3dark);padding:2px}
.f3boxv input{width:100%;text-align:center;font-size:15px}
.f3merc{display:flex;align-items:center;gap:6px;font-size:18px;font-weight:700}
.f3mercimg{width:68px;height:68px;border:3px solid var(--f3dark);background:#273b6a;display:flex;align-items:center;justify-content:center;overflow:hidden}
.f3mercimg img{max-width:64px;max-height:64px;image-rendering:pixelated}
.f3merc input{width:48px;font-size:16px;text-align:center}
.f3adj{text-align:center;font-weight:700;font-size:16px}
.f3adjv{display:flex;align-items:center;justify-content:center;gap:4px;font-size:12px;font-weight:400;margin-top:3px;white-space:nowrap}.f3adjv input{width:60px;text-align:center}
.f3right{display:flex;flex-direction:column;gap:10px}
.f3top{border:2px solid var(--f3dark);background:var(--f3cell)}
.f3row{display:flex;align-items:stretch;border-bottom:2px solid var(--f3dark)}.f3row:last-child{border-bottom:0}
.f3lab{flex:none;width:56px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;background:var(--f3bg);border-right:2px solid var(--f3dark);letter-spacing:1px}
.f3row .f3lab+.f3val+.f3lab{border-left:2px solid var(--f3dark)}
.f3val{flex:1;display:flex;align-items:center;gap:6px;padding:2px 4px;min-width:0}
.f3val.f3short{flex:0 0 70px}
.f3note{font-size:15px;white-space:nowrap}
.f3stats,.f3extra{display:grid;grid-template-columns:auto 1fr auto 1fr;border:2px solid var(--f3dark);background:var(--f3cell)}
.f3slab{font-weight:700;font-size:13px;padding:2px 8px;white-space:pre;background:var(--f3bg);border-bottom:1px solid var(--f3dark);border-right:1px solid var(--f3dark);display:flex;align-items:center}
.f3sval{border-bottom:1px solid var(--f3dark);border-right:2px solid var(--f3dark);padding:1px 4px;display:flex;align-items:center}
.f3extra{grid-template-columns:auto 1fr auto 1fr auto 1fr;margin-top:4px}
.f3exh{margin-top:10px;font-weight:700;font-size:13px}
.f3win input[type=text],.f3win select{background:transparent;border:1px solid transparent;color:var(--f3text);font:inherit;font-size:16px;width:100%;padding:1px 3px}
.f3win .f3stats input,.f3win .f3extra input,.f3win .f3extra select{text-align:center;font-size:15px}
.f3win input[type=text]:hover,.f3win select:hover{border-color:rgba(90,52,21,.5)}
.f3win input[type=text]:focus,.f3win select:focus{background:#f3e6cc;border-color:var(--f3dark);outline:none}
#l-fields .f3win input.derived{background:rgba(0,0,0,.14);color:#3e2a15;border-color:transparent;font-style:italic}
.f3win select option{background:#fff;color:#111}
/* ★2026-10-11 (사용자: "가운데 자기정보를 좀 더 줄여줘") 약 80% 크기 — 위 규칙을 덮어쓴다 */
.f3win{max-width:none;padding:6px 8px 8px;border-width:2px}   /* ★2026-10-12 (사용자: "가운데 자기정보칸은 우측 빈칸까지 꽉 채워줘") 580px 상한을 없애 가운데 칸 폭을 다 쓴다 */
.f3title{font-size:17px;letter-spacing:5px;padding:2px 0 4px;margin:-2px -4px 6px}
.f3body{grid-template-columns:128px 1fr;gap:8px}
.f3left{gap:6px}
.f3face{width:104px;height:104px;padding:2px;border-width:2px}.f3face img{width:96px;height:96px}
.f3box{width:118px}.f3boxh{font-size:13px;padding:1px}.f3boxv input{font-size:13px}
.f3merc{font-size:14px;gap:4px}.f3mercimg{width:50px;height:50px;border-width:2px}.f3mercimg img{max-width:46px;max-height:46px}.f3merc input{width:38px;font-size:13px}
.f3adj{font-size:13px}.f3adjv{font-size:11px}.f3adjv input{width:48px}
.f3right{gap:6px}
.f3lab{width:44px;font-size:13px;letter-spacing:0}
.f3val{padding:1px 3px;gap:4px}.f3val.f3short{flex:0 0 54px}.f3note{font-size:12px}
.f3slab{font-size:11px;padding:1px 5px}.f3sval{padding:0 3px}
.f3exh{margin-top:6px;font-size:11px}
.f3win input[type=text],.f3win select{font-size:13px;padding:0 2px}
.f3win .f3stats input,.f3win .f3extra input,.f3win .f3extra select{font-size:12px}
/* 순간이동 */
.telegrid{display:grid;grid-template-columns:1fr 300px;gap:10px;height:calc(100% - 80px)}
.tree tr.tele-hidden td{color:#aaa;text-decoration:line-through}.tree tr.tele-hidden td:first-child{text-decoration:none}
/* 서버 설정 */
.setgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;height:calc(100% - 34px)}
.props{overflow:auto;max-height:calc(100vh - 170px)}.props .c{color:#888;font-size:11px;white-space:pre-wrap}.props .kv{display:grid;grid-template-columns:260px 1fr;gap:6px;margin:1px 0}
/* 서버 설정(카드형) */
#tab-settings.on{display:flex;flex-direction:column;overflow:hidden}
.setgrid2{display:grid;grid-template-columns:190px 1fr;gap:10px;flex:1;min-height:0;padding-top:6px}
.snav{overflow:auto;background:#fff;border:1px solid #c8c8c8;border-radius:6px;padding:4px}
.snav a{display:flex;justify-content:space-between;align-items:center;padding:5px 8px;border-radius:4px;color:#223;text-decoration:none;cursor:pointer}
.snav a:hover{background:#eef3ff}.snav a.on{background:#1f5fae;color:#fff}
.snav a .n{font-size:11px;color:#889;background:#f0f2f6;border-radius:9px;padding:0 6px}.snav a.on .n{background:#3d7bd0;color:#fff}
.snav a .n.chg{background:#f7b733;color:#000}
.sseg{display:flex;flex-direction:column;gap:4px;margin-bottom:6px;padding-bottom:6px;border-bottom:1px solid #ddd}
.sseg button{font:inherit;font-weight:600;display:flex;justify-content:space-between;align-items:center;padding:7px 8px;border:1px solid #b8c4d6;border-radius:5px;background:#f4f6fa;color:#1f3f6e;cursor:pointer;text-align:left}
.sseg button:hover{background:#e6edf8}.sseg button.on{background:#123f7a;border-color:#123f7a;color:#fff}
.sseg button .n{font-size:11px;font-weight:400;background:#dfe5ee;color:#556;border-radius:9px;padding:0 6px}.sseg button.on .n{background:#2c5ea3;color:#fff}
.sseg button.chg{box-shadow:inset 3px 0 0 #f7b733}
.sprops{overflow:auto;padding-right:6px}
.sgroup{margin:0 0 14px}
.sgroup>h3{margin:4px 0 6px;font-size:15px;color:#1f3f6e;border-bottom:2px solid #1f5fae;padding-bottom:3px;display:flex;gap:8px;align-items:baseline}
.sgroup>h3 small{font-size:11px;color:#889;font-weight:400}
.scards{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:8px}
.scard{background:#fff;border:1px solid #d4d8de;border-radius:6px;padding:8px 10px;display:flex;flex-direction:column;gap:4px}
.scard.chg{border-color:#f0a500;box-shadow:0 0 0 2px #ffe3a3}
.scard .top{display:flex;gap:8px;align-items:flex-start;justify-content:space-between}
.scard .ttl{font-weight:600;color:#1a1a1a;line-height:1.35}
.scard .key{font:11px Consolas,monospace;color:#7a8594;word-break:break-all}
.scard .ctl{flex:none;display:flex;align-items:center;gap:4px}
.scard .top>div:first-child{flex:1;min-width:0}
.scard .ctl input[type=text]{width:150px}.scard .ctl input.num{width:90px;text-align:right}.scard .ctl input.wide{width:170px}
.scard details{font-size:11px;color:#667}.scard details summary{cursor:pointer;color:#06c;width:max-content}
.scard details pre{white-space:pre-wrap;margin:4px 0 0;font:11px/1.4 "Malgun Gothic",sans-serif;background:#f7f8fa;border-radius:4px;padding:4px 6px}
.scard .badge{font-size:10px;background:#f7b733;color:#000;border-radius:3px;padding:0 4px;margin-left:4px}
.scard .ro{font-size:10px;background:#ddd;color:#555;border-radius:3px;padding:0 4px;margin-left:4px}
.sw{position:relative;display:inline-block;width:42px;height:22px}.sw input{opacity:0;width:0;height:0}
.sw span{position:absolute;inset:0;background:#c3c7cd;border-radius:11px;transition:.15s;cursor:pointer}
.sw span:before{content:"";position:absolute;width:16px;height:16px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.15s;box-shadow:0 1px 2px rgba(0,0,0,.3)}
.sw input:checked+span{background:#2e8b57}.sw input:checked+span:before{transform:translateX(20px)}
.swlbl{font-size:12px;color:#555;min-width:24px}
.sbtn-save.dirty{background:#f7b733;border-color:#c98a00;font-weight:600}
.sempty{color:#888;padding:20px}
/* 가문 */
.guildgrid{display:grid;grid-template-columns:260px 1fr;gap:10px;height:100%}
table.form td{padding:2px 6px}
/* 모달 */
#modal{position:fixed;inset:0;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;z-index:50}
.mbox{background:#f0f0f0;border:1px solid #888;border-radius:6px;padding:12px;min-width:360px;max-width:90vw;max-height:90vh;overflow:auto;box-shadow:0 6px 24px rgba(0,0,0,.3)}
.mbox h3{margin:0 0 8px;font-size:14px}
.mbox .row{margin:4px 0}
.travel-editor{width:min(1080px,82vw)}
.travel-panels{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.travel-panels section{min-width:0}
.travel-viewport{overflow:auto;max-height:52vh;background:#18201c}
.travel-panels canvas{width:100%;display:block;cursor:crosshair;image-rendering:pixelated}
.travel-note{color:#a02020;min-height:20px;margin-top:8px}
@media(max-width:750px){.travel-panels{grid-template-columns:1fr}}
/* 리소스: 명령어 안내와 목적지 편집 */
#tab-res{overflow:auto}
.command-reference{height:32vh;min-height:170px;margin-bottom:12px}
.command-reference th:nth-child(1){width:95px}.command-reference th:nth-child(2){width:350px}
.command-travel{display:grid;grid-template-columns:minmax(350px,1fr) 370px;gap:10px;min-height:240px;height:35vh;margin-top:8px}
.command-travel input{max-width:85px}
@media(max-width:900px){.command-travel{grid-template-columns:1fr;height:auto}.command-travel .tree{max-height:300px}}
/* Entrance wizard */
.travel-step-title { padding:10px 12px; background:#18374a; color:#fff; font-size:16px; font-weight:700; border-radius:5px; margin-bottom:8px; }
.travel-summary { white-space:pre-wrap; padding:12px; background:#e8f4ec; color:#163622; line-height:1.8; border-radius:5px; }
/* 상점: 마을별 판매 품목 */
.shopgrid{display:grid;grid-template-columns:minmax(420px,38%) 1fr;gap:10px;height:calc(100% - 96px);min-height:420px}
.shopgrid>.tree{min-height:0}.shopgrid .tree tbody tr{cursor:pointer}
.shopedit{display:flex;flex-direction:column;gap:8px;min-height:0}
.shopedit .lbl{width:96px;text-align:right}
.shopitems{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex:1;min-height:0}
.shopcol{display:flex;flex-direction:column;gap:4px;min-height:0}.shopcol .tree{flex:1;min-height:160px}
.shopcol td .tbtn{padding:0 6px;margin-right:2px}
@media(max-width:1100px){.shopgrid{grid-template-columns:1fr;height:auto}.shopitems{grid-template-columns:1fr}.shopcol .tree{max-height:320px}}
/* ★2026-10-13 서버 설정 — NAS 고정(📌) 표시 */
.scard .pinrow{display:flex;gap:8px;align-items:center;font-size:11px;color:#6a4b00}
.scard .pinrow .pin{background:#fff3c4;border:1px solid #e8c95a;border-radius:3px;padding:0 5px}
.scard .pinrow a{color:#06c;cursor:pointer;text-decoration:underline}
/* ★2026-10-13 (user3) 모바일 = body.mobile(editor.js setupMobile) — [데이터 연결]·[서버 설정] 두 탭만, 한 줄로 쌓기 */
body.mobile{overflow-y:auto;overflow-x:hidden;font-size:14px;-webkit-text-size-adjust:100%}
body.mobile #topbar{height:auto;flex-wrap:wrap;padding:6px 10px;gap:6px}
body.mobile #topbar #dbwhere{display:none}
body.mobile #gdbar{display:none!important}
body.mobile #tabs{position:sticky;top:0;z-index:20;padding:6px 8px 0}
body.mobile #tabs .tab{display:none;flex:1;text-align:center;padding:10px 6px;font-size:15px;font-weight:600}
body.mobile #tabs .tab[data-tab=link],body.mobile #tabs .tab[data-tab=settings]{display:block}
body.mobile #tabs .tab.on{background:#fff}
body.mobile .page{height:auto;overflow:visible;padding:6px 8px 40px}
body.mobile .bar{position:sticky;top:46px;z-index:15;padding:6px 4px;gap:6px}
body.mobile .tbtn{padding:8px 12px;font-size:14px;min-height:38px}
body.mobile input[type=text],body.mobile input:not([type]),body.mobile select{font-size:16px}   /* iOS 확대 막기 */
body.mobile .status{flex-basis:100%;font-size:12px}
body.mobile .mbox{min-width:0;width:94vw;max-width:94vw;box-sizing:border-box;max-height:88vh}
body.mobile .mbox input[type=text]{max-width:100%;box-sizing:border-box}
/* 데이터 연결: 왼쪽(계정·지휘관) → 가운데(F3 정보) → 오른쪽(인벤토리) 순서로 위에서 아래 */
body.mobile .linkgrid{display:flex;flex-direction:column;gap:16px;padding:0;height:auto}
body.mobile .lleft,body.mobile .lmid,body.mobile .lright{min-width:0;width:100%;overflow:visible}
body.mobile .lleft select.lb{font-size:16px}
body.mobile .lleft #l-rost{flex:none}
body.mobile .lleft select.lb{max-height:200px}
body.mobile .row{flex-wrap:wrap}
body.mobile #l-fields{grid-template-columns:auto 1fr}
body.mobile #l-fields .title{grid-column:1/3}
body.mobile .f3win{max-width:100%;box-sizing:border-box}
body.mobile .f3body{grid-template-columns:1fr}
body.mobile .f3left{flex-direction:row;flex-wrap:wrap;justify-content:center}
body.mobile .f3right,body.mobile .f3top,body.mobile .f3stats,body.mobile .f3extra{min-width:0}
body.mobile .f3stats,body.mobile .f3extra{grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr)}
body.mobile .f3win input,body.mobile .f3win select,body.mobile .f3val,body.mobile .f3sval{min-width:0;max-width:100%;box-sizing:border-box}
body.mobile .f3slab{white-space:normal}
body.mobile .f3row{flex-wrap:wrap}
body.mobile .f3note{white-space:normal}
body.mobile .inv-eqgrid{grid-template-columns:repeat(3,minmax(0,92px));justify-content:center}
body.mobile .inv-baggrid{grid-template-columns:repeat(auto-fill,minmax(52px,1fr))}
body.mobile .invcell{min-height:52px}
body.mobile .lright .row button[style*="margin-left:auto"]{margin-left:0!important}
/* 서버 설정: 왼쪽 분류 목록 → 위 가로 띠(옆으로 밀기), 카드 한 줄에 하나 */
body.mobile .setgrid2{display:block;padding-top:4px}
body.mobile .snav{display:flex;gap:4px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:4px;margin-bottom:8px;}
body.mobile .snav a{flex:none;white-space:nowrap;gap:6px;padding:7px 10px}
body.mobile .snav .sseg{flex-direction:row;flex:none;gap:4px;margin:0 4px 0 0;padding:0 6px 0 0;border-bottom:0;border-right:1px solid #ddd}
body.mobile .sseg button{white-space:nowrap;gap:6px}
body.mobile #tab-settings .bar{position:static}
body.mobile .sprops{overflow:visible;padding-right:0}
body.mobile .scards{grid-template-columns:1fr}
body.mobile .scard{padding:10px 12px}
body.mobile .scard .ctl input[type=text]{width:120px}body.mobile .scard .ctl input.wide{width:150px}
body.mobile .scard .key{font-size:11px}
body.mobile #s-search{flex:1 1 100%;min-width:0}
/* ★2026-10-13 확인 창 — 첫 버튼(반영·재시작·예) = 주 버튼. 모바일 = 글 크게, 버튼은 가로 꽉 차게·높게 */
.mbtns .tbtn.mprimary{background:#1f5fae;border-color:#1f5fae;color:#fff;font-weight:600}.mbtns .tbtn.mprimary:hover{background:#174d90}
body.mobile #modal{align-items:flex-end}
body.mobile .mbox{border-radius:12px 12px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom));font-size:15px}
body.mobile .mbox h3{font-size:17px}
body.mobile .mbox #mbody>div[style*="pre-wrap"]{max-width:none!important;line-height:1.5}
body.mobile .mbtns{display:flex;gap:10px;margin-top:16px!important}
body.mobile .mbtns .tbtn{flex:1;min-height:50px;font-size:17px;border-radius:8px}
/* ★2026-10-13 [서버 설정] 최근 배포 2개(#s-history) */
.dhist{margin:6px 0 2px;display:flex;flex-direction:column;gap:6px;max-height:30vh;overflow:auto;padding-right:4px}
.dhist .dh-head{font-weight:700;color:#234}
.dh-card{background:#fff;border:1px solid #cfd8e3;border-left:4px solid #2e8b57;border-radius:6px;padding:6px 10px}
.dh-card.err{border-left-color:#d33}
.dh-top{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.dh-top code{color:#556;font-size:11px}
.dh-res{font-size:12px}
.dh-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.dh-chip{font-size:11px;background:#eef3fb;border:1px solid #c9d6ea;border-radius:9px;padding:0 7px}
.dh-commits{margin:4px 0 0;padding-left:16px;font-size:12px}.dh-commits li{margin:2px 0;line-height:1.4}
.dh-commits code{color:#1f5fae;margin-right:6px}.dh-who{color:#777;margin-right:6px;font-size:11px}
.dh-card details{font-size:11px;margin-top:4px}.dh-card details summary{cursor:pointer;color:#06c}
.dh-card details pre{max-height:220px;overflow:auto;background:#f7f8fa;border-radius:4px;padding:4px 6px;margin:4px 0 0;white-space:pre-wrap;word-break:break-all}
body.mobile .dh-commits{font-size:13px}
body.mobile .dhist{max-height:none;overflow:visible}
