/* Browsing chrome only. Article HTML, text styles and publication sizing stay intact. */
#templatesPanel .recipe-row[hidden]{display:none!important}
#templatesPanel .recipe-row{display:grid!important;grid-template-columns:54px minmax(0,1fr)!important;gap:12px!important;padding:12px!important;margin:0!important;min-height:104px!important;align-items:stretch!important;box-sizing:border-box;border:1.5px solid #e0daeb!important;box-shadow:0 2px 6px #35465e04;transition:border-color 160ms,box-shadow 160ms}
#templatesPanel .recipe-row:hover,#templatesPanel .recipe-row:focus-within{border-color:#aa96c1!important;box-shadow:0 4px 12px #5740670d}
#templatesPanel .recipe-row-copy{display:grid!important;grid-template-rows:36px 18px 28px!important;gap:6px!important;min-width:0;align-content:stretch}
#templatesPanel .recipe-row .recipe-purpose{font:11px/18px var(--ui-font);color:#7c7188;margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:400}
#templatesPanel .recipe-row-copy>b{margin:0!important;align-self:center;font-size:13px!important;line-height:1.5!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;color:#40394f}
#templatesPanel .recipe-row .template-actions{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 26px!important;gap:6px!important;margin:0!important;align-items:center;min-width:0}
#templatesPanel .recipe-row .template-actions>button{width:100%;height:28px!important;min-height:28px!important;padding:0 2px!important;font-size:11px!important;white-space:nowrap;border-radius:6px}
#templatesPanel .recipe-row .template-actions>button:first-child{background:#f3eff9;color:#695087;border-color:#e0d5ee}
#templatesPanel .recipe-thumbnail{width:54px!important;height:78px!important;margin:0!important;align-self:center;border-radius:5px}
#templatesPanel .recipe-more,#templatesPanel .recipe-more[open]{display:block!important;flex-basis:auto!important;width:26px;align-self:center;position:relative;font-size:11px}
#templatesPanel .recipe-more summary{display:grid!important;place-items:center;width:26px!important;height:28px;padding:0!important;border:1px solid #e0d9e8;border-radius:6px;background:#fff;box-sizing:border-box}
#templatesPanel .recipe-more summary:hover,#templatesPanel .recipe-more[open] summary{background:#f3eff9;color:#695087}
#templatesPanel .recipe-more-menu{position:fixed;right:auto;z-index:100;width:152px;max-width:calc(100vw - 16px);overflow-y:auto;overscroll-behavior:contain;padding:6px;background:#fff;border:1px solid #ded8e8;border-radius:9px;box-shadow:0 8px 24px #30304524;display:grid;gap:4px}
#templatesPanel .recipe-more-menu button{display:block;width:100%;min-height:32px;margin:0!important;font:12px var(--ui-font);text-align:left;padding:6px 9px!important;border:0!important;background:#fff;border-radius:5px;color:#5a496b;cursor:pointer}
#templatesPanel .recipe-more-menu button:hover{background:#f3eff9}
#templatesPanel .recipe-row:has(.recipe-more[open]){position:relative;z-index:3}
#templatesPanel :is(.template-actions button,.recipe-more summary):focus-visible{outline:2px solid #826097;outline-offset:2px}

/* Review: settings and article scroll independently, while confirmation stays visible. */
.recipe-selection-tip{font:12px/1.8 var(--ui-font);color:#705988;padding:12px;background:#f5f1f9;border-radius:8px}
#fullTemplatePreviewModal .full-template-preview-modal{display:flex;flex-direction:column;position:relative!important;width:min(1000px,calc(100vw - 32px))!important;height:min(860px,92vh);max-height:92vh!important;padding:0!important;border-radius:16px!important;background:#fff;overflow:hidden!important}
#fullTemplatePreviewModal .full-template-preview-head{flex:none;padding:20px 60px 16px 24px!important;border-bottom:1px solid #e1e6ee;background:#fff}
#fullTemplatePreviewTitle{font:600 20px/1.5 var(--ui-font);margin:0 0 6px;overflow-wrap:anywhere;max-height:90px;overflow-y:auto}
#fullTemplatePreviewCopy{font:12px/1.7 var(--ui-font);color:#738092;margin:0}
#fullTemplatePreviewModal .modal-close{position:absolute!important;right:16px!important;top:16px!important;left:auto!important;z-index:2}
.template-review-body{display:grid;grid-template-columns:minmax(280px,1fr) minmax(430px,1.35fr);flex:1;min-height:0;overflow:hidden}
#fullTemplatePreviewModal #workflowMapping{margin:0;padding:20px;border:0;border-right:1px solid #e1e6ee;border-radius:0;background:#f8f9fc;max-height:none!important;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#c6ceda transparent}
#workflowMapping .template-control-title{margin:0;font:600 13px/1.6 var(--ui-font);color:#344152}
#workflowMapping .template-view-options{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin:12px 0;padding:0}
#workflowMapping .template-option{display:flex;flex-direction:column;gap:6px;min-width:0;font:11px/1.5 var(--ui-font);color:#758194}
#workflowMapping .template-option-wide{grid-column:1/-1}
#workflowMapping .template-option select{width:100%;max-width:100%;height:34px;box-sizing:border-box;font:12px var(--ui-font);color:#435269;padding:0 8px;border:1px solid #dce2eb;border-radius:7px;background:#fff}
#workflowMapping .template-option input[type=color]{width:100%;height:34px;box-sizing:border-box;padding:4px;border:1px solid #dce2eb;border-radius:7px;background:#fff}
#workflowMapping .studio-hint{margin:12px 0 20px;font:11px/1.8 var(--ui-font);color:#7c8797}
.template-mapping-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #e1e6ee;padding-top:16px;margin:0 0 10px}
.template-mapping-heading .small-button{font-size:11px;height:28px}
.template-mapping-toggle{width:100%;min-height:30px;font-size:11px!important;margin:0 0 10px;border-style:dashed!important;background:#fff!important}
#workflowMapping .workflow-map-row{grid-template-columns:minmax(0,1fr);gap:8px;margin:0 0 10px;padding:12px;border:1px solid #e1e6ee;border-radius:9px;background:#fff}
#workflowMapping .workflow-map-row b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font:500 12px/1.75 var(--ui-font);color:#46556b}
#workflowMapping .workflow-map-row select{width:100%;max-width:100%;height:32px;font-size:12px;box-sizing:border-box}
#workflowMapping .workflow-media-strip img{width:54px;height:44px;object-fit:contain}
#workflowMapping :is(select,input,button):focus-visible{outline:2px solid #826097;outline-offset:2px}
#fullTemplatePreviewModal .full-template-preview-stage{min-width:0;min-height:0;max-height:none;padding:24px 16px;background:#edf1f6;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c2ccd9 transparent}
#fullTemplatePreviewCanvas.studio-preview-paper{width:390px!important;min-width:390px!important;max-width:none!important;margin:0 auto;padding:25px 20px 34px!important;border:0;border-radius:0;box-shadow:0 4px 18px #1d30460c}
#fullTemplatePreviewModal .full-template-preview-actions{flex:none;display:flex;gap:10px;align-items:center;padding:14px 24px;border-top:1px solid #e1e6ee;background:#fff}
.full-template-preview-actions>span{margin-right:auto;font:11px/1.6 var(--ui-font);color:#8b95a3}
#fullTemplatePreviewModal .full-template-preview-actions button{width:auto;min-width:110px;height:36px;padding:0 16px}

/* Full-size sample uses the same 390px paper / 350px text area as the draft preview. */
.recipe-sample-modal .studio-modal{width:min(920px,calc(100vw - 32px));max-width:920px;height:min(860px,92vh);max-height:92vh;padding:0!important;overflow:hidden;border-radius:16px!important}
.recipe-sample-modal .studio-modal>h2{flex:none;margin:0;padding:20px 60px 18px 24px;border-bottom:1px solid #e1e6ee;font:600 20px/1.5 var(--ui-font);overflow-wrap:anywhere;max-height:130px;overflow:auto}
.recipe-sample-modal .studio-modal>.studio-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(220px,1fr) minmax(430px,1.6fr);padding:0;overflow:hidden}
.recipe-sample-sidebar{min-width:0;overflow:auto;padding:20px;background:#f8f9fc;border-right:1px solid #e1e6ee}
.recipe-sample-sidebar .recipe-preview-switch{display:grid;grid-template-columns:1fr 1fr;padding:4px;gap:4px;background:#eae7f1;border:0;border-radius:9px;margin:0 0 18px}
.recipe-sample-sidebar .recipe-preview-switch button{padding:8px 4px;margin:0;min-width:0;border:1px solid transparent;border-radius:6px;background:transparent;font:500 12px/1.5 var(--ui-font);color:#85788f;cursor:pointer;transition:background 160ms,color 160ms,box-shadow 160ms}
.recipe-sample-sidebar .recipe-preview-switch button[aria-pressed=true]{background:#fff;color:#75578c;border-color:#e0d9e8;box-shadow:0 2px 6px #49365709}
.recipe-sample-sidebar .recipe-preview-switch button:focus-visible{outline:2px solid #826097;outline-offset:2px}
.recipe-sample-sidebar .recipe-design-note{font:13px/1.9 var(--ui-font);color:#526278;margin:0 0 18px}
.recipe-preview-status{padding:12px;border:1px solid #e2dbe9;border-radius:8px;background:#fff;font:12px/1.8 var(--ui-font);color:#6b5b7a;margin:0 0 12px}
.recipe-sample-sidebar .studio-hint{font:11px/1.8 var(--ui-font);color:#8993a3;margin:0}
.recipe-sample-modal .recipe-sample-stage{min-width:0;min-height:0;margin:0;border:0;border-radius:0;padding:24px 16px;background:#edf1f6;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c2ccd9 transparent}
.recipe-sample-modal .recipe-sample-stage .studio-sample-paper{width:390px;min-width:390px;max-width:none;margin:0 auto;padding:25px 20px 34px;border:0;border-radius:0;box-shadow:0 4px 18px #1d30460c}
.recipe-sample-modal .studio-footer{flex:none;padding:14px 24px;border-top:1px solid #e1e6ee;background:#fff}
@media(max-width:820px){
  .template-review-body,.recipe-sample-modal .studio-modal>.studio-body{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(110px,.65fr) minmax(180px,1fr)}
  #fullTemplatePreviewModal #workflowMapping,.recipe-sample-sidebar{border-right:0;border-bottom:1px solid #e1e6ee;padding:14px 18px}
  #workflowMapping .template-view-options{grid-template-columns:repeat(3,minmax(0,1fr))}
  #workflowMapping .template-option-wide{grid-column:auto}
  #fullTemplatePreviewModal .full-template-preview-stage,.recipe-sample-modal .recipe-sample-stage{padding:18px 8px}
  .recipe-sample-sidebar .recipe-preview-switch{max-width:320px;margin-bottom:12px}
  .full-template-preview-actions>span{display:none}
}
@media(prefers-reduced-motion:reduce){#templatesPanel .recipe-row,.recipe-sample-sidebar .recipe-preview-switch button{transition:none!important}}

/* Full-template cards: spacious sample column and an aligned three-action row. */
#templatesPanel .recipe-row{grid-template-columns:minmax(72px,35%) minmax(0,1fr)!important;gap:14px!important;padding:14px!important;min-height:154px!important;border-radius:12px!important;background:#fff}
#templatesPanel .recipe-row-copy{grid-template-rows:minmax(42px,1fr) auto 32px!important;gap:9px!important;align-content:stretch}
#templatesPanel .recipe-row-copy>b{font-size:14px!important;line-height:1.5!important;align-self:start!important;padding-top:3px}
#templatesPanel .recipe-row .recipe-purpose{font-size:11px;line-height:1.5;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
#templatesPanel .recipe-thumbnail{width:100%!important;height:124px!important;align-self:stretch!important;border-radius:7px;background:#fffdf9;box-shadow:0 2px 5px #473e2910}
#templatesPanel .recipe-thumbnail>section{transform:scale(.26);transform-origin:top left}
#templatesPanel .recipe-thumbnail>small{font-size:10px;padding:5px 0}
#templatesPanel .recipe-row .template-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important;align-self:end}
#templatesPanel .recipe-row .template-actions>button,#templatesPanel .recipe-more summary{height:32px!important;min-height:32px!important;font-size:11px!important;padding:0 2px!important;width:100%!important}
#templatesPanel .recipe-more,#templatesPanel .recipe-more[open]{width:100%!important;min-width:0;font-size:11px}
#templatesPanel .recipe-more summary{font-weight:500}
#templatesPanel{container-type:inline-size}
@container(max-width:280px){#templatesPanel .recipe-row{grid-template-columns:72px minmax(0,1fr)!important;gap:10px!important;padding:10px!important}#templatesPanel .recipe-thumbnail>section{transform:scale(.205)}#templatesPanel .recipe-row-copy>b{font-size:13px!important}#templatesPanel .recipe-row .template-actions>button,#templatesPanel .recipe-more summary{font-size:10px!important}}
