@font-face { font-family: Inter; src: local('Inter'); }
:root {
  color-scheme: dark;
  --lp-bg: #0c1729;
  --lp-panel: #13233a;
  --lp-raised: #1a2e49;
  --lp-input: #0e1d32;
  --lp-border: #2b415e;
  --lp-ink: #eef4ff;
  --lp-muted: #a8bad3;
  --lp-accent: #98c4ff;
  --lp-success: #9cddc8;
  --lp-warning: #eed09b;
  --lp-radius: 14px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font: 14px/1.5 Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color: var(--lp-ink); background: var(--lp-bg); -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .45; }
:is(button,a,input,select,textarea):focus-visible { outline: 2px solid #97c7ff; outline-offset: 3px; }
[hidden] { display: none !important; }
a { color: var(--lp-accent); text-decoration: none; }
svg { width: 20px; height: 20px; flex-shrink: 0; vertical-align: middle; }
h1, h2, h3, p { margin-top: 0; }
.skip-link { position: fixed; left: 250px; top: -60px; z-index: 1000; padding: 12px 20px; background: var(--lp-raised); border: 1px solid var(--lp-accent); border-radius: 8px; }
.skip-link:focus { top: 12px; }
.lp-sidebar { position: fixed; inset: 0 auto 0 0; width: 232px; padding: 28px 16px 20px; display: flex; flex-direction: column; z-index: 25; background: linear-gradient(170deg,#122b4c,#0e2038 72%); border-right: 1px solid var(--lp-border); overflow-y: auto; }
.lp-brand { display: flex; align-items: center; gap: 10px; padding: 0 10px; color: var(--lp-ink); letter-spacing: -1px; font-size: 26px; font-weight: 750; }
.lp-brand img { width: 37px; height: 37px; object-fit: contain; }
.lp-workspace { margin: 30px 0 23px; padding: 13px 11px; display: flex; align-items: center; gap: 11px; border: 1px solid #2f4867; border-radius: 10px; background: #ffffff04; }
.lp-workspace>div { min-width: 0; }
.workspace-avatar { width: 32px; height: 32px; flex: none; display: grid; place-items: center; background: #274566; color: #cae1ff; border: 1px solid #3a6086; border-radius: 9px; font-size: 13px; font-weight: 650; }
.lp-workspace strong { display: block; font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.lp-workspace small { display: block; color: var(--lp-muted); font-size: 11px; margin-top: 2px; }
.lp-sidebar button { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left; padding: 12px; border: 1px solid transparent; background: transparent; color: #b6cae5; border-radius: 8px; margin-bottom: 5px; font-size: 13px; font-weight: 500; }
.lp-sidebar button svg { width: 18px; height: 18px; }
.lp-sidebar button:hover { background: #24426277; color: #fff; }
.lp-sidebar button.active { background: #254a75; border-color: #37628e; color: #fff; box-shadow: inset 3px 0 #83b9ff; }
.nav-count { margin-left: auto; font-size: 11px; border-radius: 5px; background: #ffffff0c; padding: 1px 7px; }
.nav-divider { border-top: 1px solid var(--lp-border); margin: 23px 10px; }
.sidebar-bottom { margin-top: auto; padding-top: 24px; }
.sidebar-bottom button { margin-bottom: 0; }
.lp-shell { margin-left: 232px; min-height: 100vh; background: radial-gradient(ellipse at 85% 0,#19355540,transparent 55%),var(--lp-bg); }
.lp-topbar { height: 65px; border-bottom: 1px solid var(--lp-border); background: #0e1b2fe8; display: flex; align-items: center; justify-content: space-between; padding: 0 34px; position: sticky; top: 0; backdrop-filter: blur(16px); z-index: 20; }
.breadcrumb { display: flex; align-items: center; gap: 14px; font-size: 12px; min-width: 0; }
.breadcrumb>span { color: #94aaca; }
.breadcrumb strong { font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crumb-slash { color: #557493 !important; }
.quiet-button { display: inline-flex; align-items: center; gap: 7px; border: 1px solid transparent; border-radius: 7px; padding: 7px 10px; background: transparent; color: #c0d3ed; font-size: 12px; }
.quiet-button:hover { background: var(--lp-raised); border-color: var(--lp-border); }
.quiet-button svg { width: 17px; height: 17px; }
#workspace { padding: 32px 34px 48px; max-width: 1600px; margin: auto; min-height: calc(100vh - 65px); }
.lp-page-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 28px; }
.lp-page-heading h1 { margin: 0 0 9px; font-size: clamp(26px,2.3vw,34px); line-height: 1.2; font-weight: 680; letter-spacing: -.9px; color: var(--lp-ink); }
.lp-page-heading p { margin: 0; font-size: 13px; line-height: 1.65; color: var(--lp-muted); }
.lp-heading-actions { display: flex; gap: 8px; flex-shrink: 0; }
.lp-app .lp-button { display: inline-flex; justify-content: center; align-items: center; gap: 8px; min-height: 40px; padding: 10px 14px; border: 1px solid #3b5371; border-radius: 8px; background: #1a2e48; color: #d8e7fa; font-size: 12px; font-weight: 580; line-height: 1.3; box-shadow: none; transition: background .15s,border-color .15s; }
.lp-app .lp-button:hover { background: #243e5f; border-color: #6387b2; }
.lp-button svg { width: 17px; height: 17px; }
.lp-app .lp-button.primary { background: linear-gradient(115deg,#337ce9,#2462d0); border-color: #528de9; color: #fff; box-shadow: 0 3px 10px #07112440; }
.lp-app .lp-button.primary:hover { background: #347df0; border-color: #85b4ff; }
.lp-app .lp-button.subtle { background: #24405e; border-color: #3a5a7c; color: #c1ddff; }
.lp-app .text-button { padding: 6px 3px; min-height: 32px; border-color: transparent; background: transparent; color: var(--lp-accent); box-shadow: none; }
.lp-app .text-button:hover { background: #9fc6ff0b; border-color: transparent; }
.lp-button.wide { width: 100%; }
.lp-status-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-bottom: 24px; }
.lp-status-grid article { padding: 18px 22px; background: var(--lp-panel); border: 1px solid var(--lp-border); border-radius: 12px; }
.lp-status-grid article>span { display: flex; align-items: center; gap: 8px; color: #c0d0e6; font-size: 12px; }
.lp-status-grid article svg { width: 17px; color: #8bb9f3; }
.lp-status-grid article>strong { display: block; font-size: 28px; font-weight: 650; margin: 10px 0 3px; letter-spacing: -.7px; }
.lp-status-grid em { font-size: 15px; font-style: normal; font-weight: 400; color: var(--lp-muted); }
.lp-status-grid small { font-size: 11px; color: var(--lp-muted); }
.lp-desk-grid { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(280px,1fr); gap: 20px; }
.lp-upload-panel { position: relative; padding: 30px; border: 1px solid #365c88; border-radius: var(--lp-radius); background: radial-gradient(ellipse at 95% 0,#2875b93b,transparent 66%),linear-gradient(125deg,#19395f,#122944); display: flex; align-items: flex-start; flex-direction: column; justify-content: center; }
.upload-paper { display: grid; place-items: center; width: 50px; height: 50px; border: 1px solid #5c90bf66; border-radius: 13px; background: #5586b821; color: #a9d4ff; margin-bottom: 23px; }
.upload-paper svg { width: 25px; height: 25px; }
.lp-upload-panel h2 { font-size: clamp(23px,2.1vw,30px); font-weight: 650; line-height: 1.25; color: #f0f6ff; letter-spacing: -.7px; margin: 0 0 13px; }
.lp-upload-panel p { font-size: 13px; line-height: 1.75; color: #bdd0e9; max-width: 43ch; margin: 0 0 24px; }
.lp-upload-actions { display: flex; align-items: center; gap: 13px; flex-wrap: wrap; }
.lp-upload-actions>span { font-size: 12px; color: #adc5e2; }
.lp-upload-panel .lp-upload-note { font-size: 11px; margin: 18px 0 0; color: #a7bfdd; }
[data-dropzone].drag-over { outline: 2px solid #8fc2ff; outline-offset: 3px; background: #21476f; }
.lp-next-panel { padding: 26px; border: 1px solid var(--lp-border); border-radius: var(--lp-radius); background: var(--lp-panel); }
.lp-next-panel h2 { font-size: 17px; font-weight: 650; letter-spacing: -.2px; margin: 0 0 23px; }
.lp-next-panel ol { list-style: none; padding: 0; margin: 0 0 24px; }
.lp-next-panel li { display: flex; align-items: flex-start; gap: 13px; position: relative; padding-bottom: 23px; }
.lp-next-panel li:last-child { padding-bottom: 0; }
.lp-next-panel li:not(:last-child)::after { content: ''; position: absolute; top: 33px; bottom: 5px; left: 14px; width: 1px; background: #344c6c; }
.lp-next-panel li>b { width: 29px; height: 29px; flex: none; display: grid; place-items: center; border-radius: 50%; border: 1px solid #3e5c81; background: #203959; color: #accfff; font-size: 12px; font-weight: 600; }
.lp-next-panel strong { display: block; font-size: 13px; color: #dfebfc; font-weight: 580; }
.lp-next-panel small { display: block; font-size: 12px; color: var(--lp-muted); margin-top: 4px; }
.lp-recent { margin-top: 30px; }
.lp-section-title { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 15px; }
.lp-section-title h2 { font-size: 17px; font-weight: 620; letter-spacing: -.25px; margin: 0; }
.lp-section-title p,.lp-section-title>span { font-size: 12px; color: var(--lp-muted); margin: 5px 0 0; }
.lp-product-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.beta-root button.lp-product { padding: 0; border: 1px solid var(--lp-border); border-radius: 12px; overflow: hidden; text-align: left; display: block; background: var(--lp-panel); color: var(--lp-ink); box-shadow: 0 4px 18px #050d1b15; }
.beta-root button.lp-product:hover { border-color: #648ab8; background: #172b46; }
.lp-product-art { height: 175px; background: #1e3048; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; border-bottom: 1px solid var(--lp-border); }
.lp-product-art img { height: 80%; max-width: 84%; object-fit: contain; }
.lp-product-art>svg { width: 34px; height: 34px; color: #84a8d3; }
.lp-output-label { position: absolute; top: 12px; left: 12px; letter-spacing: .5px; font-size: 9px; font-weight: 600; padding: 4px 7px; background: #0c1b30d9; color: #bad2ef; border: 1px solid #3c5676; border-radius: 4px; }
.lp-product-body { padding: 17px; display: grid; grid-template-columns: minmax(0,1fr) 18px; gap: 8px; }
.lp-product-body strong { font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.lp-product-body small { display: block; font-size: 11px; color: var(--lp-muted); margin-top: 5px; overflow-wrap: anywhere; }
.lp-card-arrow svg { width: 16px; color: var(--lp-accent); }
.lp-product-meta { grid-column: 1/-1; display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 9px; font-size: 11px; color: var(--lp-muted); flex-wrap: wrap; }
.lp-pill { font-size: 10px; font-weight: 550; border-radius: 5px; padding: 4px 8px; border: 1px solid #3e5777; background: #203653; color: #bed4f2; white-space: nowrap; }
.lp-pill.saved { background: #173d38; border-color: #2e5b51; color: var(--lp-success); }
.lp-pill.needs { background: #3d3224; border-color: #685436; color: var(--lp-warning); }
.decal-sample { font: italic 29px Georgia,serif; color: #cee3ff; }
.decal-sample i { font-size: 18px; color: #9bc4f2; }
.lp-job-list { border: 1px solid var(--lp-border); background: var(--lp-panel); border-radius: 12px; overflow: hidden; }
.beta-root .lp-job-list button { padding: 18px 20px; display: flex; width: 100%; gap: 15px; text-align: left; border: 0; border-radius: 0; border-bottom: 1px solid var(--lp-border); background: transparent; align-items: center; }
.beta-root .lp-job-list button:last-child { border-bottom: 0; }
.beta-root .lp-job-list button:hover { background: #1b324f; }
.lp-job-icon,.lp-setting-icon { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border: 1px solid #365577; border-radius: 9px; background: #223e5d; color: #abd1ff; }
.lp-job-icon svg { width: 18px; }
.lp-job-name { flex: 1; min-width: 0; }
.lp-job-name strong { display: block; font-size: 13px; font-weight: 550; color: var(--lp-ink); overflow-wrap: anywhere; }
.lp-job-name small { display: block; font-size: 11px; color: var(--lp-muted); margin-top: 5px; }
.lp-job-list button>svg { width: 16px; color: var(--lp-accent); }
.lp-inline-empty { padding: 30px; background: #13233a80; border: 1px dashed #385576; color: var(--lp-muted); font-size: 13px; line-height: 1.7; border-radius: 12px; grid-column: 1/-1; text-align: center; }
.lp-empty { text-align: center; padding: 36px 20px; }
.lp-empty>svg { width: 36px; height: 36px; color: #9bc4f5; margin-bottom: 18px; }
.lp-empty h2 { font-size: 22px; }
.lp-empty p { color: var(--lp-muted); line-height: 1.7; font-size: 13px; max-width: 480px; margin: 0 auto 24px; }
.lp-paper-panel,.lp-current-job { background: var(--lp-panel); border: 1px solid var(--lp-border); border-radius: var(--lp-radius); padding: 26px; }
.lp-paper-panel h2 { font-size: 18px; font-weight: 600; }
.lp-paper-panel p,.lp-muted { font-size: 13px; color: var(--lp-muted); line-height: 1.75; }
.lp-tip { display: flex; align-items: flex-start; gap: 14px; background: #142b44; border: 1px solid #2e4d6d; border-radius: 12px; padding: 20px 24px; margin: 22px 0 30px; color: #9dc4f2; }
.lp-tip strong { font-size: 13px; color: #d2e5ff; }
.lp-tip p { font-size: 12px; line-height: 1.8; margin: 6px 0 10px; color: var(--lp-muted); max-width: 760px; }
.lp-tip a { font-size: 12px; }
.lp-tip a svg { width: 14px; }
.lp-source-table { border: 1px solid var(--lp-border); border-radius: 12px; background: var(--lp-panel); overflow: hidden; }
.lp-source-table>div { display: flex; align-items: center; gap: 22px; padding: 16px 20px; border-bottom: 1px solid var(--lp-border); }
.lp-source-table>div:last-child { border-bottom: 0; }
.lp-source-table strong { font-size: 13px; flex: 1; overflow-wrap: anywhere; min-width: 0; }
.lp-source-table span { font-size: 12px; color: var(--lp-muted); }
.lp-setting-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.lp-setting-icon { margin-bottom: 18px; }
.lp-loading { padding: 80px 20px; color: var(--lp-muted); display: flex; align-items: center; gap: 12px; justify-content: center; }
.lp-alert { padding: 14px 18px; margin-bottom: 20px; border: 1px solid #3f6796; background: #1b3656; border-radius: 9px; color: #c6dfff; font-size: 13px; }
.lp-current-job { margin-top: 28px; }
.lp-library-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 22px; }
.lp-search { display: flex; align-items: center; gap: 10px; border: 1px solid #49617e; border-radius: 8px; padding: 0 13px; width: min(100%,370px); background: var(--lp-input); color: #9cb9dd; }
.lp-search svg { width: 17px; }
.lp-search:focus-within { border-color: #99c4ff; box-shadow: 0 0 0 2px #71a7fa22; }
.lp-app .lp-search input { border: 0; background: transparent; box-shadow: none; padding: 12px 0; color: var(--lp-ink); width: 100%; font-size: 13px; }
.lp-library-toolbar>span { font-size: 12px; color: var(--lp-muted); white-space: nowrap; }
.lp-pagination { display: flex; align-items: center; gap: 20px; margin-top: 25px; color: var(--lp-muted); font-size: 12px; }
.lp-pagination label { display: flex; align-items: center; gap: 10px; margin-left: auto; white-space: nowrap; }
.lp-pagination select { padding: 7px 10px; background: var(--lp-input); border: 1px solid #49617e; border-radius: 6px; color: var(--lp-ink); }
.lp-pagination>div { display: flex; gap: 12px; align-items: center; }
.lp-customer-form { display: grid; gap: 20px; }
.lp-customer-form label { display: grid; gap: 8px; }
.lp-invite { padding: 20px; background: var(--lp-raised); border-radius: 9px; }
.lp-invite input { width: 100%; padding: 12px; }
.lp-customer-row { display: flex; align-items: center; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--lp-border); }
.lp-customer-row:last-child { border: 0; }
.lp-customer-row>div { flex: 1; min-width: 0; }
.lp-customer-row strong { display: block; font-size: 13px; }
.lp-customer-row small { display: block; font-size: 12px; color: var(--lp-muted); margin-top: 5px; overflow-wrap: anywhere; }
.lp-example-note { font-size: 12px; color: var(--lp-muted); border-bottom: 1px solid var(--lp-border); padding-bottom: 12px; margin-bottom: 23px; display: flex; align-items: center; justify-content: space-between; gap: 15px; }
@media (min-width:1550px) { #workspace { padding: 40px 48px; } .lp-product-art { height: 200px; } }
@media (max-width:1150px) {
  .lp-sidebar { width: 210px; padding-inline: 12px; }
  .lp-shell { margin-left: 210px; }
  .lp-brand { font-size: 24px; }
  .lp-heading-actions { flex-wrap: wrap; }
  .lp-page-heading { align-items: flex-start; }
  #workspace { padding: 28px 24px; }
  .lp-topbar { padding-inline: 24px; }
  .lp-desk-grid { grid-template-columns: minmax(0,1.2fr) minmax(260px,1fr); }
  .lp-upload-panel,.lp-next-panel { padding: 24px; }
  .lp-product-grid { gap: 12px; }
}
@media (max-width:900px) {
  .lp-sidebar { width: 70px; padding: 22px 10px 15px; }
  .lp-brand { padding: 0; justify-content: center; }
  .lp-brand>span,.lp-workspace,.lp-sidebar .nav-label,.nav-count { display: none; }
  .lp-sidebar nav { margin-top: 28px; }
  .lp-sidebar button { justify-content: center; gap: 0; padding: 12px; }
  .nav-divider { margin: 20px 5px; }
  .lp-shell { margin-left: 70px; }
  .lp-setting-grid { grid-template-columns: 1fr; }
  .lp-product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lp-source-table>div { flex-wrap: wrap; gap: 12px; }
  .lp-source-table strong { flex-basis: 65%; }
  .skip-link { left: 80px; }
}
@media (max-width:650px) {
  #workspace { padding: 23px 16px 35px; }
  .lp-topbar { height: 58px; padding-inline: 16px; }
  .breadcrumb { gap: 8px; font-size: 11px; }
  .breadcrumb>span { display: none; }
  .lp-page-heading { flex-direction: column; gap: 16px; }
  .lp-page-heading h1 { font-size: 27px; }
  .lp-desk-grid,.lp-product-grid,.lp-status-grid { grid-template-columns: 1fr; }
  .lp-status-grid { gap: 10px; }
  .lp-status-grid article { display: grid; grid-template-columns: 1fr auto; gap: 6px; padding: 16px; }
  .lp-status-grid article>strong { grid-column: 2; grid-row: 1/3; margin: 0; font-size: 25px; }
  .lp-status-grid article small { grid-column: 1; }
  .lp-upload-panel,.lp-next-panel,.lp-paper-panel,.lp-current-job { padding: 22px 18px; }
  .lp-paper-panel>.lp-section-title { flex-direction: column; align-items: flex-start; }
  .lp-pagination { flex-wrap: wrap; gap: 15px; }
  .lp-pagination>div { width: 100%; justify-content: space-between; }
  .lp-library-toolbar { flex-wrap: wrap; gap: 9px; }
  .lp-job-list button { flex-wrap: wrap; padding: 15px !important; gap: 10px !important; }
  .lp-job-name { flex-basis: calc(100% - 50px); }
  .lp-job-list .lp-pill { margin-left: 46px; }
  .lp-tip { padding: 18px; }
  .lp-customer-row { flex-wrap: wrap; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } *,*::before,*::after { transition: none !important; animation: none !important; } }

/* Before the first packing slip: one focused, full-screen starting point. */
.lp-startup .lp-sidebar, .lp-startup .lp-topbar,
.lp-first-upload .lp-sidebar, .lp-first-upload .lp-topbar { display: none; }
.lp-app:is(.lp-startup,.lp-first-upload) .lp-shell { margin: 0; min-height: 100svh; background: radial-gradient(ellipse at 50% 14%,#234b7a44,transparent 60%),linear-gradient(140deg,#10223b,#0b172a 65%,#10223b); }
.lp-app:is(.lp-startup,.lp-first-upload) #workspace { max-width: none; padding: 0; margin: 0; }
.lp-startup .lp-loading { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 100svh; }
.lp-first-upload .skip-link,.lp-startup .skip-link { left: 24px; }
.lp-welcome-frame { min-height: 100svh; display: flex; flex-direction: column; }
.lp-welcome-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 28px clamp(24px,4vw,72px); }
.lp-welcome-brand { display: inline-flex; align-items: center; gap: 11px; text-decoration: none; color: #f4f8ff !important; font-size: 27px; font-weight: 740; letter-spacing: -.9px; }
.lp-welcome-brand img { padding: 5px; border-radius: 12px; background: #edf5ff; }
.lp-app .lp-button.lp-welcome-exit { color: #93abc9; min-width: 40px; min-height: 40px; padding: 10px; border-color: #3c597d50; background: transparent; border-radius: 12px; }
.lp-app .lp-button.lp-welcome-exit:hover { background: #25446a55; color: #e7f2ff; border-color: #6e92be; }
.lp-welcome-content { width: min(100%,760px); margin: auto; padding: 42px 24px 44px; text-align: center; }
.lp-welcome-eyebrow { margin: 0 0 20px; color: #91b9ed; text-transform: uppercase; letter-spacing: .19em; font-size: 11px; font-weight: 650; }
.lp-welcome-content h1 { margin: 0; font-size: clamp(38px,4.5vw,64px); font-weight: 650; letter-spacing: -.05em; line-height: 1.12; color: #f4f8ff; outline: none; }
.lp-welcome-content h1 span { color: #a5ceff; }
.lp-welcome-intro { margin: 24px auto 0; max-width: 50ch; font-size: 16px; line-height: 1.8; color: #aabed8; }
.lp-welcome-upload { display: flex; flex-direction: column; align-items: center; margin: 38px auto 0; padding: 26px 28px 24px; max-width: 500px; border: 1px dashed #6089bc66; border-radius: 20px; background: #19325033; transition: border-color .18s,background .18s; }
.lp-welcome-file { width: 48px; height: 59px; position: relative; display: grid; place-items: center; color: #91b9e8; margin-bottom: 24px; }
.lp-welcome-file>svg { width: 48px; height: 59px; stroke-width: 1.15; }
.lp-welcome-file>span { position: absolute; bottom: 11px; left: 0; border-radius: 4px; background: #24486e; color: #c6e1ff; padding: 2px 5px; font-size: 9px; letter-spacing: .08em; font-weight: 700; }
.lp-welcome-file>i { position: absolute; right: -9px; top: -2px; width: 24px; height: 24px; border: 1px solid #638bb4; border-radius: 50%; display: grid; place-items: center; background: #15304f; }
.lp-welcome-file>i svg { width: 13px; height: 13px; }
.lp-app .lp-button.lp-welcome-choose { min-height: 52px; padding: 14px 25px; border-radius: 11px; font-size: 15px; font-weight: 600; box-shadow: 0 5px 22px #03102544; }
.lp-welcome-choose svg { width: 20px; height: 20px; }
.lp-welcome-drop { margin: 15px 0 0; color: #b3c7e1; font-size: 13px; }
.lp-welcome-format { margin-top: 8px; color: #8aa5c5; font-size: 11px; }
.lp-welcome-content.drag-over { outline: none; background: transparent; }
.lp-welcome-content.drag-over .lp-welcome-upload { border-color: #9ccaff; background: #284e784f; box-shadow: 0 0 0 4px #77aaff15; }
.lp-welcome-saving { display: flex; align-items: center; justify-content: center; gap: 9px; margin: 22px 0 0; color: #bbd8fa; }
.lp-welcome-spinner { width: 15px; height: 15px; border: 2px solid #446482; border-top-color: #bedcff; border-radius: 50%; animation: lp-welcome-spin 1s linear infinite; }
@keyframes lp-welcome-spin { to { transform: rotate(360deg); } }
.lp-welcome-error { display: flex; gap: 10px; max-width: 500px; margin: 20px auto 0; padding: 14px 16px; text-align: left; background: #45273866; border: 1px solid #a36c7d88; border-radius: 12px; color: #ffd9e2; }
.lp-welcome-error>svg { width: 18px; height: 18px; flex: none; margin-top: 2px; }
.lp-welcome-error strong { font-size: 13px; }
.lp-welcome-error p { font-size: 12px; line-height: 1.6; margin: 5px 0 0; color: #e0bcc9; }
.lp-welcome-unavailable .lp-button { margin-top: 25px; }
@media (max-width:600px) {
 .lp-welcome-header { padding: 22px; }
 .lp-welcome-brand { font-size: 23px; gap: 9px; }
 .lp-welcome-brand img { width: 38px; height: 38px; }
 .lp-welcome-content { padding: 40px 22px 60px; }
 .lp-welcome-intro { font-size: 14px; }
 .lp-welcome-break { display: none; }
 .lp-welcome-upload { margin-top: 30px; padding: 24px 15px; }
 .lp-welcome-format { font-size: 10px; }
 .lp-app .lp-button.lp-welcome-choose { font-size: 14px; padding-inline: 20px; }
}