:root{--color-page:#f4f6f8;--color-surface:#fff;--color-surface-muted:#f7f8fa;--color-text:#16202a;--color-text-muted:#66717d;--color-border:#d9dfe6;--color-border-strong:#b9c3ce;--color-primary:#124e78;--color-primary-hover:#0c3d61;--color-primary-soft:#eef5f9;--color-success:#176448;--color-success-soft:#eaf5ef;--color-error:#a63a35;--radius-sm:4px;--radius-md:8px;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;color:var(--color-text);background:var(--color-page);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif}*{box-sizing:border-box}html{background:var(--color-page)}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible{outline-offset:2px;outline:3px solid #124e784d}h1,h2,h3,p,dl,dd{margin:0}a{color:inherit}#root{min-height:100vh}.app-shell{width:min(1180px,100% - 32px);min-height:100vh;padding-bottom:var(--space-10);margin:0 auto}.site-header{justify-content:space-between;align-items:center;gap:var(--space-4);min-height:76px;display:flex}.brand-block{align-items:center;display:flex}.brand-block h1{letter-spacing:-.02em;font-size:1.15rem;line-height:1.2}.language-switcher{border:1px solid var(--color-border);background:var(--color-surface);border-radius:6px;padding:3px;display:flex}.language-switcher button{min-width:48px;min-height:34px;padding:0 var(--space-3);border-radius:var(--radius-sm);color:var(--color-text-muted);cursor:pointer;background:0 0;border:0;font-size:.78rem;font-weight:700}.language-switcher button[aria-pressed=true]{background:var(--color-text);color:#fff}.step-progress{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}.step-progress ol{max-width:660px;padding:var(--space-3) var(--space-6);grid-template-columns:repeat(3,1fr);margin:0 auto;list-style:none;display:grid}.step-progress li{justify-content:center;align-items:center;gap:var(--space-2);color:var(--color-text-muted);font-size:.82rem;font-weight:650;display:flex;position:relative}.step-progress li:not(:last-child):after{content:"";background:var(--color-border);height:1px;position:absolute;left:calc(50% + 52px);right:calc(52px - 50%)}.step-number{border:1px solid var(--color-border-strong);background:var(--color-surface);border-radius:50%;place-items:center;width:26px;height:26px;font-size:.72rem;display:grid}.step-progress li.current,.step-progress li.complete{color:var(--color-primary)}.step-progress li.current .step-number,.step-progress li.complete .step-number{border-color:var(--color-primary);background:var(--color-primary);color:#fff}.workspace{gap:var(--space-5);margin-top:var(--space-5);grid-template-columns:minmax(250px,.32fr) minmax(0,.68fr);align-items:start;display:grid}.preview-panel,.step-panel,.summary-card,.documents-section{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}.preview-panel{top:var(--space-4);position:sticky;overflow:hidden}.preview-placeholder{align-content:center;justify-items:center;gap:var(--space-5);min-height:340px;padding:var(--space-6);background:linear-gradient(var(--color-border) 1px, transparent 1px), linear-gradient(90deg, var(--color-border) 1px, transparent 1px), var(--color-surface-muted);background-size:24px 24px;display:grid;position:relative}.preview-placeholder:before{content:"";pointer-events:none;background:#f7f8fab8;position:absolute;inset:0}.preview-placeholder>*{position:relative}.preview-symbol{border:2px solid var(--color-border-strong);background:#ffffffbf;border-radius:34px 34px 14px 14px;width:84px;height:154px}.preview-symbol:before{content:"";border:2px solid var(--color-border-strong);background:var(--color-surface);border-radius:4px;width:48px;height:16px;position:absolute;top:-8px;left:50%;translate:-50%}.preview-placeholder p{max-width:190px;color:var(--color-text-muted);text-align:center;font-size:.76rem;line-height:1.5}.config-chips{min-height:76px;padding:var(--space-4);align-content:flex-start;gap:var(--space-2);border-top:1px solid var(--color-border);flex-wrap:wrap;display:flex}.config-chips span{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-muted);color:var(--color-text-muted);padding:6px 9px;font-size:.72rem;line-height:1}.step-panel{min-width:0;padding:var(--space-8) var(--space-8) 0}.step-heading{margin-bottom:var(--space-8)}.step-heading h2{letter-spacing:-.035em;font-size:1.65rem;line-height:1.2}.step-heading p{margin-top:var(--space-2);color:var(--color-text-muted);font-size:.86rem}.choice-group{min-width:0;margin:0 0 var(--space-8);border:0;padding:0}.choice-group legend,.number-field>label{width:100%;margin-bottom:var(--space-3);color:var(--color-text);font-size:.86rem;font-weight:750}.choice-list{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(150px,1fr));display:grid}.compact .choice-list{gap:var(--space-2);flex-wrap:wrap;display:flex}.option-card{justify-content:center;align-items:center;gap:var(--space-3);min-height:44px;padding:var(--space-3) var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);cursor:pointer;text-align:left;display:flex;position:relative}.option-card:hover:not(:disabled){border-color:var(--color-primary)}.option-card.selected{border-color:var(--color-primary);background:var(--color-primary-soft);box-shadow:inset 0 0 0 1px var(--color-primary)}.option-card:disabled{background:var(--color-surface-muted);color:#89929c;cursor:not-allowed}.option-card.visual{justify-content:flex-start;min-height:118px}.image-placeholder{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-muted);flex:none;place-items:center;width:58px;height:76px;display:grid;position:relative;overflow:hidden}.package-shape{border:1px solid var(--color-border-strong);background:var(--color-surface);border-radius:9px 9px 4px 4px;width:25px;height:48px;position:relative;box-shadow:0 3px 8px #1f2a3414}.package-shape:before,.package-shape:after{content:"";position:absolute}.visual-product-hair-spray .package-shape{background:linear-gradient(90deg,#dfe9f1 0 22%,#f8fbfd 22% 72%,#c9d8e4 72%);border-color:#8aa1b5}.visual-product-hair-spray .package-shape:before,.visual-product-dry-shampoo .package-shape:before{background:#d3dce3;border:1px solid #7f91a0;border-radius:2px 2px 0 0;width:13px;height:5px;top:-7px;left:5px}.visual-product-hair-spray .package-shape:after{border-top:2px solid #2f6f9f;border-bottom:7px solid #afc9dc;inset:24px 2px 9px}.visual-product-dry-shampoo .package-shape{background:linear-gradient(90deg,#d4d9dd,#f8f9fa 45%,#bfc7ce);border-color:#929ba3}.visual-product-dry-shampoo .package-shape:after{border-top:7px solid #c69b43;border-bottom:7px solid #ece1c5;inset:18px 2px 10px}.visual-product-hair-mousse .package-shape{background:linear-gradient(90deg,#283b4e,#647687 44%,#1f3142);border-color:#586a7b;border-radius:6px 6px 4px 4px;width:27px}.visual-product-hair-mousse .package-shape:before{background:#172839;border-radius:3px 3px 0 0;width:19px;height:8px;top:-8px;left:3px}.visual-product-hair-mousse .package-shape:after{border-top:7px solid #b08d48;border-bottom:1px solid #d3bd86;inset:20px 3px 11px}.visual-lining-pam .package-shape{background:linear-gradient(90deg,#dcecf5 0 16%,#f8fbfd 16% 84%,#dcecf5 84%);box-shadow:inset 0 0 0 3px #8dbbd4}.visual-lining-epoxy .package-shape{background:linear-gradient(90deg,#f0d7a8 0 16%,#fff8e8 16% 84%,#edc87e 84%);box-shadow:inset 0 0 0 3px #d8a34d}.visual-material-aluminum .package-shape{background:linear-gradient(100deg,#b9c7d0,#fbfdfe 38%,#d8e2e8 60%,#9eafb9);border-color:#9eadb8}.visual-material-steel .package-shape{background:linear-gradient(100deg,#75838d,#d7dde1 42%,#66737d);border-color:#667582}.visual-material-steel .package-shape:before,.visual-material-steel .package-shape:after{background:#596773;height:2px;left:2px;right:2px}.visual-material-steel .package-shape:before{top:6px}.visual-material-steel .package-shape:after{bottom:6px}.visual-shoulder-c20 .package-shape{background:linear-gradient(90deg,#d4dde4,#fff 48%,#c6d1d9);border-radius:14px 14px 4px 4px}.visual-shoulder-d20 .package-shape{clip-path:polygon(30% 0,70% 0,100% 18%,100% 100%,0 100%,0 18%);background:linear-gradient(90deg,#c4d0d8,#fff 48%,#b5c3cc);border-radius:3px 3px 4px 4px}.visual-cap-integrated .package-shape,.visual-cap-overcap .package-shape,.visual-cap-type-spray .package-shape,.visual-cap-type-foam-mousse .package-shape,.visual-cap-type-trigger .package-shape{background:linear-gradient(90deg,#c9d4dc,#f8fbfd 50%,#b7c5cf);border-radius:7px 7px 4px 4px;width:31px;height:36px}.visual-cap-integrated .package-shape:after{background:#8394a2;border-radius:4px 4px 0 0;width:13px;height:10px;top:-9px;left:8px}.visual-cap-overcap .package-shape{border-radius:12px 12px 5px 5px;width:34px;height:42px}.visual-cap-type-spray .package-shape:before{background:#536b7e;border-radius:3px 3px 0 0;width:12px;height:7px;top:-6px;left:9px}.visual-cap-type-foam-mousse .package-shape:before{background:#6f8393;border-radius:8px 8px 0 0;width:21px;height:8px;top:-7px;left:4px}.visual-cap-type-trigger .package-shape:before{background:#556d80;border-radius:0 5px 5px 0;width:23px;height:7px;top:4px;left:13px;rotate:-9deg}.visual-color-black .package-shape{background:#222a31;border-color:#111820}.visual-color-white .package-shape{background:#fff;border-color:#aab6c0}.visual-color-transparent .package-shape{background:repeating-linear-gradient(135deg,#6f849414 0 4px,#ffffffb8 4px 8px);border-color:#95a8b7}.visual-finish-glossy .package-shape{background:linear-gradient(105deg,#7f8e99 0 25%,#fff 35% 48%,#aab7c0 56% 100%)}.visual-finish-matte .package-shape{box-shadow:none;background:#9ca8b1}.option-copy{flex-direction:column;gap:3px;min-width:0;display:flex}.option-copy strong{font-size:.84rem;line-height:1.35}.option-copy small{color:var(--color-text-muted);letter-spacing:.025em;font-size:.66rem;line-height:1.35}.option-copy .disabled-note{color:var(--color-error)}.option-copy .visual-note{color:#8a949d;letter-spacing:0}.selected-mark{background:var(--color-primary);color:#fff;border-radius:50%;place-items:center;width:18px;height:18px;font-size:.65rem;font-weight:800;display:grid;position:absolute;top:7px;right:7px}.compact .option-card{min-height:40px;padding:8px 13px}.group-grid{column-gap:var(--space-8);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.read-only-value{padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-muted);justify-content:space-between;align-items:center;display:flex}.read-only-value span{color:var(--color-text-muted);font-size:.8rem}.read-only-value strong{color:var(--color-primary);font-size:.86rem}.number-field{margin-bottom:var(--space-8)}.number-field>div{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);align-items:center;width:min(240px,100%);display:flex}.number-field input{min-width:0;height:44px;padding:0 var(--space-3);border-radius:var(--radius-sm);color:var(--color-text);background:0 0;border:0;flex:1}.number-field>div>span{padding-right:var(--space-3);color:var(--color-text-muted);font-size:.8rem}.field-note,.error-text{margin-top:var(--space-2);font-size:.74rem}.field-note{color:var(--color-text-muted)}.error-text{color:var(--color-error)}.action-bar{z-index:5;min-height:76px;margin:var(--space-8) calc(var(--space-8) * -1) 0;padding:var(--space-4) var(--space-8);justify-content:space-between;align-items:center;gap:var(--space-4);border-top:1px solid var(--color-border);border-radius:0 0 var(--radius-md) var(--radius-md);background:var(--color-surface);display:flex;position:sticky;bottom:0}.action-bar p{color:var(--color-text-muted);font-size:.76rem}.action-bar>div{gap:var(--space-2);display:flex}.button{min-height:44px;padding:0 var(--space-5);border-radius:var(--radius-sm);cursor:pointer;font-size:.82rem;font-weight:750}.button.primary{border:1px solid var(--color-primary);background:var(--color-primary);color:#fff;min-width:118px}.button.primary:hover:not(:disabled){border-color:var(--color-primary-hover);background:var(--color-primary-hover)}.button.primary:disabled{color:#89929c;cursor:not-allowed;background:#e4e8ec;border-color:#d6dce2}.button.secondary{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text)}.summary-page{margin-top:var(--space-5)}.summary-heading{margin:var(--space-10) 0 var(--space-6)}.review-actions,.report-actions{margin-top:var(--space-5);padding:var(--space-5);justify-content:flex-end;gap:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);display:flex}.report-heading-row{justify-content:space-between;align-items:end;gap:var(--space-5);display:flex}.report-heading-row .summary-heading,.report-heading-row>.button{margin-bottom:var(--space-6)}.summary-grid{gap:var(--space-4);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.summary-card{padding:var(--space-5)}.summary-card-heading,.documents-heading{justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.summary-card-heading h3,.document-info h3{font-size:.92rem}.summary-card-heading button{color:var(--color-primary);cursor:pointer;background:0 0;border:0;padding:4px 0;font-size:.74rem;font-weight:700}.summary-card dl{margin-top:var(--space-4)}.summary-card dl div{justify-content:space-between;gap:var(--space-4);border-top:1px solid #edf0f3;padding:8px 0;font-size:.75rem;display:flex}.summary-card dt{color:var(--color-text-muted)}.summary-card dd{text-align:right;font-weight:650}.documents-section{margin-top:var(--space-5);padding:var(--space-6)}.documents-heading h2{font-size:1rem}.documents-heading p{color:var(--color-text-muted);font-size:.74rem}.document-grid{gap:var(--space-4);margin-top:var(--space-5);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.document-card{gap:var(--space-4);padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-sm);grid-template-columns:132px 1fr;display:grid}.document-card.matched{border-color:var(--color-success);background:var(--color-success-soft)}.pdf-thumbnail{aspect-ratio:17/22;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);cursor:zoom-in;width:100%;min-width:0;padding:0;position:relative;overflow:hidden}.pdf-thumbnail img{object-fit:cover;object-position:top center;width:100%;height:100%;transition:transform .16s;display:block}.pdf-thumbnail span{right:var(--space-2);bottom:var(--space-2);left:var(--space-2);padding:7px var(--space-2);color:#fff;text-align:center;background:#111d28d6;border-radius:3px;font-size:.7rem;font-weight:750;line-height:1.2;position:absolute}.pdf-thumbnail:hover img{transform:scale(1.025)}.pdf-thumbnail:hover span,.pdf-thumbnail:focus-visible span{background:var(--color-primary)}.pdf-thumbnail:focus-visible{outline-offset:3px;outline:3px solid #1e5c8947}.document-info{align-self:center;min-width:0}.document-status{margin-bottom:var(--space-2);color:var(--color-text-muted);font-size:.68rem;font-weight:700;display:inline-block}.matched .document-status{color:var(--color-success)}.document-info p{margin-top:var(--space-2);color:var(--color-text-muted);font-size:.72rem}.document-actions{gap:var(--space-4);margin-top:var(--space-5);display:flex}.document-actions a{color:var(--color-primary);cursor:pointer;background:0 0;border:0;padding:0;font-size:.74rem;font-weight:750;text-decoration:none}.document-actions a:hover{text-decoration:underline}.pdf-dialog-backdrop{z-index:50;padding:var(--space-5);background:#111d28b8;place-items:center;display:grid;position:fixed;inset:0}.pdf-dialog{border-radius:var(--radius-md);background:var(--color-surface);grid-template-rows:auto minmax(0,1fr) auto;width:min(1040px,100%);height:min(820px,100vh - 40px);display:grid;overflow:hidden;box-shadow:0 20px 60px #111d2847}.pdf-dialog header,.pdf-dialog footer{justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-5);display:flex}.pdf-dialog header{border-bottom:1px solid var(--color-border)}.pdf-dialog header span{color:var(--color-text-muted);font-size:.7rem}.pdf-dialog header h2{margin-top:2px;font-size:1rem}.pdf-dialog iframe{background:#eef1f4;border:0;width:100%;height:100%}.pdf-dialog footer{border-top:1px solid var(--color-border);justify-content:flex-end}.pdf-dialog footer a{color:var(--color-primary);font-size:.78rem;font-weight:700;text-decoration:none}.dialog-close{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);width:40px;height:40px;color:var(--color-text);cursor:pointer;place-items:center;font-size:1.4rem;line-height:1;display:grid}@media (width<=900px){.app-shell{width:min(100% - 24px,760px);padding-bottom:var(--space-8)}.workspace{grid-template-columns:1fr}.preview-panel{grid-template-columns:128px 1fr;display:grid;position:static}.preview-placeholder{min-height:118px;padding:var(--space-3);gap:var(--space-2);background-size:18px 18px}.preview-symbol{border-radius:14px 14px 5px 5px;width:34px;height:58px}.preview-symbol:before{width:20px;height:7px;top:-5px}.preview-placeholder p{max-width:110px;font-size:.62rem}.config-chips{border-top:0;border-left:1px solid var(--color-border);align-content:center;min-height:118px}.step-panel{padding:var(--space-6) var(--space-5) 0}.action-bar{margin:var(--space-8) calc(var(--space-5) * -1) 0;padding:var(--space-3) max(var(--space-4), env(safe-area-inset-right)) calc(var(--space-3) + env(safe-area-inset-bottom)) max(var(--space-4), env(safe-area-inset-left));border-radius:0 0 var(--radius-md) var(--radius-md);box-shadow:none;position:sticky;bottom:0}.summary-grid{grid-template-columns:1fr}}@media (width<=620px){.app-shell{width:100%}.site-header{min-height:64px;padding:0 var(--space-4)}.brand-block h1{font-size:.95rem}.language-switcher button{min-width:44px;min-height:36px;padding:0 var(--space-2)}.step-progress{border-left:0;border-right:0;border-radius:0}.step-progress ol{padding:10px var(--space-4)}.step-progress li{font-size:.72rem}.step-progress li:not(:last-child):after{left:calc(50% + 40px);right:calc(40px - 50%)}.workspace{margin-top:var(--space-3);gap:var(--space-3)}.preview-panel,.step-panel,.summary-card,.documents-section{border-left:0;border-right:0;border-radius:0}.preview-panel{grid-template-columns:112px 1fr}.preview-placeholder,.config-chips{min-height:108px}.step-panel{padding:var(--space-6) var(--space-4) 0}.step-heading{margin-bottom:var(--space-6)}.step-heading h2{font-size:1.35rem}.choice-list{grid-template-columns:repeat(2,minmax(0,1fr))}.choice-group:first-of-type>.choice-list{grid-template-columns:1fr}.group-grid{grid-template-columns:1fr;column-gap:0}.option-card.visual{min-height:92px}.image-placeholder{width:50px;height:64px}.package-shape{width:22px;height:41px}.action-bar{align-items:stretch;gap:var(--space-2);min-height:0;margin-right:calc(var(--space-4) * -1);margin-left:calc(var(--space-4) * -1);flex-direction:column}.action-bar p{max-width:none;line-height:1.45}.action-bar>div{justify-content:flex-end}.button{padding:0 var(--space-4)}.summary-page{margin-top:0}.summary-heading{margin:var(--space-8) var(--space-4) var(--space-5)}.summary-grid{gap:var(--space-3)}.documents-section{padding:var(--space-5) var(--space-4)}.documents-heading{flex-direction:column;align-items:flex-start}.document-grid{grid-template-columns:1fr}.report-heading-row{margin-bottom:var(--space-5);flex-direction:column;align-items:stretch}.report-heading-row .summary-heading,.report-heading-row>.button{margin-bottom:0}.report-heading-row>.button{align-self:flex-start}.review-actions{margin-top:var(--space-3);border-left:0;border-right:0;border-radius:0}.pdf-dialog-backdrop{padding:0}.pdf-dialog{border-radius:0;width:100%;height:100%}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important}}
