/* S49/S57: compact mobile scene above details; wide scene beside details. */
.reward-look-dialog{width:min(1000px,calc(100% - 40px));max-height:92dvh;padding:0;border:1px solid #9c8154;border-radius:20px;background:#123b2d;color:#f3ede0;box-shadow:0 24px 80px #0006;overflow:auto}
.reward-look-dialog::backdrop{background:#08271dbb}
.reward-look-content{padding:28px}.reward-look-content>header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;position:sticky;top:0;z-index:4;background:#123b2d;padding-top:8px}.reward-look-content>header button{margin:0;min-height:44px;flex:none}.reward-look-content h2{font:500 30px Georgia,serif;margin:10px 0 24px}.reward-look-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(220px,1fr);gap:32px}.reward-look-layout aside{border-left:1px solid #506551;padding-left:28px}.reward-look-layout aside h3{font:500 25px Georgia,serif;margin:6px 0 20px}.reward-look-layout aside p{font-size:15px;line-height:1.7}.reward-look-layout aside button{display:block;width:100%;margin-right:0}.reward-look-dialog :is(button,h2):focus-visible{outline:3px solid #e8c77a;outline-offset:3px}.plan-item [data-plan-preview]{margin:10px 0 0;font-size:12px;min-height:44px}
@media(max-width:767px){.reward-look-dialog{width:calc(100% - 20px);max-height:94dvh;margin:auto auto 0;border-radius:18px 18px 0 0}.reward-look-content{padding:20px 16px}.reward-look-content h2{font-size:25px}.reward-look-layout{grid-template-columns:minmax(0,1fr);gap:20px}.reward-look-layout aside{border-left:0;border-top:1px solid #506551;padding:20px 0 0}.reward-look-layout aside h3{font-size:22px}}
.commerce-preview-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(240px,1fr);gap:32px;align-items:start}
.commerce-preview-info{border-left:1px solid #506551;padding-left:28px}
.commerce-preview-info h3{font:500 30px Georgia,serif;margin:6px 0 20px}
.commerce-preview-info .shop-price{font-size:25px}.commerce-preview-info p{line-height:1.65}
.commerce-preview-info a{display:block;margin-top:16px}.commerce-preview-info button{display:block;width:100%;margin-right:0}
.look-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}.look-tabs button{margin:0;background:transparent;color:#e9d6a9}.look-tabs button[aria-pressed=true]{background:#e8c77a;color:#153528}
.look-scene{height:365px;position:relative;isolation:isolate;overflow:hidden;border:1px solid #9c8154;border-radius:20px;background:radial-gradient(ellipse at 50% 40%,#24513d,#0a2a20);box-shadow:inset 0 0 0 9px #0a241a,inset 0 0 0 10px #a48a5066}
.look-table{position:absolute;inset:0;z-index:-1;opacity:.85}.look-watermark{position:absolute;top:44%;width:100%;text-align:center;font:18px Georgia,serif;letter-spacing:.4em;color:#edce8e66}
.look-scene .cosmetic-art{padding:0;min-height:0;background:transparent;border-radius:0;height:100%;width:100%;font-size:11px}.look-scene .cosmetic-art img{height:100%;width:100%;max-height:none;object-fit:contain}.look-table .cosmetic-art img{object-fit:cover}
.look-player{position:absolute;width:94px;height:94px;top:20px;left:calc(50% - 47px)}.look-player>.cosmetic-art{position:absolute;inset:0}.look-avatar{position:absolute;inset:22%;border-radius:50%;background:#e9dcc0;display:grid;place-items:center;color:#173b2a;font:35px Georgia,serif}
.look-hand{position:absolute;bottom:22px;left:50%;width:60%;max-width:276px;aspect-ratio:1.944;transform:translateX(-50%)}.look-card{position:absolute;left:calc(var(--card)*15.6%);top:var(--lift);width:34%;aspect-ratio:5/7;transform:rotate(calc((var(--card) - 2)*9deg));transform-origin:center 160%}.look-card>span{display:block;width:100%;height:100%;filter:drop-shadow(0 4px 3px #0007)}
.look-deck{position:absolute;right:10%;top:32%;width:47px;height:66px;transform:rotate(12deg);box-shadow:2px 3px #dbcdad,4px 6px #163729}
.look-default{display:block;width:100%;height:100%}.look-default-card_back{border:3px solid #eadcba;border-radius:7px;box-sizing:border-box;display:grid;place-items:center;background:repeating-linear-gradient(45deg,#143d30 0 3px,#244f3e 3px 5px);color:#e1c487;font:30px Georgia,serif}.look-default-avatar_frame{border:3px solid #c8aa67;border-radius:50%;position:absolute;inset:7%;width:86%;height:86%;box-sizing:border-box}
.look-pieces{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:24px 0}.look-pieces>div{border-top:1px solid #617054;padding-top:12px;min-width:0}.look-pieces .look-candidate{border-color:#e8c77a}.look-pieces dt{font-size:12px;color:#bdc9b8}.look-pieces dd{margin:8px 0 0;font-size:15px;overflow-wrap:anywhere}.look-pieces small{display:block;font-size:11px;color:#c4d0be;margin-top:7px}.look-pieces .look-candidate small{color:#e8c77a}
.look-controls{display:flex;flex-wrap:wrap;gap:8px}.look-controls button{margin:0}.look-read-note,.look-motion-note{font-size:12px!important;line-height:1.6;color:#ccd3bf}.look-motion-note{min-height:3em}.look-tabs button:focus-visible,.look-controls button:focus-visible{outline:3px solid #e8c77a;outline-offset:3px}
.cosmetic-preview [data-look-mount]{max-width:850px;margin:auto}.cosmetic-preview .look-scene .cosmetic-art{max-width:none;margin:0}.cosmetic-preview .look-scene .cosmetic-art img{height:100%;max-height:none}
@media(max-width:767px){.commerce-preview-layout{grid-template-columns:minmax(0,1fr);gap:24px}.commerce-preview-info{border-left:0;border-top:1px solid #506551;padding:22px 0 0}.commerce-preview-info h3{font-size:25px}.look-scene{height:300px;border-radius:14px}.look-player{width:76px;height:76px;left:calc(50% - 38px);top:14px}.look-hand{bottom:20px}.look-deck{right:9%;top:34%;width:36px;height:50px}.look-tabs button,.look-controls button{font-size:12px;padding:11px 12px;min-height:44px}.look-pieces{gap:9px}.look-pieces dt{font-size:11px}.look-pieces dd{font-size:13px}}