/* Interface styling only. Logo assets, artwork and export geometry retain their original rendering. */
:root {--accent-soft:#8faed4;--green:#9ecab6;--red:#e9a2a8}
.vi-page {width:min(1320px,calc(100% - 64px));padding-top:48px}
.vi-intro {gap:40px;border-color:#ffffff12;padding-bottom:32px}
.vi-intro h1 {font-size:clamp(46px,6vw,76px);font-weight:500;letter-spacing:-.05em;line-height:1.1}
.intro-desc {color:#a8b4c7;font-size:12px;line-height:1.9;margin-top:20px}
.vi-download-btn,.preview-badge,.pdf-download-link {background:linear-gradient(145deg,#d3e0f43b,#758bab1f 48%,#a1b6d32e);border:1px solid #d3e1f635;color:#dce5f2;border-radius:12px;box-shadow:inset 0 1px 1px #f2f8ff25;font-weight:400}
.vi-download-btn {font-size:12px;border-radius:24px;padding:12px 18px}.vi-download-btn:hover,.pdf-download-link:hover {background:#ffffff16;color:#fff}.vi-download-hint {font-size:10px}
.vi-tabs {width:max-content;max-width:100%;border:1px solid #ffffff18;border-radius:26px;padding:5px;background:#171e29b8;gap:4px}
.vi-tab {border:0;border-radius:22px;padding:9px 22px;font-size:12px;font-weight:400;margin:0}.vi-tab.active {background:#e8edf5;color:#1a2230;border:0}
.vi-tab:hover {background:#ffffff09}.vi-tab.active:hover {background:#f2f5fa}
.vi-workspace {gap:20px;margin-top:24px}
.vi-card,.vi-preview,.pdf-modal-content,.warn-modal-box {background:#111419;border:1px solid #ffffff18;border-radius:14px;box-shadow:inset 0 1px 0 #ffffff04}
.vi-card-head {background:#ffffff02;font-size:13px;border-color:#ffffff12}.vi-card-head strong {font-weight:500}
.vi-upload-zone {background:#ffffff03;border:1px dashed #8faed448;border-radius:12px;transition:background .25s,border-color .25s,box-shadow .25s}
.vi-upload-zone:hover,.vi-upload-zone.drag {background:radial-gradient(ellipse at 50% 20%,#4284f624,transparent 75%),#151b25;border-color:#74a5f380;box-shadow:0 0 22px #2a64c214}
.vi-upload-zone strong,.empty-canvas strong {font-weight:500}.upload-icon {color:#b9cde9}
.vi-poster-info,.spec-item,.vi-notice {background:#ffffff04;border-color:#ffffff18;color:#a8b4c7;font-size:12px}
.info-row strong,.spec-item strong {color:#dce5f2;font-weight:500}.ctrl-label {font-size:12px;font-weight:500}.ctrl-label output {font-weight:500}
.logo-option,.fmt-template-option {background:#19212d;color:#edf2fa;border:1px solid #ffffff1d}
.logo-option:hover,.fmt-template-option:hover {border-color:#74a5f380}
.logo-option.active,.fmt-template-option.active {background:#253347;border-color:#a8c8f2;box-shadow:0 0 0 2px #8fafd925}
.logo-option.active::after {background:#dce8fa;color:#172334}.logo-name,.fmt-template-name {font-weight:500}
/* Keep logo swatches and design previews neutral for accurate artwork assessment. */
.logo-preview {background:#fff}.preview-info {color:#a8b4c7;font-size:12px}.preview-badge {font-size:10px}
.canvas-wrap {background:repeating-conic-gradient(#27303d 0% 25%,#202733 0% 50%) 50% / 20px 20px}
.vi-notice {line-height:1.85}.vi-foot {background:#090b0e;border-color:#ffffff12;font-size:11px}
.btn-dark:hover {background:#fff;color:#1a2230;border-color:#fff}.btn-dark:disabled {background:#e8edf5;border-color:#e8edf5;color:#1a2230;opacity:.35}
.fmt-file-item {background:#ffffff05}.fmt-text-input {background:#ffffff06;color:#edf2fa;border-color:#ffffff20;border-radius:10px;font-size:12px}
.fmt-text-label {font-size:12px;font-weight:500}.fmt-process-btn {font-size:13px;font-weight:500}.fmt-file-item .fmt-file-rm:hover {background:#ffffff09}
.pdf-modal,.warn-modal {background:#070b12d9;backdrop-filter:blur(12px)}.pdf-modal-close:hover {background:#ffffff09}.warn-modal-msg {color:#a8b4c7}.warn-modal-btn {background:#e8edf5;color:#1a2230;border-radius:22px;font-weight:500}
.loading-overlay {background:radial-gradient(ellipse at top,#294366,#090b0e 75%)}.loading-text {color:#a8b4c7}.loading-spinner {border-color:#8faed425;border-top-color:#b9cde9}.loading-progress {background:#ffffff12}
@media(max-width:760px) {.vi-page {width:calc(100% - 28px);padding-top:30px}.vi-intro {gap:24px}.vi-intro h1 {font-size:48px}.vi-tab {padding:9px 16px}.vi-preview {padding:14px}.vi-workspace {gap:16px}.pdf-modal {padding:12px}}
@media(prefers-reduced-motion:reduce) {.vi-upload-zone {transition:none}}

/* Give the joint logo workbench breathing room below navigation. */
#tab-joint-logo{padding-top:32px}
@media(max-width:640px){#tab-joint-logo{padding-top:24px}}

.format-joint-controls select{display:block;width:100%;margin:10px 0 18px;padding:12px;border:1px solid #afc5e333;border-radius:12px;background:#101c2a;color:#e9f0fb}.format-joint-controls .joint-check{display:flex;align-items:center;gap:10px;margin:12px 0}.format-joint-controls input[type=checkbox]{accent-color:#accdf7}.format-joint-controls p{font-size:12px;line-height:1.8;color:#a7bad1}.format-joint-controls [hidden]{display:none!important}.format-joint-controls .vi-upload-zone{margin:8px 0 18px}

/* Center navigation between the intro divider and the lower divider. */
.vi-tabs-row{margin-top:0;padding-block:28px;align-items:center}
@media(max-width:640px){.vi-tabs-row{padding-block:20px;align-items:stretch}}

#tab-activity-a{padding-top:32px}
@media(max-width:640px){#tab-activity-a{padding-top:24px}}

/* Lightweight poster assembly loader; progress is still driven by loadTracker. */
.loading-box{width:min(340px,calc(100vw - 48px))}
.loading-studio{position:relative;width:250px;height:250px;margin:0 auto 26px}
.loading-orbit{position:absolute;inset:12px;border:1px dashed #a7c9f32b;border-radius:50%;animation:studio-orbit 24s linear infinite}
.loading-paper{position:absolute;top:22px;left:57px;width:136px;height:178px;border:1px solid #bdd8f85c;border-radius:13px;background:linear-gradient(145deg,#29445d,#142333);box-shadow:0 20px 50px #0004,inset 0 1px #fff2;overflow:hidden;animation:studio-float 3.6s ease-in-out infinite}
.loading-paper-index{position:absolute;left:14px;top:15px;font:7px Arial,sans-serif;letter-spacing:1.2px;color:#b3c9df}
.loading-art{position:absolute;left:14px;top:39px;width:106px;height:75px;border-radius:6px;background:linear-gradient(135deg,#83a6cf55,#324e7022);border:1px solid #9fbddd33}
.loading-art:before,.loading-art:after{content:'';position:absolute;border:1px solid #c3deff7a;border-radius:50%;width:44px;height:44px;top:14px;left:16px}.loading-art:after{left:44px;border-color:#9dccb67a}
.loading-copy{position:absolute;left:14px;top:140px;width:55px;height:4px;border-radius:3px;background:#95adc15c}.loading-copy-long{top:127px;width:90px;background:#c2d9ed99}
.loading-stamp{position:absolute;right:9px;top:31px;display:flex;align-items:center;gap:7px;background:#d7e9ff;color:#183049;border-radius:6px;padding:8px 9px;font:700 9px Arial,sans-serif;box-shadow:0 5px 18px #0003;animation:studio-stamp 3.6s cubic-bezier(.2,.7,.2,1) infinite}.loading-stamp span{color:#326c59}
.loading-scan{position:absolute;top:28px;left:0;right:0;height:2px;background:#cae4ff99;box-shadow:0 0 16px #acd1ff;animation:studio-scan 3.6s ease-in-out infinite}
.loading-spark{position:absolute;color:#bbd9ff;animation:studio-spark 3.6s ease-in-out infinite}.spark-one{right:23px;top:49px;font-size:23px}.spark-two{left:20px;top:149px;font-size:19px;animation-delay:.5s}
.loading-studio-caption{position:absolute;bottom:0;left:0;right:0;color:#9db5ce;font-size:11px;letter-spacing:3px}
.loading-text{font-size:16px;letter-spacing:.04em;color:#e1ecf8;margin-bottom:22px}
.loading-progress{height:3px;width:220px}.loading-progress-bar{background:linear-gradient(90deg,#6484ad,#c8e2ff)}.loading-pct{color:#91acc9;margin-top:12px;font-size:12px}
.loading-overlay.hidden .loading-studio *{animation-play-state:paused}
@keyframes studio-orbit{to{transform:rotate(360deg)}}
@keyframes studio-float{0%,100%{transform:translateY(3px) rotate(-5deg)}50%{transform:translateY(-5px) rotate(0deg)}}
@keyframes studio-stamp{0%,15%{opacity:0;transform:translate(30px,-25px) rotate(12deg) scale(1.2)}38%,78%{opacity:1;transform:translate(0,0) rotate(-4deg) scale(1)}100%{opacity:0;transform:translateY(0) scale(.95)}}
@keyframes studio-scan{0%,12%{opacity:0;transform:translateY(0)}25%{opacity:.7}65%{opacity:0;transform:translateY(135px)}100%{opacity:0;transform:translateY(135px)}}
@keyframes studio-spark{0%,25%,100%{opacity:.15;transform:scale(.7)}50%,65%{opacity:.85;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.loading-studio *{animation:none!important}.loading-scan{display:none}}