/* 曦曦的美食系统 v17 · 样式（assets/v17/v17.css）
   延续 v16 的月下星界厨房：深靛夜色、金箔细线。v17 加了两种真实材质——漆木（框）和提花锦缎（底纹），都来自 Poly Haven（CC0）。
   一处用力：连连看的棋盘和顶部的宴席长桌；其余地方只做收边、层次和图标阴影。 */
:root{--x17-gold:#f4cf7a;--x17-gold2:#c9922e;--x17-ink:#120c26;--x17-cloth:url("tex/floral_jacquard.webp?v=17.0.0");--x17-wood:url("tex/lacquered_cherry_wood.webp?v=17.0.0")}

/* =============== 百味连连看 =============== */
.p16.l17{grid-template-rows:auto auto auto minmax(0,1fr) auto;background:radial-gradient(130% 70% at 50% 0%,#2c1d5c,#140d2c 58%,#0b0820);touch-action:manipulation}
.p16.l17::before{content:"";position:absolute;inset:0;background:var(--l17bg,var(--mg16sky,none)) center/cover;opacity:.32;pointer-events:none;transition:background-image .4s}
.p16.l17::after{content:"";position:absolute;inset:0;pointer-events:none;background:var(--x17-cloth) center/220px;opacity:.05;mix-blend-mode:screen}
.l17 .p16Hud{z-index:3;gap:8px}
.l17 .p16T{min-width:0;flex:1}
.l17 .p16Stat{gap:4px;font-size:13px;flex:none}.l17 .p16Stat span{padding:2px 7px}
.l17Bk{display:inline-flex;align-items:center;gap:2px}.l17Bk img{width:16px;height:16px}
.l17Sub{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.l17Top{position:relative;z-index:2;height:clamp(64px,12.5vh,118px);margin:0 10px;border-radius:14px;overflow:hidden;
  background:linear-gradient(180deg,rgba(40,20,30,.0),rgba(60,24,24,.35)),radial-gradient(80% 120% at 50% 100%,rgba(255,170,90,.18),transparent 70%);
  box-shadow:inset 0 0 0 1px rgba(244,207,122,.28),inset 0 -18px 30px -18px rgba(0,0,0,.6)}
.l17Feast{position:absolute;inset:0;width:100%;height:100%;display:block}
.l17Orders{position:absolute;left:6px;right:6px;bottom:5px;display:flex;gap:6px;justify-content:center;pointer-events:none}
.l17.noOrders .l17Orders{display:none}
.l17.noFeast .l17Feast{display:none}
.l17.noFeast.noOrders .l17Top{display:none}
.l17O{--p:1;position:relative;display:flex;align-items:center;gap:5px;padding:3px 9px 3px 4px;border-radius:999px;background:rgba(18,10,36,.82);border:1px solid rgba(244,207,122,.55);color:#fff3d6;font:13px var(--mg-cn);max-width:32%;
  box-shadow:0 4px 12px -4px rgba(0,0,0,.6);transition:transform .25s,opacity .25s}
.l17O::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;border-radius:2px;background:linear-gradient(90deg,#7ef0d8,#f4cf7a);transform-origin:0 50%;transform:scaleX(var(--p))}
.l17O img{width:26px;height:26px;object-fit:contain;filter:drop-shadow(0 2px 3px rgba(0,0,0,.5))}
.l17O b{font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.l17O.late{border-color:#ff7a4a;animation:l17late .5s ease-in-out infinite alternate}.l17O.late::after{background:linear-gradient(90deg,#ff5a36,#ffb469)}
.l17O.done{transform:translateY(-14px) scale(1.08);opacity:0;border-color:#7ef0d8}
.l17O.wait{opacity:.6}.l17O.wait b{font-size:12px}
@keyframes l17late{to{box-shadow:0 0 14px -2px #ff6a3a}}
.l17Gauge{position:relative;z-index:2;display:grid;gap:4px;padding:6px 14px 2px}
.l17Gauge .l16Bar{margin:0}
.l17.zen .l17Gauge .l16Bar{display:none}
.l17Fev{position:relative;height:16px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(180,140,255,.35);overflow:hidden}
.l17Fev i{position:absolute;inset:0;transform-origin:0 50%;background:linear-gradient(90deg,#ff5a36,#ffd35a,#9fd23a,#4ea8f5,#a98be0,#ff8fb8);opacity:.75;transition:transform .2s linear}
.l17Fev span{position:relative;display:block;text-align:center;font:12px/16px var(--mg-cn);color:#fff3d6;text-shadow:0 1px 2px #000;letter-spacing:.08em}
.l17Fev.on{border-color:#fff3d6;box-shadow:0 0 16px -2px rgba(255,180,224,.8)}.l17Fev.on i{opacity:1;animation:l17rain 1s linear infinite}
.l17Fev.met{border-color:#c4a2ff;box-shadow:0 0 14px -2px #b48cff}
@keyframes l17rain{to{filter:hue-rotate(360deg)}}
.l17 .l16Wrap{padding:2px 4px}
.l17Tools{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:4px 10px calc(10px + env(safe-area-inset-bottom,0px))}
.l17B{display:flex;flex-direction:column;align-items:center;gap:1px;padding:5px 2px 6px;border-radius:14px;border:1px solid rgba(244,207,122,.45);background:linear-gradient(170deg,rgba(46,32,96,.9),rgba(18,12,40,.94));color:#fff3d6;font:13px var(--mg-cn);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 6px 14px -8px rgba(0,0,0,.8)}
.l17B img{width:26px;height:26px;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}
.l17B b{position:absolute;margin:-2px 0 0 34px;min-width:18px;padding:0 4px;border-radius:9px;background:var(--x17-gold);color:#2a1606;font:600 11px/16px sans-serif}
.l17B{position:relative}.l17B:active{transform:scale(.95)}
.l17Ring{--en:0;position:relative;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#7ef0d8 calc(var(--en)*360deg),rgba(255,255,255,.1) 0)}
.l17Skill{--en:0}.l17Skill .l17Ring{background:conic-gradient(#7ef0d8 calc(var(--en)*360deg),rgba(255,255,255,.1) 0)}
.l17Ring img{width:24px;height:24px;border-radius:50%;background:#1a1236}
.l17Skill.full{border-color:#7ef0d8;animation:l17ready 1s ease-in-out infinite alternate}
.l17Skill.go{animation:none;box-shadow:0 0 22px -2px #7ef0d8}
@keyframes l17ready{from{box-shadow:0 0 0 0 rgba(126,240,216,.0)}to{box-shadow:0 0 18px -2px rgba(126,240,216,.85)}}
.l17.menu .l17Top,.l17.menu .l17Gauge,.l17.menu .l17Tools,.l17.menu .l16Wrap{visibility:hidden}
.l17 .p16Mid{position:absolute;inset:0;z-index:5;padding:calc(64px + env(safe-area-inset-top,0px)) 12px 14px}
.l17Card{max-width:400px;max-height:calc(100% - 4px);background:linear-gradient(160deg,rgba(34,24,72,.97),rgba(16,11,36,.98)),var(--x17-cloth) center/240px;background-blend-mode:normal}
.l17Card.menuCard{align-self:start}
.l17Head{display:flex;align-items:center;gap:10px;justify-content:space-between}
.l17Head h3{margin:0}
.l17Dex{display:flex;align-items:center;gap:5px;padding:5px 10px 5px 6px;border-radius:999px;border:1px solid rgba(244,207,122,.55);background:rgba(244,207,122,.1);color:#fff3d6;font:13px var(--mg-cn)}
.l17Dex img{width:24px;height:24px}.l17Dex b{color:var(--x17-gold)}
.l17Tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:12px 0 10px;padding:3px;border-radius:12px;background:rgba(0,0,0,.25);border:1px solid rgba(244,207,122,.2)}
.l17Tabs button{padding:7px 0;border-radius:9px;border:0;background:transparent;color:#cfc2ea;font:13.5px var(--mg-cn)}
.l17Tabs button.on{background:linear-gradient(180deg,#ffe7a6,#e5b04e);color:#2a1606;box-shadow:0 2px 10px -3px rgba(244,207,122,.8)}
.l17Chs{display:grid;gap:8px;max-height:min(52vh,460px);overflow:auto;padding-right:2px}
.l17Ch{--tc:#f4cf7a;border-radius:12px;padding:8px 8px 9px;background:linear-gradient(100deg,color-mix(in srgb,var(--tc) 16%,transparent),rgba(255,255,255,.02) 60%);border:1px solid color-mix(in srgb,var(--tc) 45%,transparent)}
.l17Ch.lock{opacity:.5;filter:saturate(.4)}
.l17Ch header{display:flex;align-items:baseline;gap:8px;margin:0 2px 6px}.l17Ch header b{font:400 15px var(--mg-cn);color:#fff3d6}.l17Ch header small{color:#b9aed6;font-size:12px}
.l17Ls{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.l17Ls button{position:relative;display:grid;justify-items:center;gap:2px;padding:7px 4px 6px;border-radius:10px;border:1px solid rgba(244,207,122,.35);background:rgba(10,6,24,.45);color:#f2ead8}
.l17Ls button small{position:absolute;left:6px;top:4px;font:10px sans-serif;color:var(--tc)}
.l17Ls button b{font:400 13px var(--mg-cn);white-space:nowrap}
.l17Ls button:disabled{opacity:.55}
.l17Lock{width:16px;height:16px;opacity:.8}
.l17St{color:var(--x17-gold);letter-spacing:1px;font-size:12px}.l17St i{font-style:normal;color:rgba(255,255,255,.18)}
.l17Mode{display:flex;gap:12px;align-items:flex-start;margin:6px 0 10px}.l17Mode img{width:56px;height:56px;flex:none;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}
.l17Tags{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0}
.l17Tags span{padding:2px 9px;border-radius:999px;font-size:12px;background:rgba(126,240,216,.1);border:1px solid rgba(126,240,216,.4);color:#dffaf3}
.l17Seg{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
.l17Seg button{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:8px;align-items:center;text-align:left;padding:7px 9px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#f2ead8;font:14px var(--mg-cn)}
.l17Seg img{grid-row:1/3;width:34px;height:34px;object-fit:contain}.l17Seg small{color:#b9aed6;font-size:11px}
.l17Seg button.on{border-color:var(--x17-gold);background:rgba(244,207,122,.12);box-shadow:0 0 0 1px var(--x17-gold) inset}
.l17Boost{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:6px 0}
.l17Boost button{display:grid;justify-items:center;gap:1px;padding:7px 2px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#f2ead8}
.l17Boost img{width:30px;height:30px}.l17Boost b{font:400 12.5px var(--mg-cn)}.l17Boost small{color:var(--x17-gold);font-size:11px}
.l17Boost button.on{border-color:#7ef0d8;background:rgba(126,240,216,.12);box-shadow:0 0 12px -4px #7ef0d8}
.l17Boost button:disabled{opacity:.4}
.l17Res{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.l17Res span{padding:3px 9px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);font-size:12.5px;color:#d8cdee}.l17Res b{color:#fff3d6}
.p16Gain span.hot{border-color:#7ef0d8;background:rgba(126,240,216,.12)}
.endCard h3{font-size:30px}
.p16tile.x17day::after{content:"今日"!important;background:#ffd27a!important}
.l17tile small,.d17tile small{white-space:nowrap}

/* =============== 百味图谱 =============== */
.d17Head{display:flex;gap:12px;align-items:center}.d17Head>div{flex:1;min-width:0}
.d17Book{width:58px;height:58px;flex:none;filter:drop-shadow(0 6px 12px rgba(0,0,0,.5))}
.d17Ms{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:10px 0}
.d17M{display:grid;justify-items:center;gap:1px;padding:7px 2px 6px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);color:#cfc2ea}
.d17M img{width:28px;height:28px;filter:grayscale(.7) brightness(.8)}.d17M b{font:600 14px var(--mg-cn);color:#fff3d6}.d17M small{font-size:10px;line-height:1.25;text-align:center}
.d17M.can{border-color:var(--x17-gold);background:rgba(244,207,122,.12);animation:l17ready 1.1s ease-in-out infinite alternate}.d17M.can img,.d17M.done img{filter:none}
.d17M.done{opacity:.7}
.d17Tabs{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto;gap:6px;padding-bottom:2px;scrollbar-width:none}.d17Tabs::-webkit-scrollbar{display:none}.d17Tabs button{flex:none!important;min-width:44px;width:auto!important}.d17Tabs button[style]{border-color:color-mix(in srgb,var(--tc) 60%,transparent)!important}
.d17Grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;margin-top:10px}
.d17C{--tc:#f4cf7a;display:grid;justify-items:center;gap:2px;padding:8px 4px 7px;border-radius:14px;color:#f2ead8;
  background:radial-gradient(90% 70% at 50% 30%,rgba(255,250,236,.12),transparent 70%),linear-gradient(170deg,rgba(44,32,88,.72),rgba(18,12,40,.9));border:1px solid color-mix(in srgb,var(--tc) 40%,rgba(244,207,122,.2))}
.d17C img{width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 6px 8px rgba(0,0,0,.5))}
.d17C b{font:400 13.5px var(--mg-cn)}.d17C small{font-size:11px;color:var(--tc)}
.d17C.lock img{filter:brightness(0) drop-shadow(0 0 1px rgba(244,207,122,.6));opacity:.55}.d17C.lock b{color:#8f84ad}
.d17C:active{transform:scale(.96)}
.d17Sheet{position:fixed;inset:0;z-index:90;display:grid;place-items:end center;background:rgba(6,3,16,.6);animation:p16in .25s ease-out both}
.d17Sheet.out{animation:p16out .22s ease-in forwards}
.d17In{--tc:#f4cf7a;position:relative;width:min(440px,100%);max-height:92vh;overflow:auto;padding:12px 16px calc(16px + env(safe-area-inset-bottom,0px));border-radius:22px 22px 0 0;color:#f2ead8;
  background:linear-gradient(170deg,rgba(36,24,74,.98),rgba(14,9,32,.99)),var(--x17-cloth) center/220px;border:1px solid rgba(244,207,122,.55);border-bottom:0;box-shadow:0 -10px 40px -10px rgba(180,140,255,.5)}
.d17X{position:absolute;right:12px;top:12px;z-index:2}
.d17Stage{position:relative;height:clamp(200px,34vh,300px);margin:0 -6px;border-radius:16px;background:radial-gradient(70% 70% at 50% 60%,color-mix(in srgb,var(--tc) 30%,transparent),transparent 72%)}
.d17Stage canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:grab}
.d17Fb{position:absolute;left:50%;top:50%;width:180px;height:180px;transform:translate(-50%,-50%);object-fit:contain}
.d17In h3{margin:6px 0 2px;font:28px "MG16 Brush",var(--mg-cn);color:#fff3d6;text-shadow:0 0 14px rgba(244,207,122,.5)}
.d17T{margin-left:10px;padding:1px 8px;border-radius:999px;font:13px var(--mg-cn);vertical-align:middle;background:color-mix(in srgb,var(--tc) 25%,transparent);border:1px solid var(--tc);color:#fff}
.d17D{margin:4px 0 10px;color:#e6dcc8;line-height:1.7}
.d17R{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.d17R>b,.d17Tool b{font:400 14px var(--mg-cn);color:var(--x17-gold);margin-right:4px}
.d17I{display:inline-flex;align-items:center;gap:3px;padding:3px 8px 3px 4px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);font-size:13px}
.d17I img{width:24px;height:24px}.d17I small{color:#b9aed6;margin-right:2px}.d17I i{font-style:normal;color:#8f84ad;margin:0 2px}
.d17I.have{border-color:rgba(126,240,216,.6);background:rgba(126,240,216,.08)}
.d17Tool{margin:10px 0 2px;font-size:13.5px}
.d17Seen{opacity:1!important;filter:none!important;border-color:rgba(126,240,216,.45)!important}
.d17From{color:#7ef0d8!important}.d17P{margin-top:6px}

/* =============== 全局细节美化 =============== */
/* 食材图标：Fluent 3D 图标自带光影，去掉旧图标的描边底、加一层落影 */
.ic.x17ic{background-size:contain!important;background-repeat:no-repeat;background-position:center;filter:drop-shadow(0 3px 4px rgba(0,0,0,.45))}
/* 面板：极淡的锦缎底纹，让大片深色有织物感 */
html.mg16 .pnl{background-image:linear-gradient(160deg,rgba(34,24,70,.86),rgba(16,11,36,.92)),var(--x17-cloth)!important;background-size:auto,260px!important}
html.mg16 .pnl h3{position:relative}
/* 小节标题：两侧金线 + 菱形 */
html.mg16 .secHead h4{display:flex;align-items:center;gap:10px;font-family:var(--mg-cn);font-weight:400;letter-spacing:.08em;color:#fff3d6}
html.mg16 .secHead h4::before,html.mg16 .secHead h4::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(244,207,122,.6))}
html.mg16 .secHead h4::after{background:linear-gradient(90deg,rgba(244,207,122,.6),transparent)}
/* 卡片：顶部一道细高光，像上了釉 */
html.mg16 .grid .item{box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 8px 18px -12px rgba(0,0,0,.7)!important}
html.mg16 .grid .item b{font-family:var(--mg-cn);font-weight:400;letter-spacing:.04em}
/* 页面标题栏：标题下一道渐隐金线 */
html.mg16 #viewTitle{position:relative}
html.mg16 #viewTitle::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:linear-gradient(90deg,rgba(244,207,122,.7),transparent)}
/* 主菜单：新牌的插画背景压暗一点，字更清楚；图标飘起来 */
html.mg16 .mtile.pic.p16tile .tbg{opacity:.62;filter:saturate(1.05) brightness(.78)}
html.mg16 .mtile .p16ti{width:50px;height:50px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.55)) drop-shadow(0 0 8px rgba(255,220,140,.35))}
html.mg16 .mtile{overflow:hidden}
html.mg16 .mtile::before{content:"";position:absolute;inset:3px;border-radius:inherit;border:1px solid rgba(244,207,122,.16);pointer-events:none;z-index:1}
/* 进度条：头上一点亮光 */
html.mg16 .bar>i{position:relative}
html.mg16 .bar>i::after{content:"";position:absolute;right:0;top:-2px;bottom:-2px;width:6px;border-radius:6px;background:#fff;box-shadow:0 0 8px #fff,0 0 14px rgba(244,207,122,.9);opacity:.8}
/* 料理匣卡、预览图：菜图落影 */
html.mg16 .preview img,html.mg16 .swArt img,html.mg16 .dishCard img{filter:drop-shadow(0 6px 10px rgba(0,0,0,.5))}
@media (prefers-reduced-motion:reduce){.l17O,.l17Fev i,.l17Skill.full,.d17M.can,.d17Sheet{animation:none!important;transition:none!important}}

/* =============== 七味远征（素材扩展包 pack17） =============== */
.p16.e17{grid-template-rows:auto minmax(0,1fr) auto;background:#0d0a1e}
.e17Stage{position:relative;min-height:0}
.e17Cv{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.e17.menu .e17Stage{visibility:hidden}
.e17Log{position:absolute;left:10px;right:10px;top:6px;display:grid;gap:4px;pointer-events:none}
.e17L{justify-self:center;max-width:100%;padding:4px 12px;border-radius:999px;background:rgba(14,8,30,.78);border:1px solid rgba(244,207,122,.4);color:#fff3d6;font:13px var(--mg-cn);transition:opacity .6s}
.e17L.good{border-color:#7ef0d8}.e17L.bad{border-color:#ff7a4a}.e17L.old{opacity:.45}
.e17Bot{position:relative;z-index:2;padding:6px 10px calc(10px + env(safe-area-inset-bottom,0px))}
.e17Walk{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border-radius:14px;background:rgba(18,12,40,.88);border:1px solid rgba(244,207,122,.3);color:#cfc2ea;font-size:13px}
.e17Bt{background:linear-gradient(170deg,rgba(40,26,80,.96),rgba(16,10,34,.98));border-radius:6px;padding:4px 4px 6px}
.e17Mon{--tc:#ffd27a;display:flex;gap:10px;align-items:center;padding:2px 4px 8px}
.e17Mon img{width:54px;height:54px;object-fit:contain;border-radius:12px;background:radial-gradient(circle,color-mix(in srgb,var(--tc) 35%,transparent),transparent 70%)}
.e17Mon>div{flex:1;min-width:0}.e17Mon b{font:400 17px var(--mg-cn);color:#fff3d6}.e17Mon b i{font-style:normal;margin-left:6px;padding:0 6px;border-radius:6px;background:#ff6a3a;color:#fff;font-size:11px;vertical-align:middle}
.e17Mon small{display:block;color:var(--tc);font-size:12px;margin:1px 0 4px}
.e17Hp,.e17HpS{position:relative;height:12px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;border:1px solid rgba(255,255,255,.15)}
.e17Hp i,.e17HpS i{position:absolute;inset:0;transform-origin:0 50%;background:linear-gradient(90deg,#ff5a36,#ffb469);transition:transform .3s}
.e17Hp span{position:relative;display:block;text-align:center;font:10px/12px sans-serif;color:#fff;text-shadow:0 1px 1px #000}
.e17HpS{display:inline-flex!important;align-items:center;height:auto!important;padding:2px 9px!important;min-width:84px}.e17HpS i{background:linear-gradient(90deg,#3fbf7f,#9fe870);opacity:.55}
.e17Hand{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.e17Cd{--tc:#ffd27a;position:relative;display:grid;justify-items:center;gap:1px;padding:8px 2px 6px;border-radius:12px;border:1px solid color-mix(in srgb,var(--tc) 60%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--tc) 22%,rgba(20,12,40,.9)),rgba(14,9,30,.95));color:#fff3d6}
.e17Cd img{width:34px;height:34px;object-fit:contain;filter:drop-shadow(0 3px 4px rgba(0,0,0,.5))}
.e17Cd b{font:600 18px var(--mg-cn)}.e17Cd small{font-size:11px;color:#cfc2ea}
.e17Tn{position:absolute;left:6px;top:4px;font:700 13px var(--mg-cn);color:var(--tc)}
.e17Cd.good{box-shadow:0 0 0 2px #7ef0d8,0 0 16px -4px #7ef0d8}.e17Cd.good small{color:#7ef0d8}
.e17Cd.weak{opacity:.7}.e17Cd:active{transform:scale(.95)}
.e17Act{display:flex;gap:6px;justify-content:center;margin-top:8px}
.e17Card{max-width:400px}
.e17Head{display:flex;align-items:center;justify-content:space-between;gap:10px}.e17Head h3{margin:0}
.e17Cab{display:flex;align-items:center;gap:5px;padding:5px 10px 5px 6px;border-radius:999px;border:1px solid rgba(244,207,122,.55);background:rgba(244,207,122,.1);color:#fff3d6;font:13px var(--mg-cn)}.e17Cab img{width:24px;height:24px}.e17Cab b{color:var(--x17-gold)}
.e17Warn{padding:8px 10px;border-radius:10px;background:rgba(255,106,58,.12);border:1px solid rgba(255,106,58,.5);color:#ffd8c8;font-size:13px}
.e17Regs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0;max-height:min(54vh,470px);overflow:auto}
.e17Reg{--tc:#ffd27a;display:grid;align-content:end;justify-items:start;gap:1px;min-height:96px;padding:10px;border-radius:14px;border:1px solid color-mix(in srgb,var(--tc) 60%,transparent);background:#1a1236 center/cover;color:#fff3d6;text-align:left;box-shadow:inset 0 -40px 40px -20px rgba(0,0,0,.6)}
.e17Reg b{font:400 18px var(--mg-cn);text-shadow:0 2px 6px #000}.e17Reg small{font-size:11.5px;color:#e6dcf5;text-shadow:0 1px 3px #000}
.e17Reg:last-child:nth-child(odd){grid-column:1/-1}
.e17Shop{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}
.e17Shop button,.e17Dl button{display:grid;justify-items:center;gap:2px;padding:8px 4px;border-radius:12px;border:1px solid rgba(244,207,122,.35);background:rgba(255,255,255,.04);color:#f2ead8}
.e17Shop img{width:40px;height:40px}.e17Shop b{font:400 13px var(--mg-cn)}.e17Shop small{color:var(--x17-gold)}
.e17Dl{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:10px 0;max-height:46vh;overflow:auto}
.e17Dl button{--tc:#ffd27a;border-color:color-mix(in srgb,var(--tc) 55%,transparent)}.e17Dl img{width:56px;height:56px;object-fit:contain}.e17Dl small{color:var(--tc)}
.e17Rel{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}.e17Rel span{display:inline-flex;align-items:center;gap:4px;padding:3px 9px 3px 4px;border-radius:12px;background:rgba(126,240,216,.1);border:1px solid rgba(126,240,216,.45);font-size:13px}.e17Rel img{width:28px;height:28px;object-fit:contain}
.cabCard{max-height:calc(100% - 4px);overflow:auto}
.e17View{position:relative;height:200px;margin:8px 0;border-radius:14px;background:radial-gradient(70% 70% at 50% 60%,rgba(244,207,122,.22),transparent 72%),var(--x17-wood) center/200px;box-shadow:inset 0 0 0 1px rgba(244,207,122,.4),inset 0 0 40px rgba(0,0,0,.6)}
.e17View canvas{position:absolute;inset:0;width:100%;height:100%}.e17Vn{position:absolute;left:0;right:0;bottom:6px;margin:0;text-align:center;font:14px var(--mg-cn);color:#fff3d6;text-shadow:0 1px 3px #000}
.e17CabRow{--tc:#ffd27a;display:flex;align-items:center;gap:10px;margin:6px 0;padding:6px 8px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid color-mix(in srgb,var(--tc) 35%,transparent)}
.e17CabRow b{width:64px;flex:none;font:400 13px var(--mg-cn);color:var(--tc)}.e17CabRow>div{display:flex;gap:6px}
.e17CabRow button{width:52px;height:52px;padding:4px;border-radius:10px;border:1px solid rgba(244,207,122,.4);background:rgba(10,6,24,.5)}.e17CabRow img{width:100%;height:100%;object-fit:contain}
.e17CabRow button.lock img{filter:brightness(0);opacity:.45}
html.mg16 .mtile.e17tile{grid-column:1/-1;min-height:84px;justify-items:start;text-align:left;padding:12px 16px}
html.mg16 .mtile.e17tile .tbg{opacity:.85;filter:saturate(1.1) brightness(.72)}
html.mg16 .mtile.e17tile b{font-size:22px;letter-spacing:.2em;position:relative;z-index:2;text-shadow:0 2px 8px #000}
html.mg16 .mtile.e17tile small{position:relative;z-index:2;text-shadow:0 1px 4px #000}
.p16tile.e17tile::after{content:"新"!important}