/* 夜空・薄金・硝子を、旅の画面に共通する装丁として使う。 */
.pn-box{border-color:#a5c3cd55;background:linear-gradient(150deg,#152638fa,#091222fc);box-shadow:0 30px 100px #000a,inset 0 1px 0 #dfe1c526;overflow:hidden}
.pn-head{position:relative;background:linear-gradient(105deg,#253e4844,#24314922);border-color:#b9cbd22e}
.pn-head::before{content:"";position:absolute;left:26px;right:26px;top:0;height:1px;background:linear-gradient(90deg,transparent,#e4d4a3,transparent);opacity:.65}
.pn-title{color:#ece7d8;letter-spacing:.12em}.pn-close{border:1px solid #99b9c433;background:#8dafb70a;color:#c4d6dc}
.pn-close:hover{border-color:#d9d1ab99;background:#d9d1ab16;color:#fff2d0}
.pn-body{scrollbar-color:#708f9a transparent}.pn-body :is(button,summary):focus-visible{outline:2px solid #f2dfa8;outline-offset:3px}
.au-banner{position:relative;isolation:isolate;overflow:hidden;padding:24px 26px;border:1px solid #a2c6cc44;border-radius:60px 12px 12px 12px;margin-bottom:20px;background:#0c1a2b}
.au-banner::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#061423e8,#071527bb 65%,#07152755),url('../assets/ui/star-grove.webp') center 48%/cover}
.au-banner::after{content:"✧";position:absolute;right:22px;top:13px;font:70px/1 var(--latin);color:#c5d4b344;z-index:-1}
.au-banner>small{display:block;font:10px/1.6 var(--latin);letter-spacing:.17em;color:#b8cfcc}.au-banner h3{font:24px/1.6 var(--mincho);margin:5px 0;color:#f2e7ce;letter-spacing:.07em}.au-banner p{font:12px/1.8 var(--mincho);color:#beced8}
#panel:has(.pt) .pn-box{width:min(880px,94vw)}
.pt-guide{font:11px/1.8 var(--gothic);color:#b9cbd6;margin:12px 0}.pt-guide summary{display:flex;justify-content:space-between;align-items:center;min-height:44px;cursor:pointer;border-bottom:1px solid #8dabb333;color:#d7dacc;font-family:var(--mincho)}
.pt>.pt-row{border:1px solid #8da6b444;background:linear-gradient(105deg,#36424855,#16233366);border-radius:10px;padding:12px 16px}
.pt #ptForge{margin:4px 0 18px}
.bond-garden{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:8px 0 22px}
.pt .bond-card{min-width:0;margin:0;padding:16px;border:1px solid color-mix(in srgb,var(--c) 35%,#25414e);border-radius:32px 10px 10px 10px;background:linear-gradient(150deg,color-mix(in srgb,var(--c) 8%,#142538),#0b1626);box-shadow:inset 0 1px 0 #cfdbc71a}
.pt .pt-row{grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:4px 0 10px}.pt .pt-name{min-width:0;display:flex;align-items:center;gap:10px}.pt .pt-name b{font:16px/1.5 var(--mincho);color:#ece5d1;letter-spacing:.06em}.pt .pt-art{width:38px;height:48px;object-fit:contain;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--c,#b9e2eb) 25%,transparent))}
.pt .pt-row>.pt-exp{grid-column:1/-1;height:3px}.pt .pt-row>span:nth-child(2){font:15px var(--latin);color:#c5d8db}
.pt .bond-info{display:flex;justify-content:space-between;gap:8px;font:10px/1.7 var(--gothic);color:#a8c0cd;padding:14px 0 7px}.pt .bond-info>b{font:16px var(--mincho);color:var(--c)}
.pt .bond-bar{height:4px;background:#5d819526}.pt .bond-bar i{background:linear-gradient(90deg,color-mix(in srgb,var(--c) 65%,#668fb5),#efe0ad)}
.pt .bond-card>.wp-note{font-size:10px;line-height:1.8;margin:12px 0;color:#acc4cf}
.pt .bond-route{margin:10px 0 0;padding:0;border:1px solid #a0bdc32e;border-radius:8px;background:#bdd5d505}
.pt .bond-route summary{cursor:pointer;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;min-height:48px;list-style:none;padding:10px 12px;font:13px/1.6 var(--mincho);color:#e3e4d2}
.pt .bond-route summary::-webkit-details-marker{display:none}.pt .bond-route summary small{font:9px/1.6 var(--gothic);color:#a8c1cc}.pt .bond-route summary i{margin-left:auto;font-style:normal;color:var(--c)}
.pt .bond-route[open] summary{border-bottom:1px solid #718b972e}.pt .bond-route>p{margin:12px;font:10px/1.8 var(--gothic);color:#acc3ce}
.bond-milestones{display:flex;justify-content:space-between;margin:8px 12px;padding:7px 0;border-block:1px solid #7d97aa22;font:13px var(--latin);color:#718da1}.bond-milestones .lit{color:#eaddac;text-shadow:0 0 7px #e4dca63b}
.pt .bond-skill{margin:10px 12px;padding:10px 0;border-bottom:1px solid #88a3ab20}.pt .bond-skill b{font:12px/1.7 var(--mincho);color:#93aabe}.pt .bond-skill.known b{color:#eadfbd}.pt .bond-skill small{font-size:9px;color:#9db4c6}.pt .bond-skill span{font:10px/1.8 var(--gothic);color:#aabfcd}
.bond-forge{display:flex;align-items:center;justify-content:space-between;gap:8px;width:calc(100% - 24px);min-height:44px;margin:8px 12px 12px;padding:8px 12px;border:1px solid #b9c8b64a;border-radius:6px;font:11px/1.6 var(--mincho);color:#e7dfb6;background:#c9d1b10a}
.pt-empty{grid-column:1/-1;padding:24px;text-align:center;border:1px dashed #8da7b344;border-radius:12px;font:13px var(--mincho);color:#b9ccd6}
.pt-uq span{padding:5px 11px;background:#0a142533}.pt-uq span.on{color:#f0e7c6;border-color:#c5cba38a;background:#d0cdac0c}
.equip .eq-stat{gap:18px;padding:18px;border:1px solid #8fbdc34a;background:radial-gradient(ellipse at 0 0,#528c8e22,transparent 70%),#12213280;border-radius:12px}
.equip .eq-stat>div{flex:1;min-width:0}.equip .eq-stat img{width:74px;height:74px;border-color:#d2cba680;box-shadow:0 0 0 4px #cadbd00a}
.equip .eq-name{color:#efe6cf}.equip .eq-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0}.equip .eq-nums span{display:flex;flex-direction:column;gap:4px;font:10px var(--gothic);color:#a8bfc9}.equip .eq-nums b{margin:0;font:24px/1 var(--latin);color:#eaf2e9}.equip .eq-sp{font:10px/1.8 var(--gothic);color:#d8dcb6}
.equip .eq-slot{margin:22px 0}.equip .eq-sh{font-size:14px;border-color:#9ab0b23c;padding-bottom:10px;margin-bottom:12px}.equip .eq-sh span{font-size:12px;color:#c7d7d8;max-width:70%;text-align:right}
.equip .eq-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.equip .eq-it{min-width:0;min-height:84px;padding:14px;gap:7px;border-color:#8dabb33b;border-radius:5px 18px 5px 18px;background:linear-gradient(150deg,#28404b40,#0b182680)}
.equip .eq-it b{font:14px/1.6 var(--mincho);color:#e9e8d8}.equip .eq-it small{font-size:10px;color:#aec2cc}.equip .eq-it em{font-size:10px;color:#b5c5cc;line-height:1.9;padding-top:7px;border-top:1px solid #acb4a321}
.equip .eq-it.on{border-color:#d9cf9a;background:linear-gradient(120deg,#acbb7520,#749aa316);box-shadow:inset 0 0 20px #d3deb810}.equip .eq-it.uq{border-color:#c5b17c7c}.equip .eq-it.uq b{color:#f0dfb0;background:none}
.eq-delta{display:flex;gap:6px 10px;flex-wrap:wrap;font:10px/1.7 var(--gothic);color:#a8bfcc}.eq-delta .up{color:#b4e4ce}.eq-delta .down{color:#efb9b4}.eq-delta.worn{color:#e8d5a1}
.equip .eq-off{min-height:44px}.equip .eq-items{padding:16px;background:#a1babd08;border:1px solid #829ba22e;border-radius:12px}.equip .eq-items>div:not(.sh-sec){display:flex;flex-wrap:wrap;gap:6px 10px;padding:10px 0;border-bottom:1px solid #8daab022}.equip .eq-items small{flex-basis:100%;line-height:1.8}
.shop .sh-gold{border:1px solid #d8cea54a;border-radius:8px;padding:12px 16px;background:linear-gradient(105deg,#c5b38313,#779da709);color:#c5d5d8;margin-bottom:20px}.shop .sh-gold>span{color:#e2d2a8;font-size:23px}.shop .sh-gold b{font-size:29px;color:#f2e5c4}.shop .sh-gold small{font-size:10px}
.shop .sh-sec{padding:10px 0;font-size:14px;margin-top:16px;border-color:#a3baba3b;color:#e5e3d1}.shop .sh-row{gap:12px;padding:14px 10px;border:1px solid #809da32b;border-radius:8px;background:#a9c7c305;margin:7px 0}
.shop .sh-tag{padding:4px 8px;border-radius:5px;color:#bad1d9;font-size:9px}.shop .sh-main b{font-size:14px;color:#e9e7d8}.shop .sh-main small{font-size:10px;line-height:1.8;color:#a5bdc9}.shop .sh-own{font-size:10px;color:#bdc9bd}
.shop .sh-buy{min-height:44px;border-radius:5px 13px 5px 13px;border-color:#ccceaa70;background:#c7d4b810;color:#f0e4bc}.shop .sh-buy:disabled{opacity:.6;border-color:#829ca13c;color:#b0c2cd;background:#7c96a307}
.shop #shForge{margin-top:12px}.shop #shEquip{font-family:var(--mincho);border-color:#a7bcc46b;background:#a0c8cf0d}
.quest-board .quest-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.quest-card{padding:16px;border-color:#95b4bd3b;background:linear-gradient(145deg,#3d486c2e,#12233077);border-radius:6px 24px 6px 24px;gap:8px;min-height:110px}.quest-card b{color:#eee5d3;font-size:15px}.quest-card em{font-size:11px;color:#d6ddb4}.quest-card small{font-size:10px;color:#aec3cc;line-height:1.8}.quest-card:hover{border-color:#d8ce9b8a;background:#a8c3bf13}
#wmPanel{border-color:#a3c2cb5c;background:linear-gradient(150deg,#173240ef,#0c192df5);box-shadow:0 18px 50px #0007,inset 0 1px 0 #d7dbb729}.wp-name{color:#f0e4ca}.wp-type{background:#9fc3c40b}.wp-difficulty button{border-radius:4px 12px 4px 12px;border-color:#aac4c334}.wp-difficulty button.on{border-color:#d7d0a494;background:#bcc6a417}.wp-unique{border-radius:5px 15px 5px 15px}.wp-acts .wb{border-radius:6px 15px 6px 15px}
.wm-btns button{background:#132536ad;border-color:#b4cbd14c;border-radius:5px 12px 5px 12px;transition:background .18s,border-color .18s}.wm-btns button:hover{background:#d3d6b11a;border-color:#d3d6b199}
.jn-heading{border-color:#c6d1b633}.jn-heading>small{color:#b4cbc2}.jn-tabs{background:#142335}.jn-tabs button{border-radius:5px 13px 5px 13px}.jn-tabs button[aria-selected=true]{background:#bfceae12;border-color:#d1c99f8a;color:#f0e5c5}.jn-spirit{border-radius:30px 8px 8px 8px}.jn-mark{background:#bdcfbb08;border-radius:5px 15px 5px 15px}.jn-mark.earned{background:linear-gradient(120deg,#c3b58017,#739aa60d);border-color:#c9c39480}
.mg-hero{border-color:#a2c5c74a;background:radial-gradient(ellipse at 90% 0,#968a6b22,transparent 70%),linear-gradient(115deg,#24455177,#22345155);border-radius:50px 12px 12px 12px}.mg-hero:after{color:#d4d8a72b}.mg-card{border-radius:5px 28px 5px 28px;border-color:#8db3bb44;background:linear-gradient(145deg,#92b8b810,transparent)}.mg-emblem{border-radius:50%;background:#bddad308}.mg-primary{background:linear-gradient(115deg,#c5e9df,#e3d9b5);border-color:#e4e5cc;color:#142f35}.mg-difficulties{border-radius:5px 13px 5px 13px}.mg-lantern-wrap{border-color:#9dbcbc44;background:radial-gradient(ellipse,#718f6540,#102537a0)}.mg-pad{border-radius:8px 28px 8px 28px}.mg-toolbar button{border-radius:5px 13px 5px 13px}
@media(max-width:600px){.au-banner{padding:20px 18px;border-radius:36px 10px 10px 10px}.au-banner h3{font-size:20px}.au-banner p{font-size:11px}.au-banner::after{font-size:55px;right:12px}.bond-garden,.equip .eq-list,.quest-board .quest-list{grid-template-columns:1fr}.pt .bond-card{padding:14px}.equip .eq-stat{padding:14px;gap:12px}.equip .eq-stat img{width:52px;height:52px}.equip .eq-name{font-size:15px}.equip .eq-nums{gap:6px}.equip .eq-nums b{font-size:21px}.equip .eq-slot{margin:18px 0}.shop .sh-row{grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;padding:12px}.shop .sh-main{grid-column:1;grid-row:1}.shop .sh-buy{grid-column:2;grid-row:1 / span 2;min-width:76px;font-size:17px}.shop .sh-own{display:block;grid-column:1;grid-row:2;font-size:10px}.shop .sh-tag{display:none}.shop .sh-gold{gap:6px 10px;padding:10px 12px}.shop .sh-gold small{flex-basis:100%}.au-banner>small{font-size:9px;letter-spacing:.12em}.jn-tabs{gap:4px}.jn-tabs button{font-size:11px}}
[data-motion=reduced] .wm-btns button{transition:none}
