/* 版型牆預覽視窗樣式（個人版／商業版共用）；色彩皆為品牌色票或其透明度衍生。 */
.sc-tp{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:24px}
.sc-tp[hidden]{display:none}
.sc-tp-lock,.sc-tp-lock body{overflow:hidden}
.sc-tp-scrim{position:absolute;inset:0;background:rgb(4 48 67 / 62%);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.sc-tp-box{position:relative;display:grid;grid-template-columns:240px minmax(0,360px);gap:56px;align-items:center;
  max-height:calc(100vh - 48px);overflow:auto;padding:48px 64px 48px 48px;border-radius:24px;background:#fff;
  box-shadow:0 30px 80px rgb(4 48 67 / 30%);font-family:var(--font-tc,inherit);color:#4A4A4A}
.sc-tp-img{display:block;width:240px;height:auto;aspect-ratio:465/1008;object-fit:cover;object-position:top;border-radius:20px;
  background:#EFF2F4;box-shadow:0 14px 36px rgb(6 68 95 / 18%)}
/* 右欄視覺層級：小標 → 大標 → 分隔線 → 說明 → 操作按鈕。 */
.sc-tp-eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:12px;line-height:1.6;font-weight:700;letter-spacing:.16em;color:#06445F}
.sc-tp-eyebrow::before{content:'';width:22px;height:2px;border-radius:2px;background:#3DC3FF}
.sc-tp-title{margin:0 0 22px;font-size:32px;line-height:1.3;font-weight:700;letter-spacing:.02em;color:#06445F}
.sc-tp-note{margin:0 0 40px;padding-top:22px;border-top:1px solid #E8EAEC;font-size:15px;line-height:1.9;color:#6C6C6C;text-wrap:pretty}
.sc-tp-actions{display:flex;flex-wrap:wrap;gap:14px}
.sc-tp-open,.sc-tp-cancel{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 24px;border-radius:999px;line-height:1.4;text-align:center;text-wrap:balance;
  font:inherit;font-size:15px;font-weight:700;text-decoration:none;cursor:pointer;transition:background .2s,color .2s}
.sc-tp-open{background:#06445F;color:#fff}
.sc-tp-open:hover{background:#043043}
.sc-tp-cancel{border:1.5px solid rgb(6 68 95 / 30%);background:#fff;color:#06445F}
.sc-tp-cancel:hover{background:#F5F6F6}
.sc-tp-close{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:50%;
  background:#F5F6F6;color:#06445F;cursor:pointer}
.sc-tp-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.sc-tp-close:hover{background:#E8EAEC}
.sc-tp :focus-visible{outline:3px solid #3DC3FF;outline-offset:3px}
@media (max-width:640px){
  .sc-tp{padding:16px}
  .sc-tp-box{grid-template-columns:minmax(0,1fr);justify-items:center;gap:24px;padding:32px 22px 26px;text-align:center}
  .sc-tp-eyebrow{justify-content:center}
  .sc-tp-img{width:min(170px,46vw)}
  .sc-tp-title{font-size:24px;margin-bottom:16px}
  .sc-tp-note{margin-bottom:26px;padding-top:16px;font-size:14px}
  .sc-tp-actions{justify-content:center;width:100%}
  .sc-tp-open,.sc-tp-cancel{flex:1 1 100%}
}