.layer-layout{display:grid;grid-template-columns:360px 1fr;gap:var(--space-xl);align-items:start}.layer-sidebar{position:sticky;top:calc(var(--header-h,76px) + var(--space-md));max-height:calc(100vh - var(--header-h,76px) - var(--space-lg));overflow-y:auto;scrollbar-width:thin}.layer-results-col{min-width:0}.layer-form-card{max-width:none;margin:0}.layer-sidebar .complement-input{padding:var(--space-lg)}.layer-sidebar .complement-question{margin-bottom:var(--space-md);padding-bottom:var(--space-sm)}.layer-sidebar .complement-question__label{margin-bottom:var(--space-sm)}.layer-sidebar .complement-selected{min-height:48px;padding:var(--space-xs) var(--space-md)}.layer-sidebar .complement-sex-select{gap:var(--space-sm)}.layer-sidebar .complement-sex-select .gender-letter{width:44px;height:44px}.layer-sidebar .layer-context{gap:var(--space-sm)}.layer-sidebar .complement-find-btn{margin-top:var(--space-md)}.layer-sidebar .complement-brand{display:grid;grid-template-columns:1fr 1fr 1fr;width:100%}.layer-sidebar .complement-brand__opt{padding:8px 6px;line-height:1.2;min-width:0;white-space:nowrap}.layer-sidebar .complement-brand__opt .complement-brand__name{display:block;font-size:.58rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}.layer-results-col>.layer-box,.layer-results-col>.layer-suggest{max-width:none;margin-inline:0}.layer-context{display:flex;gap:var(--space-sm)}.layer-context select{flex:1;cursor:pointer}.layer-add-third{margin-top:var(--space-sm);background:none;border:0;padding:0;cursor:pointer;font-family:var(--font-display);font-size:.82rem;font-weight:600;color:var(--color-accent-text)}.layer-add-third:hover{text-decoration:underline}.complement-results__heading span{color:var(--color-accent-text)}.layer-stack{display:flex;align-items:center;gap:var(--space-xl)}.layer-stack__body{flex:1;min-width:0;display:grid;gap:var(--space-md)}.layer-recipe{max-width:700px;margin:var(--space-md) auto 0;font-size:.9rem;color:var(--color-text);line-height:1.6;background:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md) var(--space-lg)}.layer-recipe::before{content:"How to apply";display:block;font-family:var(--font-display);font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-accent-text);margin-bottom:var(--space-xs)}.layer-plan{margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-border);display:flex;align-items:center;gap:var(--space-lg)}.layer-sil{width:64px;height:auto;flex-shrink:0}.layer-sil--lg{width:104px}.layer-sil__body{fill:var(--color-border)}.layer-sil--lg .layer-sil__num{font-size:10px}.layer-sil__zone{fill:var(--color-border);transition:fill var(--transition-fast)}.layer-sil__zg.on .layer-sil__zone{fill:var(--color-accent);filter:drop-shadow(0 0 4px rgba(0,212,170,.5))}.layer-sil__num{fill:var(--color-primary);font:700 9px/1 var(--font-display)}@media(prefers-reduced-motion:reduce){.layer-sil__zone{transition:none}}.layer-placement{flex:1;min-width:0;display:grid;gap:var(--space-sm)}.layer-zone{font-size:.85rem;color:var(--color-text);min-width:0}.layer-zone__top{display:flex;align-items:center;gap:var(--space-sm);min-width:0}.layer-zone__step{font-family:var(--font-display);font-size:.58rem;font-weight:700;line-height:1;color:var(--color-accent-text);background:rgba(0,212,170,.12);border-radius:var(--radius-full);padding:3px 6px;flex-shrink:0}.layer-zone__name{font-family:var(--font-display);font-weight:600;font-size:.85rem;color:var(--color-text-heading);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-zone__role{flex-shrink:0;font-family:var(--font-display);font-size:.58rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-muted);background:var(--color-bg);border:1px solid var(--color-border);padding:2px 8px;border-radius:var(--radius-full)}.layer-zone__detail{font-size:.78rem;color:var(--color-muted);margin-top:2px}.layer-zone__where{color:var(--color-accent-text);font-weight:600;font-family:var(--font-display)}.layer-caution{margin-top:var(--space-sm);font-size:.8rem;font-style:italic;color:var(--color-muted);background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.2);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md)}.layer-wear{margin-top:var(--space-sm);display:flex;gap:var(--space-lg);font-size:.8rem;color:var(--color-muted)}.layer-wear strong{font-family:var(--font-display);font-weight:600;font-size:.62rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-heading);display:block}.complement-result__score-label.layer{text-transform:none;letter-spacing:0}.layer-results-col>*+*{margin-top:var(--space-lg)}.layer-prefs{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-md)}.layer-prefs .complement-sex-select{flex-shrink:0}.layer-prefs select{flex:1 1 160px;min-width:0;cursor:pointer}.layer-box{max-width:700px;margin-inline:auto;background:var(--color-card-bg);border:1px solid var(--color-border-subtle);border-radius:var(--radius-lg);padding:var(--space-lg) var(--space-xl)}.layer-box>*+*{margin-top:var(--space-md)}.layer-box__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg)}.layer-box__title{margin:0;font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--color-text-heading);line-height:1.2}.layer-box__score{flex-shrink:0;text-align:center}.layer-box__why{font-size:.9rem;font-style:italic;line-height:1.6;color:var(--color-muted)}.layer-box__why strong{color:var(--color-text-heading);font-style:normal;font-weight:600}.layer-box__hint{font-size:.85rem;line-height:1.5;color:var(--color-muted)}.layer-box .complement-source{margin:0}.layer-stack{display:flex;align-items:flex-start;gap:var(--space-xl)}.layer-stack .layer-sil{flex-shrink:0}.layer-stack__rows{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--space-sm)}.layer-member{display:flex;align-items:center;gap:var(--space-md);min-height:56px;padding:var(--space-sm) var(--space-md);background:var(--color-bg);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md)}.layer-member__step{flex-shrink:0;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:.72rem;font-weight:700;line-height:1;color:var(--color-text-heading);background:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--radius-full)}.layer-member__img{flex-shrink:0;width:40px;height:50px;object-fit:contain;border-radius:var(--radius-sm);background:#fff;padding:2px}.layer-member__info{flex:1;min-width:0}.layer-member__name{display:block;font-family:var(--font-display);font-weight:600;font-size:.9rem;color:var(--color-text-heading);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-member__name:hover{color:var(--color-accent-text);text-decoration:underline}.layer-member__meta{display:block;margin-top:2px;font-size:.78rem;color:var(--color-muted)}.layer-member__role{font-family:var(--font-display);font-size:.58rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-accent-text)}.layer-member__remove{flex-shrink:0;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;margin:-10px 0;font-size:1.3rem;line-height:1;color:var(--color-muted);text-decoration:none;border-radius:var(--radius-sm);transition:color var(--transition-fast),background var(--transition-fast)}.layer-member__remove:hover{color:var(--color-accent-text);background:var(--color-card-bg)}.layer-suggest{max-width:700px;margin-inline:auto;display:flex;flex-direction:column;gap:var(--space-md)}.layer-suggest__title{margin:0;text-align:center;font-family:var(--font-display);font-size:1.05rem;font-weight:600;color:var(--color-text-heading)}.layer-suggestion{margin:0}.layer-suggestion__place{margin-top:var(--space-sm);font-size:.8rem;color:var(--color-muted)}.layer-suggestion__place .layer-suggestion__zone{color:var(--color-accent-text);font-family:var(--font-display);font-weight:600}.layer-suggestion .complement-result__cta-row .btn{min-height:44px}.layer-dd{--dd-gutter:150px;--dd-row-h:18px;margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-border);display:flex;flex-direction:column;gap:var(--space-md)}.layer-dd__title{margin:0;text-align:center;font-family:var(--font-display);font-size:1.05rem;font-weight:600;color:var(--color-text-heading)}.layer-dd__grid{display:flex;flex-direction:column;gap:var(--space-lg)}.layer-dd__member{display:flex;flex-direction:column;min-width:0}.layer-dd__mhead{display:flex;align-items:center;gap:var(--space-sm);margin:0 0 var(--space-sm)}.layer-dd__num{flex-shrink:0;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:.72rem;font-weight:700;line-height:1;color:var(--color-text-heading);background:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--radius-full)}.layer-dd__mname{font-family:var(--font-display);font-weight:600;font-size:.9rem;color:var(--color-text-heading);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.layer-dd .dd-grid{display:flex;flex-direction:column;gap:3px}.layer-dd .dd-row{display:grid;grid-template-columns:var(--dd-gutter) 1fr;column-gap:0;align-items:center}.layer-dd .dd-pill{max-width:100%;margin-right:12px;font-size:.72rem}.layer-dd .dd-pill .note-pill-compact__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-dd .dd-pill__img{width:18px;height:18px;border-radius:50%;object-fit:cover;flex:0 0 18px;box-shadow:0 0 0 1px rgba(0,0,0,.06) inset}.layer-dd .dd-pill__disc{width:13px;height:13px;border-radius:50%;flex:0 0 13px;margin:0 2px;box-shadow:0 0 0 1px rgba(0,0,0,.06) inset}.layer-dd .dd-track{position:relative;height:var(--dd-row-h)}.layer-dd .dd-ribbon{display:block;width:100%;height:100%}.layer-dd .dd-diamond{position:absolute;top:50%;width:8px;height:8px;transform:translate(-50%,-50%) rotate(45deg);border:1.5px solid var(--color-bg-warm);border-radius:2px}.layer-dd .dd-axis{display:flex;align-items:center;justify-content:space-between;gap:11px;flex-wrap:wrap;height:auto}.layer-dd .dd-journey-axis{margin-top:8px}.layer-dd .dd-axis__key{display:flex;align-items:center;gap:11px;font-size:10.5px;color:var(--color-text-secondary);white-space:nowrap}.layer-dd .dd-axis__flow{display:inline-flex;gap:10px;align-items:center}.layer-dd .dd-key__item{display:inline-flex;align-items:center;gap:4px}.layer-dd .dd-key__dia{width:8px;height:8px;transform:rotate(45deg);border-radius:2px;flex:0 0 8px}.layer-dd .dd-axis__time,.layer-dd .dd-axis__end{font-size:9.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--color-muted)}@media(prefers-reduced-motion:reduce){.layer-dd .note-pill-compact,.layer-dd a.note-pill-compact:hover{transition:none;transform:none}}@media(max-width:900px){.layer-layout{grid-template-columns:1fr;gap:var(--space-lg)}.layer-sidebar{position:static;max-height:none;overflow-y:visible}}@media(max-width:600px){.layer-box{padding:var(--space-md)}.layer-box__head{gap:var(--space-md)}.layer-stack{flex-direction:column;align-items:center;gap:var(--space-md)}.layer-stack__rows{width:100%}.layer-prefs{flex-direction:column;align-items:stretch}.layer-prefs .complement-sex-select{justify-content:space-between}.layer-prefs select{flex:1 1 auto}.layer-dd{--dd-gutter:120px}}