/* 10-25 生肖星座本命面板（js/destiny-panel.js）：全螢幕、橫式一頁放得下不捲動；淺色卡片 */
html body dialog.destiny-panel{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:0;border:0;overflow:hidden;background:radial-gradient(ellipse at 50% 20%,#2b3f73,#101a33 70%)!important;color:#21334b!important}
html body dialog.destiny-panel::backdrop{background:#000a}
.destiny-shell{display:grid;grid-template-rows:auto auto auto 1fr;gap:8px;height:100%;padding:10px 14px;box-sizing:border-box}
.destiny-head{display:flex;align-items:center;gap:12px}
.destiny-head h2{margin:0;color:#ffe08a!important;font-size:20px;white-space:nowrap}
.destiny-head nav{display:flex;gap:6px;flex:1}
html body dialog.destiny-panel button{font:inherit;cursor:pointer}
html body dialog.destiny-panel .destiny-head nav button{min-height:34px;padding:4px 16px;border:1px solid #c9a14a!important;border-radius:10px;background:#1b2846!important;color:#f4efe2!important;font-weight:800}
html body dialog.destiny-panel .destiny-head nav button[aria-selected="true"]{background:linear-gradient(#fff3bd,#f4c44f)!important;color:#3a2a08!important}
html body dialog.destiny-panel .destiny-close{width:36px;height:36px;border:1px solid #c9a14a!important;border-radius:50%;background:#1b2846!important;color:#fff!important}
.destiny-bar{display:flex;align-items:stretch;gap:8px}
html body dialog.destiny-panel .destiny-src{display:grid;gap:1px;padding:5px 12px;border:1px solid #c9a14a!important;border-radius:10px;background:#fffaf0!important;color:#3a2a08!important;text-align:left}
html body dialog.destiny-panel .destiny-src:disabled{opacity:.5}
.destiny-src small{font-size:11px;opacity:.8}
.destiny-tip{align-self:center;font-size:12px;color:#d9e2f5!important}
.destiny-note{margin:0;padding:4px 10px;border-radius:8px;background:#fff3c4;color:#5a3d00!important;font-weight:700}
.destiny-main{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,32%);gap:12px;min-height:0}
.destiny-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:8px;min-height:0}
html body dialog.destiny-panel .destiny-slot{position:relative;display:grid;justify-items:center;align-content:center;gap:2px;min-height:0;padding:6px;border:2px solid #3d5287!important;border-radius:14px;background:#fffaf0!important;color:#21334b!important}
html body dialog.destiny-panel .destiny-slot.is-picked{border-color:#f2b51d!important;box-shadow:0 0 0 2px #ffe08a,0 0 14px #f2b51d88}
html body dialog.destiny-panel .destiny-slot.is-birth{background:linear-gradient(#fff6d6,#ffe9a8)!important}
.destiny-slot img{width:min(72px,11vh);height:min(72px,11vh);object-fit:contain}
.destiny-slot b{font-size:15px}
.destiny-slot small{font-size:11px;opacity:.8}
.destiny-shards{font-size:11px;color:#7a4f00!important;font-weight:800}
.destiny-birth{position:absolute;top:4px;left:4px;padding:1px 6px;border-radius:8px;background:#e5383b;color:#fff!important;font-size:11px;font-style:normal;font-weight:800}
.destiny-detail{display:grid;align-content:start;gap:8px;min-height:0;padding:12px;border:1px solid #c9a14a;border-radius:14px;background:#fffaf0;color:#21334b}
.destiny-detail header{display:flex;align-items:center;gap:10px}
.destiny-detail header img{width:64px;height:64px;object-fit:contain}
.destiny-detail h3{margin:0;font-size:20px}
.destiny-detail h3 em{font-size:12px;font-style:normal;color:#e5383b}
.destiny-detail p{margin:0}
.destiny-now{font-weight:800}
.destiny-soon{font-size:12px;color:#8a5a00!important}
.destiny-cost{font-size:13px}
.destiny-actions{display:flex;flex-wrap:wrap;gap:6px}
.destiny-actions .btn{flex:1 1 45%;min-height:34px}
@media (max-height:450px){.destiny-shell{gap:5px;padding:6px 10px}.destiny-head h2{font-size:16px}.destiny-slot b{font-size:13px}.destiny-detail{padding:8px;gap:5px}.destiny-detail header img{width:44px;height:44px}.destiny-src{padding:3px 8px}}
@media (orientation:portrait){.destiny-main{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}.destiny-grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr))}}
/* 10-25 角色家族左欄：角色／天賦／本命改彩色圖示 */
.v4-system-rail i img.rail-art{display:block;width:32px;height:32px;object-fit:contain;margin:0 auto}
/* 本命面板上方碎片按鈕的碎片圖 */
.destiny-src img{width:22px;height:22px;object-fit:contain;vertical-align:middle;margin-right:4px}

/* 10-25 角色頁按鈕列的天賦／生肖星座彩色圖示 */
html body .character-live-links button:has(.link-art){display:inline-flex;align-items:center;gap:6px}
html body .character-live-links .link-art{width:26px;height:26px;object-fit:contain;flex:none}
/* 10-25 快捷列「角色」選單：天賦／生肖／星座三顆，浮在下排快捷列右上方 */
html body .qb-char-menu{position:fixed;right:max(16px,8vw);bottom:calc(var(--qb-h,110px) + 18px);z-index:900;display:flex;gap:10px;padding:10px;border:1px solid #d8b45a;border-radius:18px;background:#fffaf0f2;box-shadow:0 10px 28px #0005}
html body .qb-char-menu[hidden]{display:none}
html body .qb-char-menu button{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:84px;padding:8px 10px;border:1px solid #e3cf9b;border-radius:14px;background:#fff;color:#3a2a08;font:inherit;font-weight:800;cursor:pointer}
html body .qb-char-menu button:hover{background:#fff3cc;border-color:#c9a14a}
html body .qb-char-menu img{width:56px;height:56px;object-fit:contain}

/* 本命視窗：讓標題、分頁與操作各有清楚的位置，避免淺金字落在淺底上。 */
html body dialog.destiny-panel.destiny-panel{background:#f3f6f9!important;color:#23364e!important}
html body dialog.destiny-panel .destiny-shell{gap:10px;padding:10px 14px 14px}
html body dialog.destiny-panel .destiny-head{position:relative;display:flex;flex-wrap:nowrap;align-items:center;gap:14px;min-height:52px;padding:7px 10px 7px 18px;border:1px solid #263f63;border-radius:16px;background:#172c4b!important;box-shadow:0 5px 16px #15284126;box-sizing:border-box}
html body dialog.destiny-panel .destiny-head h2{position:static;flex:0 0 auto;max-width:none;margin:0;color:#fff2cc!important;font-size:20px;line-height:1.25;letter-spacing:.02em;text-shadow:none;white-space:nowrap}
html body dialog.destiny-panel .destiny-head nav{position:static;display:flex;flex:1 1 auto;align-items:center;gap:8px;min-width:0;margin:0}
html body dialog.destiny-panel .destiny-head nav button{min-height:38px;padding:6px 16px;border-color:#667d9f!important;background:#273f63!important;color:#f9fbff!important;box-shadow:none}
html body dialog.destiny-panel .destiny-head nav button[aria-selected="true"]{border-color:#e0ae44!important;background:#ffe2a2!important;color:#332b1d!important}
html body dialog.destiny-panel .destiny-close{position:static;flex:0 0 38px;width:38px;height:38px;margin-left:auto;border-color:#7185a4!important;background:#263f63!important;color:#fff!important}
html body dialog.destiny-panel .destiny-tip{color:#405979!important;font-weight:700}
html body dialog.destiny-panel .destiny-src{border-color:#c8d4e0!important;background:#fff!important;color:#263952!important}
html body dialog.destiny-panel .destiny-src:disabled{opacity:1;background:#eef2f6!important;color:#566a81!important}
html body dialog.destiny-panel .destiny-slot{border-color:#d4dee8!important;background:#fff!important;box-shadow:0 2px 8px #213a5714}
html body dialog.destiny-panel .destiny-detail{border-color:#dfb24e;background:#fffaf0}
html body dialog.destiny-panel :is(.destiny-head nav button,.destiny-close,.destiny-src,.destiny-slot):focus-visible{outline:3px solid #e49c20;outline-offset:2px}
@media (max-width:700px){html body dialog.destiny-panel .destiny-head{display:grid;grid-template-columns:minmax(0,1fr) 38px;gap:6px 8px;padding:8px 10px}html body dialog.destiny-panel .destiny-head h2{grid-column:1;font-size:17px;white-space:normal}html body dialog.destiny-panel .destiny-head nav{grid-column:1/-1;grid-row:2;width:100%}html body dialog.destiny-panel .destiny-head nav button{flex:1 1 0;padding:5px 8px}html body dialog.destiny-panel .destiny-close{grid-column:2;grid-row:1;margin:0}}