.course-claim-dialog{width:min(440px,calc(100vw - 40px));box-sizing:border-box;padding:30px;border:1px solid #fff9;border-radius:28px;background:linear-gradient(135deg,#f7f4fc,#e8e7f2);color:#202940;box-shadow:0 20px 70px #13183060;font-family:var(--font-body),sans-serif}.course-claim-dialog::backdrop{background:#13172c99;}.course-claim-dialog h2{font-size:24px;line-height:1.3}.course-claim-dialog p{font-size:15px;line-height:1.8}.course-claim-dialog small{font-size:10px;letter-spacing:.16em}.course-claim-dialog .claim-close{position:absolute;top:10px;right:14px;background:none;border:0;color:#62657a;font-size:24px;padding:4px 10px;cursor:pointer}.claim-actions{display:flex;gap:10px;margin-top:24px}.claim-actions>*{border:1px solid #ffffff65;border-radius:99px;background:linear-gradient(150deg,#58607d,#252d48);box-shadow:inset 0 1px 2px #ffffff80,0 4px 0 #20243b;color:#fff;padding:12px 22px;text-decoration:none;font:inherit;font-size:14px;cursor:pointer;transition:transform .2s,box-shadow .2s}.claim-actions>*:hover{transform:translateY(-2px);box-shadow:inset 0 1px 2px #ffffff80,0 6px 14px #8976b35a}.claim-actions>*:disabled{opacity:.6;cursor:wait}.course-claim-dialog :focus-visible{outline:2px solid #8d65cb;outline-offset:4px}@media(prefers-reduced-motion:reduce){.claim-actions>*{transition:none}.claim-actions>*:hover{transform:none}}
.course-bookmark{border-radius:99px;border:1px solid #a697b9;background:#eee8f477;color:#514762;padding:10px 16px;cursor:pointer;font:inherit;font-size:12px;margin-top:8px}.course-bookmark:hover{background:#fff9;box-shadow:0 5px 16px #7c638b30;transform:translateY(-2px)}.course-bookmark[aria-pressed=true]{background:#665181;color:#fff}.course-bookmark:focus-visible{outline:2px solid #8a68b3;outline-offset:3px}
/* Price and personal collection share a compact baseline; keep the price intact. */
.course-price-row{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.course-price-row>.product__price,.course-price-row>.detail__price{margin-right:0}.course-price-row>.course-bookmark{display:inline-flex;align-items:center;justify-content:center;gap:5px;flex:0 0 auto;position:relative;min-height:26px;padding:4px 9px;margin:0;border:1px solid #62587645;background:#ffffff36;box-shadow:inset 0 1px #fff7;color:#514762;font-size:10px;line-height:1.1;white-space:nowrap;transition:background .2s,transform .2s}.course-price-row>.course-bookmark svg{flex-shrink:0}.course-price-row>.course-bookmark:hover{background:#ffffff8a;transform:translateY(-2px);box-shadow:0 3px 10px #51476218}.course-price-row>.course-bookmark[aria-pressed=true]{background:#554269;color:#fff;border-color:#77658a}.course-price-row>.course-bookmark:after{content:'';position:absolute;inset:-8px -2px}.course-price-row>.course-bookmark:disabled{opacity:.6}@media(prefers-reduced-motion:reduce){.course-price-row>.course-bookmark{transition:none}.course-price-row>.course-bookmark:hover{transform:none}}

/* Lubi reminder: frosted glass surface, centered action and no extra eyebrow. */
.course-claim-dialog{padding:24px 32px 32px;text-align:center;background:linear-gradient(135deg,#faf5ffe0,#e2ddf0ad);backdrop-filter:blur(28px) saturate(135%);-webkit-backdrop-filter:blur(28px) saturate(135%);border:1px solid #ffffffb3;box-shadow:inset 0 1px 0 #fff, inset 0 -1px 0 #ffffff55,0 24px 70px #1e193d45}.course-claim-dialog::backdrop{background:#171c3b55;}.course-claim-dialog .claim-lubi{display:block;width:112px;height:112px;object-fit:contain;margin:0 auto 6px;filter:drop-shadow(0 8px 7px #59416b24)}.course-claim-dialog h2{margin:4px 0 12px}.course-claim-dialog p{margin:0;color:#53516b}.course-claim-dialog .claim-actions{justify-content:center;flex-wrap:wrap;margin-top:24px}.course-claim-dialog .claim-close{min-width:36px;min-height:36px;line-height:1}.course-claim-dialog .claim-close:hover{color:#29213e;background:#ffffff40;border-radius:50%}@media(max-width:480px){.course-claim-dialog{padding:22px 24px 28px}.course-claim-dialog h2{font-size:22px}.course-claim-dialog p{font-size:14px}}
/* Lubi hangs from the right edge; foreground content stays unobstructed. */
.course-claim-dialog{overflow:visible;padding:42px 44px 36px;min-height:250px;width:min(440px,calc(100vw - 110px));margin-left:auto;margin-right:auto}.course-claim-dialog .claim-lubi{position:absolute;width:210px;height:315px;right:-155px;top:50%;transform:translateY(-50%);margin:0;pointer-events:none;filter:drop-shadow(0 7px 7px #59416b25)}.course-claim-dialog .claim-close{z-index:2}.course-claim-dialog .claim-actions>*{position:relative;isolation:isolate;overflow:visible;display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:40px;padding:8px 21px;border:1px solid #6d658580;border-radius:999px;color:#252d48;background:linear-gradient(150deg,#f4edfacc,#d2cbe1a8);box-shadow:inset 0 2px 2px #fff9,inset 0 -2px 2px #968bab22,0 3px 0 -1px #a096b5;transition:color .45s,box-shadow .5s,transform .5s}.course-claim-dialog .claim-actions>*:after{content:'↗';font-size:15px}.course-claim-dialog .claim-actions>*:before{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(155deg,#66607d,#252d48 70%);opacity:0;z-index:-1;transition:opacity .5s}.course-claim-dialog .claim-actions>*:hover,.course-claim-dialog .claim-actions>*:focus-visible{color:#fff;transform:translateY(-2px);box-shadow:inset 0 2px 2px #ffffff55,0 5px 0 -2px #343047,0 10px 22px #7f669b35}.course-claim-dialog .claim-actions>*:hover:before,.course-claim-dialog .claim-actions>*:focus-visible:before{opacity:1}
@media(max-width:600px){.course-claim-dialog{width:calc(100vw - 72px);padding:38px 26px 28px;margin-left:20px;margin-right:auto;min-height:240px}.course-claim-dialog .claim-lubi{width:125px;height:188px;right:-75px;top:12px;transform:none}.course-claim-dialog h2{padding-right:13px;font-size:21px}.course-claim-dialog .claim-close{right:8px;top:5px}.course-claim-dialog .claim-actions>*{font-size:13px}}
@media(prefers-reduced-motion:reduce){.course-claim-dialog .claim-actions>*,.course-claim-dialog .claim-actions>*:before{transition:none}.course-claim-dialog .claim-actions>*:hover{transform:none}}
@media(max-width:600px){.course-claim-dialog .claim-lubi{width:90px;height:135px;right:-52px;top:15px}}
/* Stronger translucent glass; close waits for its matching fade. */
.course-claim-dialog{background:linear-gradient(135deg,#ffffff66,#e9e0ff40 55%,#d5d9f652);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);box-shadow:inset 0 2px 1px #ffffffd9,inset 0 -1px 1px #ffffff70,0 22px 60px #211a4140;animation:claim-fade-in .25s ease-out both}.course-claim-dialog::backdrop{background:#22274140;animation:claim-backdrop-in .25s ease-out both}.course-claim-dialog.is-closing{animation:claim-fade-out .2s ease-in both;pointer-events:none}.course-claim-dialog.is-closing::backdrop{animation:claim-backdrop-out .2s ease-in both}.course-claim-dialog .claim-lubi{object-fit:contain;right:-155px;top:43%}@keyframes claim-fade-in{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}@keyframes claim-fade-out{from{opacity:1}to{opacity:0;translate:0 4px}}@keyframes claim-backdrop-in{from{opacity:0}to{opacity:1}}@keyframes claim-backdrop-out{from{opacity:1}to{opacity:0}}@media(max-width:600px){.course-claim-dialog .claim-lubi{right:-47px;top:15px}}@media(prefers-reduced-motion:reduce){.course-claim-dialog,.course-claim-dialog::backdrop{animation:none!important}}

/* Guide-frame contact line: x420/1248; align it exactly with dialog right edge. */
.course-claim-dialog .claim-lubi{width:315px;height:315px;right:-209px;top:43%}
@media(max-width:600px){.course-claim-dialog .claim-lubi{width:135px;height:135px;right:-90px;top:15px}}
@media(max-width:600px){.course-claim-dialog{width:calc(100vw - 110px);padding-left:20px;padding-right:20px}}

/* Decode the mascot before opening; one shared fade keeps the art and glass together. */
.course-claim-dialog{animation-duration:.65s}.course-claim-dialog::backdrop{animation-duration:.65s}.course-claim-dialog.is-closing,.course-claim-dialog.is-closing::backdrop{animation-duration:.2s}.course-claim-dialog .claim-lubi[hidden]{display:none}
/* Leave an intentional gap when the compact save capsule wraps below the price. */
.lesson-mini .course-price-row{margin-bottom:20px;row-gap:14px;align-items:center}
.lesson-mini .course-price-row>.product__price{flex:1 1 160px;min-width:0}
.lesson-mini .course-price-row>.course-bookmark{align-self:center}
