/* Product previews share the visual language of the supplied Printi screens. */
.printi-screen-figure{margin:0;min-width:0;border:1px solid #deddea;border-radius:15px;overflow:hidden;background:#f7f8fc;box-shadow:0 25px 70px #29233c12}
.printi-screen-link{display:block;color:#15162d;background:#fff;text-decoration:none}
.printi-screen-link>img{display:block;width:100%;height:auto}
.printi-screen-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:17px 20px;background:#fff;color:#25263c;border-top:1px solid #e5e4ed;font-size:12px;font-weight:500;line-height:1.5}
.printi-screen-subtitle{display:block;color:#73748b;font-size:10px;font-weight:400;margin-top:3px}
.printi-screen-open{color:#6936d5;font-size:11px;font-weight:400;white-space:nowrap;border-bottom:1px solid #d5c6ee;padding-bottom:2px}
.printi-screen-link:hover .printi-screen-open{color:#40208a;border-color:#7441d8}
.printi-screen-link:focus-visible{outline:3px solid #6c37e7;outline-offset:-3px}
.platform.screenshot-workflow .journey{grid-template-columns:.64fr 1.36fr;gap:48px}
.screenshot-workflow .journey-copy{min-width:0}
.screenshot-workflow .screenshot-example{border-radius:14px;overflow:hidden;background:#fff;border:1px solid #deddea}
.screenshot-workflow .screenshot-example img{display:block;width:100%;height:auto}
.screenshot-workflow .screenshot-example .storefront-shot-footer{font-size:11px}
.screenshot-workflow .caption{font-size:11px;line-height:1.65}
.workspace .workspace-preview.printi-screen-figure{border-color:#dad8e6}
.bobbin-screen-section>.two-col{grid-template-columns:.68fr 1.32fr;gap:55px;align-items:center}
.bobbin-screen-section .bobbin-screen{box-shadow:0 30px 90px #0003}
.screenshot-product-designer .designer-caption{max-width:900px;margin:21px auto 0;text-align:center}
.screenshot-product-designer .printi-screen-figure{box-shadow:0 30px 90px #18142825}

/* The sheet preview retains its real rectangular-yield calculation and controls. */
.printi-sheet-interface .cut-studio{position:relative;background:#f8f9fc;color:#191a33;border:1px solid #cfd2e2;border-radius:15px;box-shadow:0 35px 100px #0002}
.cut-app-header{position:relative;z-index:1;height:67px;display:flex;align-items:center;gap:18px;padding:13px 19px;background:#fff;border-bottom:2px solid transparent;border-image:linear-gradient(90deg,#8c55ff,#fb59c0,#fbbf42,#30caab,#2aaaf0) 1;box-sizing:border-box;color:#151729}
.cut-app-logo{display:block;width:102px;height:auto;flex-shrink:0}
.cut-app-switcher{display:flex;align-items:center;gap:8px;padding:6px 9px;background:#f3f8fa;border:1px solid #d6e1e8;border-radius:12px;font-size:11px;line-height:1.2;white-space:nowrap;font-weight:600}
.cut-app-switcher>svg{width:19px;height:19px;color:#008d79;background:#ddf5ef;padding:4px;box-sizing:content-box;border-radius:7px}
.cut-app-switcher small{display:block;color:#6e7487;font-weight:400;font-size:9px;margin-top:2px}
.cut-app-switcher b{font-size:17px;font-weight:400;color:#7e8594;margin-left:5px}
.cut-app-search{margin-left:auto;display:flex;align-items:center;gap:8px;border:1px solid #daddE8;border-radius:10px;background:#f4f5f9;color:#70798c;padding:8px 11px;width:clamp(200px,28vw,365px);font-size:10px;line-height:1.3}
.cut-app-search>svg{width:17px;height:17px;flex-shrink:0}
.cut-app-search>span{flex:1}
.cut-app-search kbd{font-family:inherit;font-size:8px;background:#e9ecf3;border:1px solid #d4d8e4;border-radius:4px;padding:3px;white-space:nowrap}
.cut-app-actions{display:flex;align-items:center;gap:11px;white-space:nowrap;font-size:11px;margin-left:auto}
.cut-app-actions>span:first-child{border:1px solid #e2e3eb;border-radius:9px;padding:7px 10px}
.cut-app-actions .cut-app-new{padding:8px 11px;background:linear-gradient(#3476dc,#1244c5);color:#fff;border-radius:8px;box-shadow:0 2px 5px #0d41be22}
.cut-app-actions i{display:grid;place-items:center;border-radius:50%;background:#141625;color:#fff;width:28px;height:28px;font-size:10px;font-style:normal}
.cut-app-breadcrumb{display:flex;gap:9px;margin-left:62px;padding:14px 22px;background:#fbfcff;color:#008c77;border-bottom:1px solid #dce0eb;font-size:9px;font-weight:600;letter-spacing:.11em;line-height:1.3}
.cut-app-breadcrumb>span{color:#9aa7b7}
.cut-app-rail{position:absolute;top:67px;bottom:0;left:0;width:62px;border-right:1px solid #dce1ee;background:#f9faff;display:flex;flex-direction:column;align-items:center;gap:11px;padding:15px 9px;box-sizing:border-box}
.cut-app-nav-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:12px;background:#f0f1fb;border:1px solid #e0e5f1;color:#526fe2;box-sizing:border-box}
.cut-app-nav-icon:nth-child(2){color:#008e75;background:#eef9f6}
.cut-app-nav-icon:nth-child(3){color:#1273c4;background:#eef6ff}
.cut-app-nav-icon:nth-child(4){color:#ae661f;background:#fbf6ef}
.cut-app-nav-icon:nth-child(6){color:#8850da;background:#f4efff}
.cut-app-nav-icon:nth-child(7),.cut-app-nav-icon:nth-child(8){color:#128b9b;background:#eff7fa}
.cut-app-nav-icon.active{color:#fff;background:linear-gradient(#c77b22,#9f4404);border-color:#a44a08;box-shadow:0 3px 7px #a44a0825}
.cut-app-nav-icon>svg{width:21px;height:21px}
.printi-sheet-interface .cut-toolbar,.printi-sheet-interface .cut-workspace,.printi-sheet-interface .cut-playback{margin-left:62px}
.printi-sheet-interface .cut-toolbar{background:#fff;border-color:#dde1ec;padding:18px 24px;color:#1c2138}
.printi-sheet-interface .cut-toolbar>span{font-size:16px;font-weight:600}
.printi-sheet-interface .cut-toolbar>span>i{background:#008d78;box-shadow:none}
.printi-sheet-interface .cut-toolbar label{color:#69718a}
.printi-sheet-interface .cut-toolbar select{background:#fff;color:#21243a;border-color:#d8dcea;border-radius:8px}
.printi-sheet-interface .rotation-switch{color:#525d78}
.printi-sheet-interface .rotation-switch>span{background:#fff;color:#7f86a0;border-color:#d3d8e8}
.printi-sheet-interface .rotation-switch[aria-pressed=true]>span{background:#1762db;color:#fff;border-color:#1762db}
.printi-sheet-interface .cut-workspace{background:#f5f7fc;grid-template-columns:minmax(0,1fr) 270px}
.printi-sheet-interface .cut-canvas{background:linear-gradient(135deg,#f8faff,#eff3fb)}
.printi-sheet-interface .cut-canvas-meta{color:#727b92;font-size:10px}
.printi-sheet-interface .cut-sheet>text{fill:#68718a}
.printi-sheet-interface .cut-sheet>rect:first-of-type{fill:#e0e6f1;stroke:#aab8d0}
.printi-sheet-interface .cut-sheet>rect:nth-of-type(2){stroke:#9aa9c5}
.printi-sheet-interface .cut-sheet .cut-outline{stroke:#168b79}
.printi-sheet-interface .cut-sheet .cut-remnant{stroke:#168b79}
.printi-sheet-interface .cut-canvas-footer{color:#69748e;font-size:10px}
.printi-sheet-interface .cut-canvas-footer>span:last-child{color:#7b849a}
.printi-sheet-interface .cut-readout{background:#fff;border-color:#dfe3ed;color:#1c2138}
.printi-sheet-interface .cut-readout>small{color:#008c77;font-size:10px}
.printi-sheet-interface .yield-metric>span{color:#69738c}
.printi-sheet-interface .yield-metric strong{font-size:68px;color:#151831}
.printi-sheet-interface .yield-metric b{color:#087a5f;background:#e0f7ed}
.printi-sheet-interface .yield-metric>p{color:#727b92}
.printi-sheet-interface .cut-numbers>div{border-color:#e6e9f0}
.printi-sheet-interface .cut-numbers span{color:#707991;font-size:12px}
.printi-sheet-interface .cut-numbers strong{color:#1c2138;font-size:20px}
.printi-sheet-interface .cut-saving{background:#f4f2fe;border-color:#e1daf7}
.printi-sheet-interface .cut-saving small{color:#7a65a5}
.printi-sheet-interface .cut-saving strong{color:#513393;font-size:22px}
.printi-sheet-interface .cut-saving p{color:#817294}
.printi-sheet-interface .cut-playback{background:#fff;border-color:#dfe3ed}
.printi-sheet-interface .cut-phases>span{color:#9298ac}
.printi-sheet-interface .cut-phases b{color:#aaa7bd}
.printi-sheet-interface .cut-phases .current{color:#44348c}
.printi-sheet-interface .cut-phases .current>b{color:#7644db}
.printi-sheet-interface .cut-phases .complete,.printi-sheet-interface .cut-phases .complete>b{color:#008d77}
.printi-sheet-interface .cut-progress{background:#edeaf6}
.printi-sheet-interface .cut-player-bottom>p{color:#737b90}
.printi-sheet-interface .cut-player-bottom>button{color:#204fae;background:#edf3ff;border-color:#cad9f6;border-radius:8px}
.printi-sheet-interface .cut-studio :is(button,select):focus-visible{outline:2px solid #7440e2;outline-offset:3px}

@media(max-width:1100px){
 .platform.screenshot-workflow .journey{grid-template-columns:.72fr 1.28fr;gap:30px}
 .bobbin-screen-section>.two-col{gap:35px;grid-template-columns:.72fr 1.28fr}
 .cut-app-header{gap:12px;padding-inline:15px}
 .cut-app-switcher{font-size:10px;padding:6px}
 .cut-app-switcher b{display:none}
 .cut-app-search{width:auto;flex:1;font-size:9px}
 .cut-app-actions{gap:8px}
 .printi-sheet-interface .cut-workspace{grid-template-columns:minmax(0,1fr) 235px}
}
@media(max-width:900px){
 .bobbin-screen-section>.two-col{grid-template-columns:1fr;gap:35px}
 .bobbin-screen-section .bobbin-screen{width:100%}
 .cut-app-search{display:none}
 .cut-app-actions{margin-left:auto}
 .printi-sheet-interface .cut-workspace{grid-template-columns:1fr}
 .printi-sheet-interface .cut-readout{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
 .cut-app-rail{gap:8px}
}
@media(max-width:760px){
 .platform.screenshot-workflow .journey{grid-template-columns:1fr;gap:28px}
 .printi-screen-footer{padding:13px 14px;gap:10px;font-size:10px}
 .printi-screen-subtitle{font-size:8px}
 .printi-screen-open{font-size:9px}
 .printi-screen-figure{border-radius:10px}
 .cut-app-header{height:61px;padding:11px 13px;gap:12px}
 .cut-app-logo{width:84px}
 .cut-app-switcher{margin-right:auto}
 .cut-app-switcher>svg{display:none}
 .cut-app-actions{gap:7px;font-size:10px;margin-left:0}
 .cut-app-actions>span:first-child{display:none}
 .cut-app-actions i{width:25px;height:25px}
 .cut-app-breadcrumb{margin-left:0;padding:13px 16px;font-size:8px;gap:6px}
 .cut-app-rail{display:none}
 .printi-sheet-interface .cut-toolbar,.printi-sheet-interface .cut-workspace,.printi-sheet-interface .cut-playback{margin-left:0}
 .printi-sheet-interface .cut-toolbar{padding:17px 16px}
 .printi-sheet-interface .cut-readout{grid-template-columns:1fr 1fr}
 .printi-sheet-interface .yield-metric strong{font-size:58px}
 .printi-sheet-interface .cut-canvas-meta{font-size:8px}
 .printi-sheet-interface .cut-numbers span{font-size:11px}
 .printi-sheet-interface .cut-numbers strong{font-size:18px}
}
@media(max-width:400px){.cut-app-switcher{display:none}.cut-app-actions{margin-left:auto}}
