.tpl-app{--tpl-gold:#f7c86c;--tpl-ink:#102737;box-sizing:border-box;background:#102737;color:#fff;padding:clamp(24px,4vw,48px);border-radius:20px;font:400 16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;max-width:1180px;margin:32px auto;text-align:left;color-scheme:dark}
.tpl-app *{box-sizing:border-box}.tpl-app [hidden]{display:none!important}.tpl-app header{margin-bottom:30px}.tpl-app .tpl-eyebrow{font-size:13px;letter-spacing:.16em;font-weight:700;color:var(--tpl-gold);margin:0 0 12px}.tpl-app h2{font-family:inherit;font-size:clamp(30px,4vw,46px);line-height:1.15;color:#fff;margin:0 0 12px;letter-spacing:-.025em}.tpl-app p{margin:8px 0;color:#d2dfe7}.tpl-layout{display:grid;grid-template-columns:minmax(240px,350px) minmax(0,1fr);gap:32px}.tpl-label{display:block;margin:0 0 10px;font-weight:650}.tpl-app select{width:100%;background:#1d384a;border:1px solid #78909d;color:#fff;border-radius:8px;padding:12px;font:inherit;margin-bottom:24px;height:auto}.tpl-upload{border:1px dashed #94a9b7;border-radius:12px;padding:18px;margin-bottom:24px;background:#183244}.tpl-upload input{width:100%;font:inherit;font-size:14px;color:#fff}.tpl-upload input::file-selector-button{font:inherit;background:#e8eef2;color:#102737;border:0;border-radius:5px;padding:8px;margin-right:8px;cursor:pointer}.tpl-upload p,.tpl-upload small{font-size:14px;display:block;color:#d2dfe7}.tpl-consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;margin:4px 0 20px}.tpl-consent input{flex:0 0 auto;margin-top:5px;width:18px;height:18px;accent-color:var(--tpl-gold)}.tpl-app .tpl-generate,.tpl-app .tpl-download{display:inline-block;width:100%;border:0;border-radius:8px;background:var(--tpl-gold);color:var(--tpl-ink);font:700 16px/1.4 system-ui,sans-serif;padding:15px 20px;text-decoration:none;text-align:center;cursor:pointer}.tpl-app .tpl-generate:hover,.tpl-app .tpl-download:hover{background:#ffda92;color:var(--tpl-ink)}.tpl-app :focus-visible{outline:3px solid #fff;outline-offset:4px}.tpl-app :disabled{opacity:.65;cursor:wait}.tpl-app .tpl-status{font-size:14px;margin-top:14px;min-height:24px;overflow-wrap:anywhere}.tpl-view{background:#0b1f2c;border:1px solid #3b5565;border-radius:14px;padding:16px;align-self:start;min-width:0}.tpl-empty{min-height:380px;display:flex;flex-direction:column;justify-content:center;text-align:center;padding:24px}.tpl-empty>span{color:var(--tpl-gold);font-size:48px}.tpl-empty h3{color:#fff;font:600 24px/1.3 system-ui,sans-serif;margin:20px 0 10px}.tpl-app figure{margin:0 0 18px}.tpl-app figure img{display:block;width:100%;height:auto;max-height:640px;object-fit:contain;border-radius:8px}.tpl-app figcaption{font-size:14px;color:#d2dfe7;margin-top:8px}.tpl-app footer{font-size:14px;color:#c3d2dc;border-top:1px solid #3b5565;margin-top:28px;padding-top:18px}.tpl-app[aria-busy=true] .tpl-status{color:#ffda92}@media(max-width:760px){.tpl-layout{grid-template-columns:1fr;gap:24px}.tpl-empty{min-height:220px}.tpl-app{margin:20px auto;border-radius:12px}}@media(prefers-reduced-motion:no-preference){.tpl-app .tpl-generate{transition:background .15s ease}}
.tpl-areas{border:0;padding:0;margin:0 0 24px;min-width:0}.tpl-areas label{display:block;margin:8px 0}.tpl-areas input{width:18px;height:18px;accent-color:var(--tpl-gold);vertical-align:middle;margin-right:8px}.tpl-quote{margin-top:30px;padding-top:24px;border-top:1px solid #3b5565}.tpl-quote h3{font:600 26px/1.3 system-ui,sans-serif;color:#fff}.tpl-app .tpl-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0}.tpl-quote label{font-size:14px}.tpl-quote input:not([type=checkbox]),.tpl-quote textarea{display:block;width:100%;border:1px solid #78909d;background:#1d384a;color:#fff;border-radius:8px;padding:12px;font:inherit;margin-top:6px}.tpl-quote textarea{margin-bottom:18px}.tpl-quote-status{min-height:24px;overflow-wrap:anywhere}@media(max-width:600px){.tpl-app .tpl-contact-grid{grid-template-columns:1fr}}

.tpl-visualizer-section .tpl-app{--tpl-ink:#09221c;background:#102f27;max-width:none;margin:0;border:1px solid #49624e;color:#fff5dd}
.tpl-visualizer-section .tpl-app h2{font-family:Georgia,serif;color:#fff5dd}
.tpl-visualizer-section .tpl-app .tpl-view{background:#081f19;border-color:#49624e}
.tpl-visualizer-section .tpl-app .tpl-upload,.tpl-visualizer-section .tpl-app select,.tpl-visualizer-section .tpl-app .tpl-quote input:not([type=checkbox]),.tpl-visualizer-section .tpl-app .tpl-quote textarea{background:#173a30;border-color:#819781}
.tpl-visualizer-section .tpl-app .tpl-download,.tpl-visualizer-section .tpl-app .tpl-generate{background:#b3324d;color:#fff}
.tpl-visualizer-section .tpl-app .tpl-download:hover,.tpl-visualizer-section .tpl-app .tpl-generate:hover{background:#93263e;color:#fff}
.tpl-visualizer-section .tpl-app footer{position:static;background:none;width:auto;border-color:#49624e}
.tpl-visualizer-pending .tpl-download{width:auto;margin-top:18px}
.tpl-app .tpl-stakes-placement{margin:0 0 24px}.tpl-app .tpl-stakes-placement textarea{width:100%;max-width:100%;resize:vertical;min-height:100px;background:#173a30;border:1px solid #819781;border-radius:8px;color:#fff;padding:12px;font:inherit}

.tpl-app .tpl-area-color{margin:0 0 16px 28px}.tpl-app .tpl-area-color label{font-size:14px}.tpl-app .tpl-area-color select{margin-bottom:0}.tpl-app .tpl-area-choice{margin-bottom:10px}

.tpl-area-color select + label, .tpl-area-pattern { margin-top: 12px; }

.tpl-app .tpl-area-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.tpl-app .tpl-area-header>label{margin:0;flex:1}
.tpl-app .tpl-area-toggle{width:auto;min-height:36px;padding:5px 10px;margin:0;border:1px solid #789580;border-radius:6px;background:transparent;color:#f1cd85;font-size:12px;cursor:pointer;flex-shrink:0}
.tpl-app .tpl-area-toggle[hidden]{display:none}
.tpl-app .tpl-area-toggle:focus-visible{outline:2px solid #f1cd85;outline-offset:3px}

.tpl-app .tpl-request-design-quote{margin-top:12px}
.tpl-app .tpl-quote{scroll-margin-top:260px}


.tpl-app .tpl-preview-loading{min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:32px 20px;margin-bottom:18px;border:1px solid #819781;border-radius:10px;background:radial-gradient(ellipse at center,#173a30,#09221b);text-align:center}
.tpl-app .tpl-preview-loading p{font-weight:600;color:#f1cd85;margin:0}
.tpl-app .tpl-preview-loading small{color:#d2dfe7}
.tpl-app .tpl-preview-spinner{display:block;width:48px;height:48px;border:3px solid #476653;border-top-color:#f1cd85;border-right-color:#b3324d;border-radius:50%;animation:tpl-preview-spin 1s linear infinite}
@keyframes tpl-preview-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.tpl-app .tpl-preview-spinner{animation:none}}

.tpl-app .tpl-area-toggle{width:36px;height:36px;padding:8px;border:0;display:flex;align-items:center;justify-content:center}
.tpl-app .tpl-area-toggle::before{content:"";display:block;width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
.tpl-app .tpl-area-toggle[aria-expanded=true]::before{transform:rotate(225deg)}

.tpl-preview-actions{display:flex;align-items:stretch;gap:12px}.tpl-preview-actions .tpl-download{flex:1;min-width:0}.tpl-app .tpl-share-design{flex:0 0 54px;display:flex;align-items:center;justify-content:center;border:1px solid #819781;border-radius:8px;background:#173a30;color:#f1cd85;cursor:pointer}.tpl-share-status{overflow-wrap:anywhere}.tpl-share-status input{width:100%}

.tpl-app .tpl-design-frame{position:relative}
.tpl-app .tpl-design-frame img{display:block;width:100%}
.tpl-app .tpl-design-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;padding:0;display:grid;place-items:center;border:1px solid #f1cd8599;border-radius:50%;background:#09221be6;color:#f1cd85;cursor:pointer;box-shadow:0 2px 12px #0005}
.tpl-app .tpl-design-arrow[hidden]{display:none}
.tpl-app .tpl-design-previous{left:10px}.tpl-app .tpl-design-next{right:10px}
.tpl-app .tpl-design-arrow:hover:not(:disabled){background:#173a30}
.tpl-app .tpl-design-arrow:disabled{opacity:.35;cursor:default}
.tpl-app .tpl-design-arrow:focus-visible{outline:3px solid #f1cd85;outline-offset:3px}
.tpl-app .tpl-design-history{margin:0 0 16px;color:#f1cd85;font:600 16px/1.5 system-ui}

#lighting-visualizer .tpl-area-toggle{border:0!important;border-radius:0;background:transparent!important;box-shadow:none!important;outline:none!important}
#lighting-visualizer .tpl-area-toggle::before{width:6px;height:6px;border-right-width:1.5px;border-bottom-width:1.5px}
#lighting-visualizer .tpl-area-toggle:focus-visible::before{outline:2px solid #f1cd85;outline-offset:5px}

.tpl-app .tpl-drop-hint{display:none}
@media(min-width:761px) and (pointer:fine){
 .tpl-app .tpl-drop-hint{display:block;margin:0 0 12px;color:#f1cd85;font-weight:600}
 #lighting-visualizer .tpl-upload.tpl-drag-over{border-color:#f1cd85!important;border-style:solid;background:#214b3c!important;box-shadow:0 0 0 2px #f1cd85}
}

#lighting-visualizer .tpl-upload-error{color:#ffe1e6;background:#562330;border-left:3px solid #ff9aad;border-radius:4px;padding:10px 12px;margin:12px 0 0;font-weight:600}

.tpl-app .tpl-design-frame > .tpl-preview-loading{position:absolute;inset:0;z-index:3;min-height:0;margin:0;padding:16px;border:0;border-radius:8px;background:rgba(9,34,27,.94)}

.tpl-app .tpl-feedback-error{color:#ffe1e6!important;background:#562330;border-left:4px solid #ff9aad;border-radius:6px;padding:12px 14px;font-weight:650}
@media(prefers-reduced-motion:no-preference){.tpl-app .tpl-feedback-error{animation:tpl-error-nudge .45s ease-out}}
@keyframes tpl-error-nudge{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}

.tpl-app .tpl-upload{cursor:pointer}.tpl-app .tpl-upload:focus-within{outline:2px solid #f1cd85;outline-offset:3px}.tpl-app[aria-busy=true] .tpl-upload{cursor:wait}

.tpl-design-viewer{box-sizing:border-box;width:min(1500px,96vw);max-width:96vw;max-height:94dvh;padding:52px 24px 20px;border:0;border-radius:0;background:transparent;color:#f8ecd4;overflow:auto;box-shadow:none}
.tpl-design-viewer::backdrop{background:#020d09ed}
.tpl-viewer-stage{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:12px}
.tpl-viewer-stage img{grid-column:2;width:100%;max-height:calc(94dvh - 80px);object-fit:contain;display:block;min-height:0;border-radius:0}
.tpl-design-viewer button{display:grid;place-items:center;width:44px;height:44px;border:1px solid #c6aa6b88;border-radius:50%;background:#173a2d;color:#efd197;font:30px/1 Arial;cursor:pointer}
.tpl-design-viewer button:disabled{opacity:.3}
.tpl-design-viewer button[hidden]{display:none}
.tpl-viewer-prev{grid-column:1;grid-row:1}.tpl-viewer-next{grid-column:3;grid-row:1}
.tpl-viewer-close{position:absolute;right:14px;top:10px}
.tpl-viewer-count{text-align:center;font-weight:600;margin:14px 0 6px}
.tpl-viewer-caption{text-align:center;font-size:14px;line-height:1.5;margin:0;color:#c9d8ce}
.tpl-design-viewer :focus-visible{outline:2px solid #efd197;outline-offset:4px}
.tpl-design-frame>img[role=button]{cursor:zoom-in}
@media(max-width:600px){.tpl-design-viewer{padding:60px 10px 18px;width:98vw;max-width:98vw}.tpl-viewer-stage{grid-template-columns:30px minmax(0,1fr) 30px;gap:5px}.tpl-viewer-stage button{width:30px;height:38px}.tpl-viewer-caption{font-size:12px}}
.tpl-app fieldset.tpl-stakes-placement{padding:0;border:0;margin:22px 0}
.tpl-stakes-placement>label{display:flex;align-items:center;gap:10px;margin:12px 0;cursor:pointer;line-height:1.5}
.tpl-stakes-placement input[type=checkbox]{width:18px;height:18px;flex:0 0 18px;accent-color:#edc77d}
.tpl-stakes-placement legend small{display:block;font-size:13px;font-weight:400;margin-top:4px}

.tpl-design-viewer .tpl-viewer-count,.tpl-design-viewer .tpl-viewer-caption{display:none}

/* Separate location selection from color disclosure. */
.tpl-app .tpl-area-header>label{flex:0 0 auto}
.tpl-app .tpl-area-header>.tpl-area-name{flex:1;width:auto;min-width:0;margin:0;padding:5px 0;background:transparent!important;border:0!important;box-shadow:none!important;color:inherit;font:inherit;text-align:left;cursor:pointer}
.tpl-app .tpl-area-name:focus-visible{outline:2px solid #f1cd85;outline-offset:3px}

.tpl-app .tpl-quote-confirmation{margin:30px 0;padding:28px 32px;border:1px solid #c9ad6c;border-radius:14px;background:#15372b;color:#fff2d6;font:500 clamp(18px,2vw,23px)/1.6 Arial,sans-serif;scroll-margin-top:260px}
.tpl-app .tpl-quote-confirmation[hidden]{display:none}