/* Approved two-step rating: one stable panel, one visible star row. */
body.portal-board[data-portal="med-spa"] .rating-panel{display:block;height:auto;min-height:64px;width:100%;box-sizing:border-box}
.rating-panel .rating-panel-inner{min-height:64px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px}
.rating-panel .rating-question{font-family:'JetBrains Mono',monospace;font-size:9px;line-height:1.2;letter-spacing:.14em;text-transform:uppercase;color:var(--portal-copper,#B9875B)}
.rating-panel .rating-stars{display:flex;justify-content:flex-start;gap:2px;width:max-content;max-width:100%}
.rating-panel .rating-star{font:20px/1 system-ui;width:auto;min-width:0;flex:none;height:auto;padding:1px 2px;border:0;background:transparent;color:#48443e;cursor:pointer;transition:color .16s,transform .16s}
.rating-panel .rating-star.is-selected{color:#D8AF86}
.rating-panel .rating-star:disabled{cursor:default;opacity:1}
.rating-panel .rating-star:focus-visible,.rating-panel .rating-change:focus-visible{outline:2px solid #78d2de;outline-offset:3px}
.rating-panel .rating-feedback,.rating-panel .rating-summary{font:11px/1.6 'JetBrains Mono',monospace;color:#78d2de;letter-spacing:0;text-transform:none}
.rating-panel .rating-summary{display:flex;flex-wrap:wrap;gap:0 6px}
.rating-panel .rating-change{font:11px/1.6 'JetBrains Mono',monospace;color:#78d2de;background:transparent;border:0;border-bottom:1px solid currentColor;padding:0;cursor:pointer;text-transform:none;letter-spacing:0}
.rating-arrive{animation:rating-panel-in .24s ease-out}
.rating-confirm .rating-stars{animation:rating-panel-confirm .28s ease-out}
@keyframes rating-panel-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes rating-panel-confirm{50%{transform:scale(1.04);transform-origin:left center}}
@media(prefers-reduced-motion:reduce){.rating-arrive,.rating-confirm .rating-stars{animation:none}.rating-panel .rating-star{transition:none}}

/* Compact corner rating; content keeps the breathing room above the footer. */
body.portal-board[data-portal="med-spa"] .script-preview-card .acts{flex-wrap:nowrap;align-items:flex-end;gap:10px;margin-top:24px;padding-top:16px}
body.portal-board[data-portal="med-spa"] .script-preview-card .card-rating.rating-panel{width:auto;min-width:0;min-height:0;flex:1 1 auto}
.script-preview-card .rating-panel .rating-panel-inner{min-height:0;justify-content:flex-end;gap:3px}
.script-preview-card .rating-panel .rating-star{font-size:18px;padding:1px}
.script-preview-card .rating-panel .rating-feedback{font-size:9px}
body.portal-board[data-portal="med-spa"] .script-preview-card .openhint{flex:none;font-size:8px;white-space:nowrap}
@media(max-width:600px){
 body.portal-board[data-portal="med-spa"] .script-preview-card .card-section+.card-section{margin-top:20px;padding-top:19px}
}

/* Isolated card concept: hook, excerpt, compact footer. */
body.portal-board[data-portal="med-spa"] .script-preview-card .card-script-excerpt .script-preview{font-size:14px;line-height:1.65;-webkit-line-clamp:2;color:#B4AEA7}
body.portal-board[data-portal="med-spa"] .script-preview-card .card-script-excerpt{margin-top:22px;padding-top:20px}
body.portal-board[data-portal="med-spa"] .script-preview-card .acts{margin-top:24px}

body.portal-board[data-portal="med-spa"] .script-preview-card .card-angle .script-preview{font-size:14px;line-height:1.6;color:#D6D1C9;-webkit-line-clamp:3}

/* Preview-only typography balance. */
body.portal-board[data-portal="med-spa"] .script-preview-card .card-angle .script-preview,
body.portal-board[data-portal="med-spa"] .script-preview-card .card-script-excerpt .script-preview{font-size:16px;line-height:1.5}
body.portal-board[data-portal="med-spa"] .script-preview-card .card-section+.card-section{margin-top:15px;padding-top:13px}
body.portal-board[data-portal="med-spa"] .script-preview-card .acts{padding-top:22px}
@media(max-width:600px){
 body.portal-board[data-portal="med-spa"] .script-preview-card .topic{font-size:clamp(22px,7.18vw,28px);letter-spacing:-.025em}
}

/* Three compact information sections in the isolated preview. */
body.portal-board[data-portal="med-spa"] .script-preview-card .card-angle .script-preview,
body.portal-board[data-portal="med-spa"] .script-preview-card .card-script-excerpt .script-preview,
body.portal-board[data-portal="med-spa"] .script-preview-card .card-onscreen .script-preview{font-size:14px;line-height:1.5}

/* Smaller white information text and clearer section dividers. */
body.portal-board[data-portal="med-spa"] .script-preview-card .card-angle .script-preview,
body.portal-board[data-portal="med-spa"] .script-preview-card .card-script-excerpt .script-preview,
body.portal-board[data-portal="med-spa"] .script-preview-card .card-onscreen .script-preview{font-size:13px;color:#fff}
body.portal-board[data-portal="med-spa"] .script-preview-card .card-section+.card-section,
body.portal-board[data-portal="med-spa"] .script-preview-card .acts{border-top-color:rgba(185,135,91,.25)}

/* Raise the final divider without shifting the rating controls. */
body.portal-board[data-portal="med-spa"] .script-preview-card .acts{margin-top:16px;padding-top:30px}

/* Smaller information text with dividers closer to each section. */
body.portal-board[data-portal="med-spa"] .script-preview-card .card-angle .script-preview,
body.portal-board[data-portal="med-spa"] .script-preview-card .card-script-excerpt .script-preview,
body.portal-board[data-portal="med-spa"] .script-preview-card .card-onscreen .script-preview{font-size:12px}
body.portal-board[data-portal="med-spa"] .script-preview-card .card-section+.card-section{margin-top:10px;padding-top:10px}
body.portal-board[data-portal="med-spa"] .script-preview-card .acts{margin-top:10px}

/* Smaller complete card rating block. */
.script-preview-card .rating-panel .rating-panel-inner{gap:4px}
.script-preview-card .rating-panel .rating-question{font-size:8px}
.script-preview-card .rating-panel .rating-stars{gap:1px}
.script-preview-card .rating-panel .rating-star{font-size:18px;line-height:15px;padding:1px}
.script-preview-card .rating-panel .rating-feedback,
.script-preview-card .rating-panel .rating-summary,
.script-preview-card .rating-panel .rating-change{font-size:8px}

/* Set the compact rating slightly deeper into the lower-left corner. */
body.portal-board[data-portal="med-spa"] .script-preview-card .card-rating.rating-panel{position:relative;top:6px;left:-4px}

/* Full-script rating remains visible while the reader content scrolls. */
body.portal-board[data-portal="med-spa"] .reader-rating-dock{flex:0 0 auto;width:100%;box-sizing:border-box}
body.portal-board[data-portal="med-spa"] .reader-rating-dock .reader-rate{max-width:746px;margin:0 auto}

/* Compact pinned reader bar: question/stars left, progress right. */
body.portal-board[data-portal="med-spa"] .reader-rating-dock .reader-rate{min-height:0}
.reader-rating-dock .rating-panel-inner{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:center;gap:3px 12px}
.reader-rating-dock .rating-question{grid-column:1 / -1;grid-row:1;font-size:9px}
.reader-rating-dock .rating-stars{grid-column:1;grid-row:2}
.reader-rating-dock .rating-feedback{grid-column:2;grid-row:2;text-align:right;font-size:10px;white-space:nowrap}
.reader-rating-dock .rating-summary{grid-column:1;grid-row:2;font-size:9px}
.reader-rating-dock .rating-change{grid-column:2;grid-row:2;font-size:9px;justify-self:end}

/* Reader-only width and original paragraph structure. */
body.portal-board[data-portal="med-spa"] .reader-script-para > p{margin:0 0 16px;font:inherit;color:inherit}
body.portal-board[data-portal="med-spa"] .reader-script-para > p:last-child{margin-bottom:0}
@media(max-width:600px){
 body.portal-board[data-portal="med-spa"] .reader-script-card{margin-left:-8px;margin-right:-8px;padding-left:16px;padding-right:16px}
}

/* Single larger reader headline; remove redundant space above it. */
body.portal-board[data-portal="med-spa"] .reader-head{margin-top:0}
body.portal-board[data-portal="med-spa"] .reader-head .reader-hook-title{font-size:clamp(36px,9.2vw,64px);line-height:1.06}

/* Tighter reader metadata and the existing ring artwork in the upper right. */
body.portal-board[data-portal="med-spa"] .reader-head{position:relative;isolation:isolate;overflow:visible;padding-bottom:8px}
body.portal-board[data-portal="med-spa"] .reader-head .reader-hook-title{margin-bottom:24px}
body.portal-board[data-portal="med-spa"] .reader-head .reader-id{gap:5px}
body.portal-board[data-portal="med-spa"] .reader-head .reader-id .reader-field-label,
body.portal-board[data-portal="med-spa"] .reader-head .reader-id .rmeta,
body.portal-board[data-portal="med-spa"] .reader-head .reader-id-dot{font-size:9px;line-height:1.3}
/* Match opening dashboard artwork geometry: 400px, same viewport origin. */
body.portal-board[data-portal="med-spa"] .rin{position:relative;isolation:isolate}
.reader-ring-clip > .reader-ring-art{position:absolute;z-index:-1;pointer-events:none;width:400px;height:400px;right:calc((100% - min(100%,780px))/2 - 246px);top:-15.125px;--ring-rest:rgb(185 135 91 / .2204496)}

/* Contain decorative overflow without changing ring geometry or vertical scrolling. */
body.portal-board[data-portal="med-spa"] .rin{overflow-x:hidden}
.reader-ring-clip{position:absolute;inset:0 0 auto;height:400px;overflow:hidden;pointer-events:none;z-index:-1}
body.portal-board[data-portal="med-spa"] .reader .kit,
body.portal-board[data-portal="med-spa"] .reader .rbody{background:linear-gradient(180deg,rgba(27,28,28,.384) 0%,rgba(16,18,18,.408) 58%,rgba(10,12,12,.43) 100%);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}

/* One frame treatment for opening cards and full-script panels. */
body.portal-board[data-portal="med-spa"] .script-preview-card,
body.portal-board[data-portal="med-spa"] .reader .kit{
 --portal-frame:rgba(185,135,91,.78);
 position:relative;border:2px solid var(--portal-frame);border-radius:14px;
 clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%);
 background:linear-gradient(180deg,rgba(27,28,28,.384) 0%,rgba(16,18,18,.408) 58%,rgba(10,12,12,.432) 100%);
 box-shadow:0 24px 60px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.035);
 backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)
}
/* The cut clips half the diagonal stroke, so use 4px to match the 2px frame. */
body.portal-board[data-portal="med-spa"] .script-preview-card::after,
body.portal-board[data-portal="med-spa"] .reader .kit::after{
 content:"";position:absolute;width:34px;height:4px;right:-5px;top:11px;
 background:var(--portal-frame);transform:rotate(45deg);pointer-events:none
}

/* Reader panels use the opening card's phone gutters and interior spacing. */
@media(max-width:560px){
 body.portal-board[data-portal="med-spa"] .reader .kit{margin-left:-3.5px;margin-right:-3.5px;padding:20px 18px 18px}
}
body.portal-board[data-portal="med-spa"] .reader-script-card .reader-hook-line,
body.portal-board[data-portal="med-spa"] .reader-script-card .reader-script-para{margin-bottom:10px}
body.portal-board[data-portal="med-spa"] .reader-script-card .reader-script-label,
body.portal-board[data-portal="med-spa"] .reader-script-card .reader-script-para + .reader-script-tools{margin-top:0;padding-top:10px;border-top:1px solid rgba(185,135,91,.25)}

/* Full reader uses the same card sections and typography as This Week.
   Only the full text's truncation is disabled. */
body.portal-board[data-portal="med-spa"] .reader-script-card .reader-hook-line{margin:0;padding:0;border:0}
body.portal-board[data-portal="med-spa"] .reader-script-card .reader-script-label{margin:0 0 6px;padding:4px 0 0;border:0}
body.portal-board[data-portal="med-spa"] .reader-script-card .reader-script-para{margin:0;display:block;overflow:visible;-webkit-line-clamp:unset}
body.portal-board[data-portal="med-spa"] .reader-script-card .reader-cta-line{display:block;overflow:visible;-webkit-line-clamp:unset}
body.portal-board[data-portal="med-spa"] .reader-script-card .reader-script-tools{margin-bottom:6px}
body.portal-board[data-portal="med-spa"] .reader-script-card .card-topic-head{margin-bottom:8px}
body.portal-board[data-portal="med-spa"] .reader-script-card .reader-script-actions{margin-top:18px}

body.portal-board[data-portal="med-spa"] .reader-script-card .reader-hook-line{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;line-height:1.03;color:rgb(241,234,226)}
body.portal-board[data-portal="med-spa"] .reader-script-card .card-topic-label{font-size:12px;line-height:1.55;font-weight:500;letter-spacing:.18em}

/* Opening-page restoration from the saved screenshot-era card styling. */
/* Compact corner rating; content keeps the breathing room above the footer. */
body.portal-board[data-portal="med-spa"] #app .script-preview-card .acts{flex-wrap:nowrap;align-items:flex-end;gap:10px;margin-top:24px;padding-top:16px}
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-rating.rating-panel{width:auto;min-width:0;min-height:0;flex:1 1 auto}
#app .script-preview-card .rating-panel .rating-panel-inner{min-height:0;justify-content:flex-end;gap:3px}
#app .script-preview-card .rating-panel .rating-star{font-size:18px;padding:1px}
#app .script-preview-card .rating-panel .rating-feedback{font-size:9px}
body.portal-board[data-portal="med-spa"] #app .script-preview-card .openhint{flex:none;font-size:8px;white-space:nowrap}
@media(max-width:600px){
 body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-section+.card-section{margin-top:20px;padding-top:19px}
}

/* Isolated card concept: hook, excerpt, compact footer. */
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-script-excerpt .script-preview{font-size:14px;line-height:1.65;-webkit-line-clamp:2;color:#B4AEA7}
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-script-excerpt{margin-top:22px;padding-top:20px}
body.portal-board[data-portal="med-spa"] #app .script-preview-card .acts{margin-top:24px}

body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-angle .script-preview{font-size:14px;line-height:1.6;color:#D6D1C9;-webkit-line-clamp:3}

/* Preview-only typography balance. */
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-angle .script-preview,
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-script-excerpt .script-preview{font-size:16px;line-height:1.5}
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-section+.card-section{margin-top:15px;padding-top:13px}
body.portal-board[data-portal="med-spa"] #app .script-preview-card .acts{padding-top:22px}
@media(max-width:600px){
 body.portal-board[data-portal="med-spa"] #app .script-preview-card .topic{font-size:clamp(22px,7.18vw,28px);letter-spacing:-.025em}
}

/* Three compact information sections in the isolated preview. */
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-angle .script-preview,
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-script-excerpt .script-preview,
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-onscreen .script-preview{font-size:14px;line-height:1.5}

/* Smaller white information text and clearer section dividers. */
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-angle .script-preview,
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-script-excerpt .script-preview,
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-onscreen .script-preview{font-size:13px;color:#fff}
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-section+.card-section,
body.portal-board[data-portal="med-spa"] #app .script-preview-card .acts{border-top-color:rgba(185,135,91,.25)}

/* Raise the final divider without shifting the rating controls. */
body.portal-board[data-portal="med-spa"] #app .script-preview-card .acts{margin-top:16px;padding-top:30px}

body.portal-board[data-portal="med-spa"] #app .script-preview-card{--portal-frame:rgba(185,135,91,.78);border-width:1px}
body.portal-board[data-portal="med-spa"] #app .script-preview-card::after{height:2px}
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-rating.rating-panel{position:static;top:auto;left:auto}
#app .script-preview-card .rating-panel .rating-question{font-size:9px}
#app .script-preview-card .rating-panel .rating-stars{gap:2px}
#app .script-preview-card .rating-panel .rating-star{font-size:18px;line-height:1;padding:1px}
#app .script-preview-card .rating-panel .rating-summary,
#app .script-preview-card .rating-panel .rating-change{font-size:11px}

/* Reader frame matches the approved restored This Week frame. */
body.portal-board[data-portal="med-spa"] .reader .kit{border-width:1px;--portal-frame:rgba(185,135,91,.78)}
body.portal-board[data-portal="med-spa"] .reader .kit::after{height:2px}

/* Move ID and divider toward the panel without moving the panel. */
body.portal-board[data-portal="med-spa"] .reader-head{margin-bottom:12px}
@media(max-width:560px){body.portal-board[data-portal="med-spa"] .reader-head{margin-bottom:8px}}

/* Approved comparison: reader body and CTA text match 13px opening text. */
body.portal-board[data-portal="med-spa"] .reader-script-card .card-script-excerpt .script-preview,body.portal-board[data-portal="med-spa"] .reader-script-card .card-onscreen .script-preview{font-size:13px}

/* Approved 14px supporting copy; hook typography is unchanged. */
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-angle .script-preview,
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-script-excerpt .script-preview,
body.portal-board[data-portal="med-spa"] #app .script-preview-card .card-onscreen .script-preview,
body.portal-board[data-portal="med-spa"] .reader-script-card .card-script-excerpt .script-preview,
body.portal-board[data-portal="med-spa"] .reader-script-card .card-onscreen .script-preview{font-size:14px}
