/* Pack-only workspace: warm paper, useful motion, no Studio overrides. */
.home-view .pack-team { background:linear-gradient(155deg,#fff5e7 0%,#fff 65%); border-color:#ff7900; box-shadow:0 15px 45px #ff79001f; }
.home-view .pack-team .pack-highlight { background:#ff7900; color:#07111b; font-size:11px; padding:12px; }
.home-view .pack-team .pack-garments { height:160px; gap:22px; position:relative; }
.home-view .pack-team .pack-garments img { width:145px; height:156px; filter:drop-shadow(0 13px 10px #ad4d0026); }
.home-view .pack-team .pack-garments::before { content:"6 + 4"; position:absolute; right:5%; top:0; font:800 13px var(--font-body); color:#9a4000; background:#ffebd1; padding:8px 12px; border-radius:40px; transform:rotate(7deg); }
.home-view .pack-team .pack-team-invitation { margin:16px auto 20px; max-width:280px; color:#69513a; font-size:14px; line-height:1.5; }
.home-view .pack-team .pack-choose { background:#07111b; box-shadow:0 8px 20px #07111b1a; position:relative; z-index:1; }
.home-view .pack-team .pack-choose:hover { background:#a84400; }
.home-view .pack-team::after { display:none; }
.home-view .pack-team.is-pack-visible .pack-garments img { animation:pack-team-lift 3.8s ease-in-out 2; }
.home-view .pack-team.is-pack-visible .pack-garments img:last-child { animation-delay:.3s; }
.home-view .pack-team.is-pack-visible .pack-choose span { animation:pack-team-arrow 3.8s ease-in-out 2; }
@keyframes pack-team-lift { 0%,65%,100% { transform:translateY(0) rotate(0); } 25% { transform:translateY(-12px) rotate(-4deg); } 42% { transform:translateY(-6px) rotate(2deg); } }
@keyframes pack-team-arrow { 0%,60%,100% { transform:translateX(0); } 25%,40% { transform:translateX(6px); } }
.pack-config-view { --pack-ink:#07111b; --pack-muted:#60666c; --pack-line:#e5e1da; --pack-accent:#a84400; width:100%; max-width:1440px; margin-inline:auto; padding:clamp(44px,4vw,56px) clamp(16px,4vw,56px) 65px; }
.pack-config-view .back { color:var(--pack-muted); text-decoration:none; display:inline-flex; padding:12px 0; margin-bottom:12px; }
.pack-config-heading { max-width:850px; margin-bottom:28px; }
.pack-config-heading h1 { font:750 clamp(32px,4.4vw,58px)/1.05 var(--font-display); letter-spacing:-.045em; margin:10px 0 18px; }
.pack-config-heading>p:not(.eyebrow) { color:var(--pack-muted); line-height:1.7; max-width:700px; font-size:17px; }
.pack-included { display:flex; flex-wrap:wrap; gap:9px 20px; margin-top:20px; font-size:13px; font-weight:650; }
.pack-included span::before { content:"✓"; color:var(--pack-accent); margin-right:7px; }
.pack-mobile-start { display:none; }
.pack-config-view .pack-config-layout { grid-template-columns:minmax(0,1fr) minmax(340px,.85fr); gap:30px; align-items:start; margin-top:0; }
.pack-config-view .pack-config-form { min-width:0; gap:26px; }
.pack-step-nav { display:flex; gap:8px; padding:7px; border:1px solid var(--pack-line); background:#f1eee8; border-radius:16px; }
.pack-step-nav a { flex:1; color:var(--pack-ink); text-decoration:none; display:flex; gap:8px; align-items:center; justify-content:center; min-height:44px; font-size:13px; font-weight:700; border-radius:10px; background:#fff; }
.pack-step-nav b { width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:#f1eee8; color:#07111b; font-size:12px; }
.pack-step-nav .is-complete b { background:#dbeee4; color:#146642; }
.pack-config-view fieldset { min-width:0; border:1px solid var(--pack-line); border-radius:20px; padding:22px 24px 24px; scroll-margin-top:125px; box-shadow:0 5px 18px #07111b04; transition:border-color .2s; }
.pack-config-view fieldset.is-distributed { border-color:#84b79c; }
.pack-config-view legend { padding:0 7px; font:750 21px var(--font-display); letter-spacing:-.02em; }
.pack-config-view legend>span { display:inline-grid; place-items:center; width:27px; height:27px; border-radius:50%; background:#ffead2; color:#a84400; font-size:14px; margin-right:7px; }
.pack-config-view .pack-product-reference { font-size:12px; line-height:1.5; color:var(--pack-muted); margin:0 0 22px; }
.pack-color-row { display:flex; align-items:center; gap:18px; justify-content:space-between; }
.pack-config-view .pack-color-row label { font-size:14px; font-weight:700; }
.pack-color-row select { max-width:190px; width:50%; min-height:44px; margin:0; font-size:14px; padding:8px 12px; }
.pack-swatches { display:flex; flex-wrap:wrap; gap:4px; margin:12px -4px 22px; }
.pack-swatches button { display:grid; place-items:center; width:44px; height:44px; padding:4px; border:2px solid transparent; border-radius:50%; background:transparent; cursor:pointer; }
.pack-swatches button span { background:var(--swatch); width:28px; height:28px; border-radius:50%; border:1px solid #0002; }
.pack-swatches button[aria-pressed="true"] { border-color:var(--pack-accent); background:#fff4e8; }
.pack-size-heading { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; align-items:center; }
.pack-size-heading h2 { font:700 15px var(--font-body); margin:0; }
.pack-size-heading>span { font-size:12px; color:var(--pack-muted); }
.pack-config-view .pack-size-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(122px,1fr)); margin:16px 0 8px; gap:12px; }
.pack-size-cell>label { display:block; margin-bottom:8px; font-size:13px; font-weight:750; }
.pack-stepper { display:grid; grid-template-columns:44px minmax(30px,1fr) 44px; align-items:center; border:1px solid var(--pack-line); border-radius:11px; overflow:hidden; background:#faf9f6; }
.pack-stepper button { min-height:44px; width:44px; background:transparent; color:var(--pack-ink); padding:0; border:0; border-radius:0; font-size:21px; cursor:pointer; }
.pack-stepper button:hover:not(:disabled) { background:#ffead2; }
.pack-stepper button:disabled { opacity:.3; cursor:default; }
.pack-config-view .pack-stepper input { min-width:0; width:100%; margin:0; min-height:44px; padding:0; border:0; background:transparent; text-align:center; border-radius:0; font-size:16px; font-weight:700; appearance:textfield; -moz-appearance:textfield; }
.pack-stepper input::-webkit-inner-spin-button,.pack-stepper input::-webkit-outer-spin-button { appearance:none; margin:0; }
.pack-config-view .pack-stepper input[aria-invalid="true"] { background:#fff0ed; color:#a4281d; }
.pack-config-view .pack-size-total { margin:0; font-size:12px; color:var(--pack-muted); font-weight:650; }
.is-distributed .pack-size-total { color:#146642; }
.pack-reset { border:0; background:transparent; color:var(--pack-accent); text-decoration:underline; font:600 12px var(--font-body); padding:10px 0; min-height:44px; cursor:pointer; }
.pack-size-progress { width:100%; height:6px; display:block; border:0; border-radius:6px; overflow:hidden; accent-color:#ff7900; background:#f1eee8; }
.pack-size-progress::-webkit-progress-bar { background:#f1eee8; }
.pack-size-progress::-webkit-progress-value { background:#ff7900; transition:width .25s; }
.pack-size-progress::-moz-progress-bar { background:#ff7900; }
.pack-config-view fieldset small { color:var(--pack-muted); font-size:12px; line-height:1.6; }
.pack-config-view .pack-config-summary { grid-row:auto; position:sticky; top:110px; border:1px solid #e3c8a6; border-radius:24px; padding:0; overflow:hidden; background:#fff; box-shadow:0 12px 36px #8b59100b; }
.pack-config-view .pack-preview-color { display:block; margin:3px 0 0; font-size:11px; color:#60666c; }
.pack-summary-details { padding:24px; }
.pack-summary-price { display:flex; align-items:center; flex-wrap:wrap; gap:16px; justify-content:space-between; }
.pack-config-view .pack-summary-price h2 { margin:0 0 4px; font:750 22px var(--font-display); }
.pack-summary-price span { font-size:12px; color:#60666c; }
.pack-summary-price p { margin:0; font:800 33px var(--font-display); letter-spacing:-.04em; }
.pack-config-view .pack-summary-price p small { display:inline; font:650 12px var(--font-body); margin:0; }
.pack-config-view .pack-completion-list { list-style:none; padding:0; display:grid; gap:10px; margin:23px 0 15px; font-size:13px; color:#60666c; }
.pack-completion-list .is-complete { color:#146642; }
.pack-overall-status { font-size:12px; font-weight:750; background:#f6f4ef; padding:12px; border-radius:10px; }
.pack-summary-more { margin-top:12px; }
.pack-summary-more summary { min-height:44px; display:list-item; cursor:pointer; font-size:12px; color:#60666c; padding:12px 0; }
.pack-config-view .pack-summary-more small { display:block; margin-top:10px; font-size:11px; line-height:1.6; color:#60666c; }
.pack-submit-area>button { width:100%; min-height:52px; font-size:15px; border-radius:30px; background:#ff7900; color:#07111b; box-shadow:0 10px 23px #ff790020; }
.pack-submit-area>small { display:block; text-align:center; color:#60666c; font-size:12px; line-height:1.6; margin-top:12px; }
.pack-form-status:empty { display:none; }
.pack-form-status { color:#a4281d; font-size:14px; line-height:1.6; }
.pack-config-view :is(button,a,input,select):focus-visible { outline:3px solid #a84400; outline-offset:3px; }
.pack-config-view [hidden] { display:none!important; }
@keyframes pack-workspace-enter { from { transform:translateY(14px); } to { transform:translateY(0); } }
@media (max-width:1000px) { .pack-config-view .pack-config-layout { gap:20px; grid-template-columns:minmax(0,1fr) 340px; } .pack-config-view fieldset { padding:20px 18px; } }
@media (max-width:800px) {
  .pack-mobile-start { display:inline-flex; align-items:center; min-height:44px; margin-top:18px; color:#a84400; font-size:13px; font-weight:750; }
  .pack-config-view .pack-config-layout { grid-template-columns:1fr; }
  .pack-config-view .pack-config-summary { position:static; grid-row:1; }
  .pack-summary-details { padding:18px; }
  .pack-config-view .pack-completion-list { display:flex; flex-wrap:wrap; gap:12px; margin:16px 0; }
  .pack-config-view .pack-summary-details>small { margin-top:10px; }
  .pack-overall-status { margin:0; }
}
@media (max-width:420px) {
  .pack-config-heading h1 { font-size:34px; }
  .pack-config-heading>p:not(.eyebrow) { font-size:15px; }
  .pack-step-nav { gap:4px; padding:5px; }
  .pack-step-nav a { gap:5px; font-size:12px; }
  .pack-config-view .pack-size-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .home-view .pack-team .pack-garments img { width:115px; }
  .home-view .pack-team .pack-garments { gap:10px; }
  .home-view .pack-team .pack-garments::before { right:0; top:-8px; }
}
@media (prefers-reduced-motion:reduce) { .pack-config-view *, .home-view .pack-team * { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }


/* Commercial builder: actual catalogue products, no alternate artwork editor. */
.pack-config-view { --pack-surface:#fff; --pack-soft:#f6f4ef; }
.pack-config-view fieldset,.pack-config-view .pack-config-summary { background:var(--pack-surface); }
.pack-config-view .pack-config-layout { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(320px,.85fr); }
.pack-config-view .pack-config-form { display:grid; }
.pack-config-view .pack-config-summary { border-color:var(--pack-line); }
.pack-product-intro { display:flex; gap:18px; align-items:center; margin-bottom:22px; }
.pack-product-intro img { width:95px; height:110px; object-fit:contain; mix-blend-mode:multiply; }
.pack-product-intro strong { font:700 17px var(--font-display); color:var(--pack-ink); }
.pack-config-view .pack-product-intro .pack-product-reference { margin:6px 0; }
.pack-config-view .pack-swatches { gap:6px; margin:16px 0 24px; }
.pack-config-view .pack-swatches button { width:auto; min-width:72px; border-radius:10px; grid-template-columns:22px 1fr; gap:7px; padding:7px 10px; border:1px solid var(--pack-line); color:var(--pack-ink); }
.pack-config-view .pack-swatches button span { width:22px; height:22px; flex-shrink:0; }
.pack-config-view .pack-swatches button small { font-size:11px; color:inherit; max-width:120px; overflow-wrap:anywhere; }
.pack-config-view .pack-swatches button[aria-pressed="true"] { border:2px solid var(--pack-accent); background:var(--pack-soft); }
.pack-summary-products { margin-top:24px; display:grid; gap:18px; }
.pack-summary-products article { display:flex; align-items:center; gap:16px; border-bottom:1px solid var(--pack-line); padding-bottom:16px; }
.pack-summary-products img { width:80px; height:95px; object-fit:contain; }
.pack-summary-products canvas { width:80px; height:112px; flex-shrink:0; object-fit:contain; border-radius:10px; background:var(--pack-soft); }
.pack-summary-products [hidden] { display:none; }
.pack-summary-products strong { font:700 16px var(--font-display); color:var(--pack-ink); }
.pack-summary-products p { font-size:13px; color:var(--pack-muted); margin:6px 0; }
.pack-summary-products small { font-size:12px; color:var(--pack-muted); display:block; line-height:1.6; }
.pack-config-view .pack-builder-next { margin:0; font-size:14px; line-height:1.7; color:var(--pack-muted); padding:4px 10px; }
.pack-builder-next strong { color:var(--pack-ink); }
.pack-config-view .pack-submit-area>button:disabled { opacity:.45; cursor:default; box-shadow:none; }
.pack-storage-status { font-size:12px; color:#a4281d; }
.pack-storage-status:empty { display:none; }
.pack-config-view :is(h1,h2,legend,.pack-summary-price p) { color:var(--pack-ink); }
.pack-config-view .pack-overall-status { background:var(--pack-soft); color:var(--pack-ink); }
@media(max-width:800px) {
  .pack-config-view .pack-config-layout { grid-template-columns:1fr; }
  .pack-config-view .pack-config-summary { grid-row:auto; }
  .pack-config-view .pack-summary-price { gap:12px; }
  .pack-config-view .pack-submit-area { position:sticky; bottom:14px; padding:12px 0; background:var(--pack-surface); z-index:2; }
}
