.modal-backdrop{--ink:#202020;--muted:#6d6d6d;--line:#d9d6d1;--paper:#f7f6f4;--panel:#ffffff;--accent:#111111;--soft:#eee9e2;--success:#386641;--warning:#f9a43a;--warning-dark:#7a342e}.mini-plan{position:relative;width:92px;height:72px;overflow:hidden;border:1px solid #dcd7cf;background:linear-gradient(#ddd8cf 1px,transparent 1px),linear-gradient(90deg,#ddd8cf 1px,transparent 1px),#f7f5f1;background-size:18px 18px}.mini-plan:before,.mini-plan:after{content:"";position:absolute;border:2px solid rgba(249,164,58,.68);animation:planTrace 3.4s ease-in-out infinite}.mini-plan:before{left:9px;top:10px;width:70px;height:48px}.mini-plan:after{right:7px;bottom:7px;width:18px;height:28px;background:#f7f5f1;border-left:1px solid #d8d2c9;border-top:1px solid #d8d2c9;border-right:0;border-bottom:0;animation:none}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2147483647;display:grid;place-items:center;padding:22px;background:#20202033;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .26s ease,visibility 0s linear .26s}.modal-backdrop.is-open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .26s ease}.overage-modal{position:relative;display:grid;grid-template-columns:1fr;gap:12px;width:min(1040px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:18px;border:1px solid var(--line);border-radius:8px;background:#fff;box-shadow:0 18px 55px #00000029;transform:translateY(10px) scale(.98);transition:transform .26s ease}.modal-backdrop.is-open .overage-modal{transform:translateY(0) scale(1)}.modal-close{position:absolute;right:14px;top:10px;z-index:3;border:0;background:transparent;color:#3c3c3c;cursor:pointer;font-size:26px;line-height:1}.animation-panel{position:relative;min-height:0;height:min(620px,calc(100vh - 170px));overflow:hidden;background:#f7f4ee;border:1px solid var(--accent)}.overage-image{display:block;width:100%;height:100%;object-fit:contain;transform-origin:center center}.animation-panel .overage-image,.animation-panel .animation-overlay{display:none}.motion-svg{display:block;width:100%;height:100%}.motion-svg text{font-family:Arial,Helvetica,sans-serif;fill:#111}.motion-title{font-size:56px}.motion-subtitle,.motion-copy-step text,.motion-formula text{font-size:24px}.copy-heading{font-size:28px;font-weight:700}.motion-copy-step line{stroke:#111;stroke-width:1}.motion-legend text{font-size:20px;font-weight:700}.m-label text{font-size:23px;font-weight:700}.m-tile{fill:url(#tileSpeckle);stroke:#b9b2a8;stroke-width:1.5}.m-waste,.m-offcut{fill:url(#wasteSpeckle);stroke:#6f4f42;stroke-width:1.4}.m-cutaway-piece{fill:url(#tileSpeckle);stroke:#8f8578;stroke-width:1.4;opacity:.95}.m-cut-void{fill:#fff;stroke:#d8d1c6;stroke-width:1}.m-spare{fill:url(#tileSpeckle);stroke:#b9b2a8;stroke-width:1.5}.m-cut-line{fill:none;stroke:#d54535;stroke-dasharray:14 10;stroke-width:7;stroke-linecap:round;stroke-linejoin:round}.motion-room-outline-top{stroke:#111;stroke-width:4;pointer-events:none}.m-overflow-tile{fill:url(#tileSpeckle);stroke:#8f8578;stroke-width:1.5}.m-basket{fill:#fff;stroke:#111;stroke-width:4;stroke-linejoin:round}.m-basket-line{fill:none;stroke:#111;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.motion-focus-frame{fill:none;stroke:#111;stroke-width:4;pointer-events:none}.motion-svg [data-animation-step],.motion-svg [data-animation-label]{opacity:0;transition:opacity .32s ease}.motion-svg .motion-copy-step,.motion-svg .motion-formula{opacity:.18;transition:opacity .32s ease}.motion-svg .recommended-copy,.motion-svg .motion-formula{opacity:0}.animation-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.animation-hotspot{position:absolute;opacity:0;border:2px solid #111;background:#ffffff1f;box-shadow:0 0 0 999px #f8f7f594;transition:opacity .3s ease}.animation-hotspot span{position:absolute;left:0;top:-38px;display:inline-grid;place-items:center;min-height:30px;padding:0 12px;background:#111;color:#fff;font-size:12px;font-weight:700;text-transform:uppercase;white-space:nowrap}.hotspot-coverage{left:14%;top:25%;width:34%;height:32%}.hotspot-waste{left:10%;top:18%;width:49%;height:54%;border-color:#b98063}.hotspot-waste span{background:#b98063}.hotspot-spares{left:43%;top:61%;width:16%;height:25%}.hotspot-recommended{left:66%;top:62%;width:31%;height:13%;border-color:#111}.animation-progress{position:absolute;right:18px;bottom:21px;display:flex;gap:8px}.animation-dot{width:8px;height:8px;border:1px solid #111;background:transparent;opacity:.5}.animation-dot.is-active{background:#111;opacity:1}.animation-panel .plan-svg{display:none}.plan-svg{display:block;width:100%;height:100%}.room-stroke{fill:none;stroke:#f8b248b3;stroke-width:12;stroke-linejoin:miter;stroke-linecap:square;stroke-dasharray:1180;stroke-dashoffset:1180;animation:roomPathDraw 8.8s ease-in-out infinite}.room-inner{fill:none;stroke:#d3cec6d1;stroke-width:2}.coverage-tile{fill:#fbfaf6;stroke:#97948dad;stroke-width:1;opacity:0;transform-box:fill-box;transform-origin:center;transform:translateY(14px);animation:coverageTileIn 8.8s ease-in-out infinite;animation-delay:calc(var(--i) * .06s)}.tile-chip{fill:#b08d6f2e;opacity:0;animation:coverageTileIn 8.8s ease-in-out infinite;animation-delay:calc(var(--i) * .06s + .05s)}.waste-zone{fill:#f9a43a6b;stroke:#996c2a94;stroke-width:1;opacity:0;transform-box:fill-box;transform-origin:center;animation:wasteZoneIn 8.8s ease-in-out infinite;animation-delay:calc(2.55s + var(--w) * .16s)}.cut-guide{fill:none;stroke:#7a342e66;stroke-width:1.4;stroke-dasharray:7 6;opacity:0;animation:cutGuideIn 8.8s ease-in-out infinite}.waste-piece{fill:#f9a43a80;stroke:#7f531dc7;stroke-width:1.4;opacity:0;transform-box:fill-box;transform-origin:center;transform:translate(var(--dx),var(--dy)) rotate(var(--r)) scale(.84);animation:wastePieceIn 8.8s ease-in-out infinite;animation-delay:calc(var(--j) * .12s)}.plan-label{fill:#5d534d;font-family:Arial,Helvetica,sans-serif;font-size:13px;font-weight:700;opacity:0;animation:labelIn 8.8s ease-in-out infinite}.plan-note{fill:#7c726c;font-family:Arial,Helvetica,sans-serif;font-size:11px;opacity:0;animation:labelIn 8.8s ease-in-out infinite;animation-delay:0s}.label-coverage,.label-waste,.label-spares{animation-delay:0s}.legend-dot{opacity:0;animation:labelIn 8.8s ease-in-out infinite}.dot-coverage{fill:#fbfaf6;stroke:#97948dad;stroke-width:1.4;animation-delay:0s}.dot-waste{fill:#f9a43a6b;stroke:#996c2a94;animation-delay:0s}.plan-outline{position:absolute;top:52px;right:52px;bottom:52px;left:52px;border:2px solid rgba(248,178,72,.62);opacity:0;animation:outlineDraw 6.4s ease-in-out infinite}.plan-outline:before{content:"";position:absolute;left:-2px;bottom:90px;width:164px;height:118px;background:#f2f1ef;border-right:2px solid rgba(248,178,72,.62);border-top:2px solid rgba(248,178,72,.62)}.plan-outline:after{content:"";position:absolute;left:-2px;top:88px;width:34px;height:128px;background:#f2f1ef;border-right:1px dashed #c9c3ba}.animated-room{position:absolute;left:84px;top:118px;display:grid;grid-template-columns:repeat(5,46px);grid-auto-rows:46px;gap:0}.animated-tile{width:46px;height:46px;border:1px solid rgba(155,151,145,.72);background:radial-gradient(circle at 20% 24%,rgba(176,141,111,.22) 0 7%,transparent 7.5%),radial-gradient(circle at 74% 60%,rgba(95,98,92,.18) 0 6%,transparent 6.5%),#fbfaf6;opacity:0;transform:translateY(14px);animation:tileInstall 6.4s ease-in-out infinite;animation-delay:calc(var(--i) * .08s)}.animated-tile.is-cutout{opacity:0;visibility:hidden;animation:none}.cut-line{position:absolute;background:#7a342e5c;opacity:0;animation:cutLine 6.4s ease-in-out infinite}.cut-line.vertical{left:83px;top:118px;width:1px;height:184px}.cut-line.horizontal{left:84px;top:302px;width:184px;height:1px}.overage-stack{position:absolute;right:54px;bottom:54px;display:grid;grid-template-columns:repeat(2,36px);gap:7px}.overage-extra{width:36px;height:36px;border:1px solid rgba(148,104,39,.72);background:radial-gradient(circle at 24% 28%,rgba(176,141,111,.32) 0 8%,transparent 8.5%),radial-gradient(circle at 72% 64%,rgba(95,98,92,.24) 0 7%,transparent 7.5%),#f9a43a47;opacity:0;transform:scale(.84);animation:extraTiles 6.4s ease-in-out infinite;animation-delay:calc(2.4s + var(--j) * .16s)}.animation-label{position:absolute;left:52px;right:52px;bottom:24px;color:#6d625b;font-size:12px;line-height:1.45;text-align:center;opacity:0;animation:labelFade 6.4s ease-in-out infinite}.modal-copy h2{display:none}.modal-copy{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.modal-copy h2{margin:0;color:var(--warning-dark);font-size:20px;line-height:1.15;text-transform:uppercase}.modal-copy p{display:none;margin:0;color:var(--warning-dark);font-size:13px;line-height:1.45}.modal-copy strong{font-weight:800}.mobile-animation-copy{display:none}.modal-actions{display:grid;grid-template-columns:minmax(150px,1fr) minmax(150px,1fr);gap:10px;margin-top:0}.modal-action{min-height:42px;border:1px solid #111;border-radius:0;background:#111;color:#fff;cursor:pointer;font:inherit;font-size:13px;font-weight:800;text-transform:uppercase}.modal-action.secondary{border-color:#111;background:#fff;color:#111}@keyframes planTrace{0%,to{opacity:.35}50%{opacity:1}}@keyframes outlineDraw{0%,8%{opacity:0;clip-path:inset(0 100% 100% 0)}22%,82%{opacity:1;clip-path:inset(0 0 0 0)}to{opacity:0;clip-path:inset(0 0 0 0)}}@keyframes tileInstall{0%,18%{opacity:0;transform:translateY(14px)}32%,82%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(0)}}@keyframes cutLine{0%,32%{opacity:0}42%,76%{opacity:.9}to{opacity:0}}@keyframes extraTiles{0%,42%{opacity:0;transform:scale(.84) translateY(10px)}54%,84%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(1) translateY(0)}}@keyframes labelFade{0%,46%{opacity:0}58%,86%{opacity:1}to{opacity:0}}@keyframes roomPathDraw{0%,8%{opacity:0;stroke-dashoffset:1180}22%,88%{opacity:1;stroke-dashoffset:0}to{opacity:0;stroke-dashoffset:0}}@keyframes coverageTileIn{0%,15%{opacity:0;transform:translateY(14px)}30%,88%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(0)}}@keyframes wasteZoneIn{0%,36%{opacity:0;transform:scale(.98)}48%,88%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1)}}@keyframes cutGuideIn{0%,35%{opacity:0}47%,82%{opacity:1}to{opacity:0}}@keyframes wastePieceIn{0%,48%{opacity:0;transform:translate(0) rotate(0) scale(.9)}62%,88%{opacity:1;transform:translate(var(--dx),var(--dy)) rotate(var(--r)) scale(1)}to{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--r)) scale(1)}}@keyframes labelIn{0%,8%{opacity:0}16%,86%{opacity:1}to{opacity:0}}@media(max-width:620px){.overage-modal{grid-template-columns:1fr}.animation-panel{height:min(360px,calc(100vh - 310px))}.motion-svg{width:100%;max-width:none}.motion-explainer{display:none}.mobile-animation-copy{display:grid;gap:8px;padding:2px 2px 4px}.mobile-animation-copy h2{margin:0;color:var(--warning-dark);font-size:22px;line-height:1.12}.mobile-animation-copy .mobile-subtitle{margin:0;color:#5f4d43;font-size:14px;line-height:1.45}.mobile-step-copy{display:none;margin:4px 0 0;padding:12px;border-left:4px solid var(--accent);background:#f8f7f5;color:#1f1f1f}.mobile-step-copy.is-active{display:block}.mobile-step-copy strong{display:block;margin-bottom:4px;font-size:15px}.mobile-step-copy span{display:block;font-size:13px;line-height:1.45}.animation-panel .animation-progress{display:none}.mobile-animation-progress{display:flex;justify-content:center;gap:10px;padding:2px 0 0}.mobile-animation-progress .animation-dot{width:9px;height:9px;border:1px solid #777}.mobile-animation-progress .animation-dot.is-active{border-color:#111;background:#111}.modal-actions{grid-template-columns:1fr}.animation-progress{position:static;transform:none}}
/*# sourceMappingURL=/cdn/shop/t/13/assets/tile-overage.css.map */
