/* v1.8 · giao diện khách thoại + biểu cảm, kệ hàng, chuyện xóm */
body.v18-layout .scene{height:clamp(380px,47dvh,500px)}
body.v18-layout .scene>.chat-link{top:4px;z-index:7;max-width:calc(100% - 16px)}
body.v18-layout .order.o18-wrap{position:absolute!important;top:34px;left:6px;right:6px;z-index:6;padding:0!important;margin:0!important;max-height:none;background:none!important;box-shadow:none!important;border:0!important}
body.v18-layout .order.o18-wrap.idle{top:34px}
.o18{background:repeating-linear-gradient(0deg,#321606 0 3px,#3b1b09 3px 5px);border-radius:10px;box-shadow:inset 0 0 0 2px #1a0d04,inset 0 0 0 3px #e3a14b,0 5px 0 #160a06cc;padding:7px 8px 8px;color:#ffeccb}
.o18.m-happy{box-shadow:inset 0 0 0 2px #1a0d04,inset 0 0 0 3px #7be29a,0 5px 0 #160a06cc}
.o18.m-worry{box-shadow:inset 0 0 0 2px #1a0d04,inset 0 0 0 3px #ffb84a,0 5px 0 #160a06cc}
.o18.m-angry{box-shadow:inset 0 0 0 2px #1a0d04,inset 0 0 0 3px #ff5a4a,0 5px 0 #160a06cc;animation:shake18 .45s infinite}
.o18-head{display:flex;align-items:center;gap:6px;min-height:26px}
.o18-name{font-size:13px;background:#160a05;border:1px solid #7a4b23;border-radius:6px;padding:3px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46%}
.o18-badge{font-size:11px;font-weight:800;letter-spacing:.3px;background:#b92d1f;color:#fff;border-radius:6px;padding:3px 7px;white-space:nowrap;border:1px solid #ffb199}
.m-happy .o18-badge{background:#1d8a46;border-color:#a8f0c0}
.m-ok .o18-badge{background:#6b4a2a;border-color:#d9b074}
.m-worry .o18-badge{background:#c9791a;border-color:#ffd592}
.o18-pat{flex:1;height:9px;background:#160a05;border:1px solid #6b4a2a;border-radius:6px;overflow:hidden;min-width:34px}
.o18-pat i{display:block;height:100%;background:linear-gradient(90deg,#d63a2a,#f4a13a,#5fd37a);transition:width .25s linear}
.o18-x{min-height:24px!important;width:26px;padding:0!important;line-height:1}
.o18-say{display:flex;gap:8px;align-items:flex-start;margin:6px 0;background:#160a05b8;border:1px solid #7a4b23;border-radius:7px;padding:7px 9px;min-height:44px}
.o18-quote{flex:1;font-family:var(--chat-font,inherit);font-size:13px;line-height:1.4;overflow-wrap:anywhere}
.o18-prog{font-size:11px;color:#ffd48a;white-space:nowrap}
.o18-items{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.o18-items::-webkit-scrollbar{display:none}
.o18-item{flex:0 0 auto;min-width:104px;max-width:150px;display:grid;grid-template-columns:38px 1fr;grid-template-rows:auto auto;column-gap:6px;align-items:center;text-align:left;background:linear-gradient(#5a3317,#40220f);border:2px solid #8a5a2b;border-radius:8px;padding:4px 7px 4px 4px;color:#fff1d0;position:relative}
.o18-item .mini,.o18-item .sprite18{grid-row:1/3;width:36px;height:36px;object-fit:contain;display:block;font-size:26px;text-align:center}
.o18-iname{font-size:12px;font-weight:700;line-height:1.15}
.o18-item small{font-size:10px;color:#ffd48a;line-height:1.2}
.o18-qty{position:absolute;top:-6px;right:-4px;background:#d63a2a;color:#fff;border-radius:10px;padding:1px 6px;font-size:11px;font-weight:800;border:1px solid #fff4}
.o18-item.done{border-color:#7be29a;background:linear-gradient(#2d5a35,#1f3f26)}
.o18-item.done small{color:#a8f0c0}
.o18-item.pay{border-color:#7be29a;animation:pop18 .5s}
.o18.idle .o18-say{min-height:38px}
.o18-wrap.idle .o18{opacity:.97}
#emote18{position:absolute;right:9%;bottom:44%;width:46px;height:46px;border-radius:50%;background:#fffbe8;border:3px solid #5a3a1a;display:flex;align-items:center;justify-content:center;font-size:27px;z-index:5;box-shadow:0 3px 0 #0006;animation:pop18 .4s}
#emote18::after{content:'';position:absolute;left:-7px;bottom:6px;border:7px solid transparent;border-right-color:#5a3a1a;border-left:0}
#emote18.emote-angry{border-color:#d63a2a;background:#ffe1dc;animation:shake18 .4s infinite}
#emote18.emote-worry{border-color:#e08a1a;background:#fff0d6}
#emote18.emote-happy{border-color:#2fa85a;background:#e4ffe9;animation:bounce18 1.2s infinite}
.customer-sprite.mood-angry{animation:shake18 .4s infinite!important;filter:saturate(1.3) drop-shadow(0 0 10px #ff4a3a)}
.customer-sprite.mood-worry{animation:sway18 1.8s ease-in-out infinite!important;filter:saturate(.9)}
.customer-sprite.mood-happy{animation:bounce18 1.3s ease-in-out infinite!important}
@keyframes shake18{0%,100%{transform:translateX(0)}25%{transform:translateX(-2px) rotate(-.6deg)}75%{transform:translateX(2px) rotate(.6deg)}}
@keyframes bounce18{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes sway18{0%,100%{transform:rotate(-1.2deg)}50%{transform:rotate(1.2deg)}}
@keyframes pop18{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}
/* hình hàng hóa vẽ bằng SVG */
img.sprite18{display:block;margin:0 auto;object-fit:contain;-webkit-user-drag:none;user-select:none;pointer-events:none}
.product img.art.sprite18{width:78px;height:78px;max-width:100%}
.product .art{height:78px}
.product{min-height:150px}
.furniture-art.svg18{background-repeat:no-repeat}
/* bố cục compact: dock chỉ còn các tab phụ */
#compactDock17 summary{min-height:38px}
body.v18-layout .walletbar{margin:0}
body.v18-layout .inventory{margin:0}
.quickbar .st18-dot,#compactDock17 .st18-dot{color:#ff5a4a;font-size:11px}
/* chuyện xóm */
.st18-cal{display:flex;flex-wrap:wrap;gap:6px;align-items:center;background:#2a1809;border:1px solid #7a4b23;border-radius:8px;padding:6px 10px;margin-bottom:8px}
.st18-cal b{color:#ffd48a}.st18-cal em{font-style:normal;background:#6b2f1a;border-radius:6px;padding:2px 7px;font-size:12px}
.st18-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.st18-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 6px 8px;background:linear-gradient(#4a2a12,#321a09);border:2px solid #8a5a2b;border-radius:10px;color:#ffeccb;text-align:center}
.st18-card small{font-size:10px;color:#e6c999;line-height:1.2;min-height:24px}
.st18-card.bday{border-color:#ffd34e;box-shadow:0 0 10px #ffd34e88}
.st18-face{width:62px;height:96px;object-fit:contain;background:radial-gradient(circle at 50% 70%,#6b4a2a55,transparent 70%)}
.st18-face.fb{display:flex;align-items:center;justify-content:center;font-size:36px}
.st18-big{width:92px;height:142px;object-fit:contain;flex:0 0 auto}
.st18-hearts{font-size:12px;letter-spacing:-1px;color:#ff6b86}
.st18-hearts i{font-style:normal;color:#5a3a3a}
.st18-new{position:absolute;top:4px;left:4px;background:#d63a2a;color:#fff;border-radius:8px;padding:1px 6px;font-size:10px;font-weight:700}
.st18-new.b{left:auto;right:4px;background:#e0a82e;color:#3a220c}
.st18-npc{display:flex;gap:12px;align-items:center;margin-bottom:6px}
.st18-npc h3{margin:0 0 2px}
.st18-say,.st18-scene{background:#160a05b8;border:1px solid #7a4b23;border-radius:8px;padding:10px 12px;font-size:14px;line-height:1.5}
.st18-like{font-size:12px;color:#e6c999;line-height:1.6}
.st18-progress{display:flex;align-items:center;gap:6px;margin:6px 0}
.st18-progress span{width:24px;height:24px;border-radius:50%;background:#2a1809;border:2px solid #7a4b23;display:flex;align-items:center;justify-content:center;font-size:12px}
.st18-progress span.ok{background:#2d7a45;border-color:#7be29a}
.st18-progress em{font-style:normal;font-size:12px;color:#ffd48a;margin-left:4px}
.st18-choices{display:grid;gap:8px;margin-top:10px}
.st18-choices button{text-align:left;padding:10px 12px;line-height:1.35}
.st18-reward{background:#1f3f26;border:1px solid #7be29a;border-radius:8px;padding:8px 10px;color:#c8ffd8}
.st18-gifts{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;max-height:48vh;overflow:auto;margin-bottom:8px}
.st18-gifts button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 3px;font-size:11px;line-height:1.2}
.st18-gifts button.love{border-color:#ff6b86;box-shadow:0 0 8px #ff6b8688}
.st18-gifts button.like{border-color:#ffd34e}
.st18-gifts .mini,.st18-gifts .sprite18{width:38px;height:38px}
.st18-menu .row,#modalBody .row small{font-size:12px}
.st18-menu .row small,#modalBody .row>span small{display:block;color:#e6c999}

#compactDock17 .dock18{flex:1;min-width:0;padding:10px 2px;font-size:11px;white-space:nowrap;border:1px solid #e0b05a;border-radius:8px;background:linear-gradient(#2f7a4a,#1d4a2c);color:#eaffd8}
.st18-npc .st18-hearts{display:block;margin-top:4px;font-size:15px}
.st18-npc small{display:block}
