:root{--ink:#171717;--muted:#6f6b65;--paper:#f4f1eb;--card:#fffdfa;--line:#ded9d1;--red:#e95d43;--orange:#f4a04f;--moss:#7e8e68;--blue:#5f7f92;--shadow:0 16px 40px rgba(35,28,20,.08);--mono:'DM Mono',monospace;--sans:'Manrope','Microsoft YaHei',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:14px}button,input,select{font:inherit}button{cursor:pointer;border:0}button:disabled{cursor:not-allowed;opacity:.45}.app-shell{min-height:100vh}.masthead{background:#1b1b1a;color:#f8f5ef;display:flex;justify-content:space-between;gap:48px;padding:54px clamp(22px,6vw,92px) 48px;position:relative;overflow:hidden}.masthead:after{content:"";position:absolute;width:50vw;height:42vw;right:-15vw;top:-24vw;background:radial-gradient(circle at 50% 50%,rgba(235,91,64,.95),rgba(235,91,64,.2) 40%,transparent 67%);pointer-events:none}.masthead-copy,.hero-metrics{position:relative;z-index:1}.eyebrow,.section-kicker{font:500 10px/1.3 var(--mono);letter-spacing:.16em;text-transform:uppercase}.eyebrow{color:#ef755d;margin:0 0 18px}.masthead h1{font-size:clamp(46px,6.3vw,92px);line-height:.94;letter-spacing:-.065em;margin:0 0 24px;font-weight:800}.masthead h1 em{font-style:normal;color:#ef755d}.lede{max-width:600px;color:#cfc9c0;line-height:1.7;margin:0;font-size:15px}.masthead-actions{display:flex;gap:10px;margin-top:32px;flex-wrap:wrap}.button{border-radius:999px;padding:11px 18px;font-weight:700;letter-spacing:-.01em;transition:transform .2s,box-shadow .2s,background .2s}.button-small{padding:8px 12px;font-size:11px}.button:hover{transform:translateY(-1px)}.button-primary{background:var(--red);color:#fff;box-shadow:0 10px 20px rgba(233,93,67,.24)}.button-primary:hover{background:#f16b50}.button-quiet{background:rgba(255,255,255,.1);color:#fff}.button-outline{background:transparent;border:1px solid var(--line);color:var(--ink)}.button-danger{background:#f2d4cd;color:#8c2f22}.hero-metrics{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:12px;min-width:300px;align-content:end}.metric{border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:18px 18px 15px;background:rgba(255,255,255,.06);display:flex;flex-direction:column;gap:3px}.metric-main{grid-column:span 2;background:rgba(239,117,93,.18);border-color:rgba(239,117,93,.5)}.metric strong{font-size:30px;letter-spacing:-.06em}.metric span{color:#d8d2ca;font-size:12px}.metric small{font:10px var(--mono);color:#a49c92;margin-top:7px}
.command-bar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:12px;padding:12px clamp(22px,6vw,92px);background:rgba(244,241,235,.92);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.search-wrap{display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:0 14px;min-width:280px}.search-icon{font-size:24px;line-height:1;color:var(--muted);transform:rotate(-20deg)}.search-wrap input{border:0;outline:0;background:transparent;width:100%;padding:11px 0;font-size:13px}.select-wrap{display:flex;align-items:center;gap:6px;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:0 13px;color:var(--muted);font-size:11px;white-space:nowrap}.select-wrap select{border:0;background:transparent;outline:0;padding:11px 0;color:var(--ink);font-size:12px;max-width:150px}.status-tabs{display:flex;gap:3px;background:#e9e5de;border-radius:999px;padding:3px;margin-left:auto}.status-tab{background:transparent;color:#6f6a63;border-radius:999px;padding:8px 10px;font-size:11px;white-space:nowrap}.status-tab b{font:10px var(--mono);margin-left:3px}.status-tab.is-active{background:#fffdfa;color:var(--ink);box-shadow:0 2px 9px rgba(30,20,10,.08)}.toolbar-reset,.text-button{background:transparent;color:var(--muted);font-size:11px}.toolbar-reset:hover,.text-button:hover{color:var(--red)}
.layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:32px;padding:36px clamp(22px,6vw,92px) 80px;min-width:0}.sidebar,.content,.gallery{min-width:0}.sidebar{display:flex;flex-direction:column;gap:14px;position:sticky;align-self:start;top:76px}.side-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px;min-width:0}.phase-card{background:#1d1d1b;color:#f6f2eb;border-color:#1d1d1b}.side-card-top,.side-card-heading,.phase-progress-label,.content-heading,.content-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.phase-dot{width:7px;height:7px;border-radius:50%;background:#ef755d;box-shadow:0 0 0 4px rgba(239,117,93,.16)}.phase-card .section-kicker{color:#ef755d}.phase-card h2{font-size:22px;letter-spacing:-.04em;margin:18px 0 8px}.phase-card p{color:#b9b1a7;line-height:1.6;margin:0;font-size:12px}.phase-progress{height:7px;background:#3a3935;border-radius:99px;overflow:hidden;margin:20px 0 8px}.phase-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--red),var(--orange));border-radius:inherit;transition:width .4s}.phase-progress-label{font:10px var(--mono);color:#a49c92}.category-card{padding-bottom:12px}.category-card .section-kicker,.rules-card .section-kicker{color:var(--muted)}.category-list{display:flex;flex-direction:column;margin-top:13px;min-width:0}.category-row{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:9px;align-items:center;padding:9px 0;border-bottom:1px solid #eeeae4;cursor:pointer;min-width:0}.category-row:last-child{border-bottom:0}.category-row:hover .category-name{color:var(--red)}.category-index{font:10px var(--mono);color:#aaa298}.category-name{font-size:12px;line-height:1.25;min-width:0}.category-name small{display:block;color:#aaa298;font-size:10px;margin-top:2px}.category-count{font:10px var(--mono);color:#aaa298}.category-count.is-done{color:var(--moss)}.rules-card{background:transparent;padding:6px 4px 0;border:0}.rules-card ul{padding-left:17px;color:var(--muted);font-size:11px;line-height:1.7;margin:12px 0}.rules-card li+li{margin-top:6px}
.content-heading{margin-bottom:18px}.content-heading h2{font-size:28px;letter-spacing:-.05em;margin:8px 0 0}.result-count,.generation-summary{font:11px var(--mono);color:var(--muted)}.generation-summary{white-space:nowrap}.content-actions{align-items:center}.category-progress-strip{display:flex;gap:7px;overflow:auto;padding:0 0 18px;scrollbar-width:thin}.progress-chip{white-space:nowrap;border:1px solid var(--line);border-radius:999px;padding:7px 10px;background:rgba(255,253,250,.6);font:10px var(--mono);color:var(--muted);cursor:pointer}.progress-chip:hover{border-color:var(--red);color:var(--red)}.progress-chip strong{color:var(--ink);font-weight:500}.progress-chip.is-complete{border-color:#b7c5a9;background:#eef3e9;color:#61734f}.gallery{column-count:4;column-gap:18px}.shoe-card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:16px;display:inline-block;width:100%;margin:0 0 18px;overflow:hidden;break-inside:avoid;box-shadow:0 3px 0 rgba(30,20,10,.02);transition:transform .24s,box-shadow .24s,border-color .24s}.shoe-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#c9c0b5}.shoe-card.is-selected{border-color:var(--moss);box-shadow:0 0 0 2px rgba(126,142,104,.14)}.shoe-visual{position:relative;display:block;width:100%;aspect-ratio:4/3;min-height:190px;padding:0;border:0;border-radius:0;background:#ebe7df;overflow:hidden;text-align:left}.shoe-visual img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:contain;object-position:center;background:#ebe7df;transition:transform .4s}.shoe-card:hover .shoe-visual img{transform:scale(1.015)}.status-pill{position:absolute;left:12px;top:12px;border-radius:999px;padding:6px 8px;background:rgba(255,253,250,.9);font:10px var(--mono);color:var(--ink);backdrop-filter:blur(5px)}.status-pill.pending{color:#a54c39}.status-pill.approved{color:#5a7447}.status-pill.rejected{color:#a33a33}.status-pill.queued{color:#5f7f92}.shoe-number{position:absolute;right:12px;top:12px;font:10px var(--mono);color:rgba(23,23,23,.55);background:rgba(255,253,250,.72);padding:5px 7px;border-radius:999px}.placeholder{width:100%;height:100%;aspect-ratio:auto;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:linear-gradient(135deg,var(--tint,#d9d5cc),#f5f2eb 60%,var(--accent,#c98060));color:rgba(23,23,23,.64)}.placeholder:before{content:"";position:absolute;width:70%;height:48%;border:2px solid rgba(23,23,23,.25);border-radius:58% 42% 48% 52% / 48% 40% 60% 52%;transform:skewX(-15deg) rotate(-5deg);box-shadow:inset -15px -3px 0 rgba(23,23,23,.08)}.placeholder:after{content:"";position:absolute;width:48%;height:11%;bottom:22%;border-bottom:5px solid rgba(23,23,23,.28);border-radius:50%;transform:skewX(-20deg)}.placeholder span{position:relative;z-index:1;font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase}.shoe-info{position:absolute;z-index:4;left:0;right:0;bottom:0;max-height:48px;overflow:hidden;padding:10px 13px 11px;background:rgba(255,253,250,.94);border-top:1px solid rgba(222,217,209,.9);backdrop-filter:blur(12px);transition:max-height .28s ease,background .28s ease}.shoe-card:hover .shoe-info,.shoe-card:focus-within .shoe-info{max-height:220px;background:rgba(255,253,250,.97)}.shoe-info-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.shoe-info h3{font-size:13px;line-height:1.22;letter-spacing:-.03em;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.shoe-id{font:10px var(--mono);color:#aaa298;white-space:nowrap}.shoe-ref{font-size:10px;color:var(--muted);margin:7px 0 8px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.shoe-ref strong{color:var(--ink);font-weight:600}.tag-row{display:flex;gap:5px;flex-wrap:wrap;max-height:23px;overflow:hidden}.tag{font:9px var(--mono);border:1px solid #e3ded5;border-radius:999px;padding:3px 6px;color:#777067}.shoe-actions{display:flex;gap:7px;margin-top:10px}.card-action{border:1px solid var(--line);background:transparent;border-radius:999px;padding:6px 9px;font-size:10px;color:var(--muted);flex:1}.card-action:hover{border-color:var(--ink);color:var(--ink)}.card-action.approve:hover{border-color:var(--moss);color:#57713e;background:#f1f5ed}.card-action.reject:hover{border-color:#d98677;color:#9c3f33;background:#fff4f1}.empty-state{text-align:center;padding:80px 20px;color:var(--muted)}.empty-state span{font-size:36px;color:var(--red)}.empty-state h3{color:var(--ink);margin:12px 0 4px}.empty-state p{margin:0 0 20px}
.footer{border-top:1px solid var(--line);padding:22px clamp(22px,6vw,92px);display:flex;justify-content:space-between;gap:20px;color:#9a948b;font:10px var(--mono);letter-spacing:.04em}.drawer-backdrop{position:fixed;inset:0;background:rgba(25,22,18,.38);z-index:20}.detail-drawer{position:fixed;z-index:21;top:0;right:0;width:min(540px,100vw);height:100vh;background:#fbf9f5;box-shadow:-20px 0 60px rgba(20,15,10,.18);transform:translateX(100%);transition:transform .35s cubic-bezier(.22,.61,.36,1);display:flex;flex-direction:column}.detail-drawer.is-open{transform:translateX(0)}.drawer-head{display:flex;justify-content:space-between;gap:20px;padding:28px 28px 22px;border-bottom:1px solid var(--line)}.drawer-head .section-kicker{color:var(--red)}.drawer-head h2{font-size:25px;letter-spacing:-.05em;line-height:1.1;margin:8px 0 5px}.drawer-head p{font:11px var(--mono);color:var(--muted);margin:0}.icon-button{background:transparent;font-size:30px;line-height:1;color:var(--muted);padding:0 2px}.drawer-body{padding:24px 28px 100px;overflow:auto}.drawer-hero{border-radius:14px;overflow:hidden;background:#ece8e1;margin-bottom:22px}.drawer-hero img{display:block;width:100%;aspect-ratio:4/3;object-fit:contain;object-position:center}.drawer-section{padding:18px 0;border-top:1px solid var(--line)}.drawer-section:first-of-type{border-top:0;padding-top:0}.drawer-section h3{font:500 10px var(--mono);letter-spacing:.14em;color:var(--muted);text-transform:uppercase;margin:0 0 10px}.drawer-section p{font-size:13px;line-height:1.7;margin:0;color:#3e3a35}.drawer-ref{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:start}.drawer-ref strong{font-size:15px}.drawer-ref a{color:var(--red);font-size:11px;text-decoration:none;border-bottom:1px solid currentColor}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.detail-cell{border:1px solid var(--line);border-radius:10px;padding:11px}.detail-cell span{display:block;font:10px var(--mono);color:#aaa298;margin-bottom:6px}.detail-cell strong{font-size:12px;line-height:1.4}.feedback-label{display:block;margin:14px 0 7px;font:10px var(--mono);letter-spacing:.08em;color:#837a70;text-transform:uppercase}.feedback-section textarea{display:block;width:100%;min-height:116px;resize:vertical;border:1px solid #d8d0c5;border-radius:10px;background:#fffdfa;color:var(--ink);font:13px/1.65 var(--sans);padding:11px 12px;box-sizing:border-box;outline:none;transition:border-color .2s,box-shadow .2s}.feedback-section textarea:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(176,73,54,.12)}.feedback-section textarea::placeholder{color:#aaa198}.feedback-state{font:11px var(--mono)!important;color:#aaa198!important;margin-top:7px!important}.feedback-state.is-saved{color:#657a55!important}.drawer-actions{position:absolute;bottom:0;left:0;right:0;background:rgba(251,249,245,.92);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:14px 28px;display:flex;gap:10px}.drawer-actions .button{flex:1}.toast{position:fixed;left:50%;bottom:26px;z-index:30;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#1d1d1b;color:#fff;padding:11px 15px;border-radius:999px;font-size:12px;box-shadow:var(--shadow);transition:opacity .25s,transform .25s}.toast.is-visible{opacity:1;transform:translate(-50%,0)}
@media(max-width:1200px){.gallery{column-count:3}.command-bar{flex-wrap:wrap}.status-tabs{margin-left:0}.toolbar-reset{margin-left:auto}}
@media(max-width:900px){.masthead{flex-direction:column;padding-top:40px}.hero-metrics{min-width:0;max-width:520px}.layout{grid-template-columns:1fr}.sidebar{position:static;display:grid;grid-template-columns:1fr 1fr}.phase-card{grid-column:span 2}.rules-card{grid-column:span 2}.category-card{max-height:320px;overflow:auto}.command-bar{position:sticky}.search-wrap{flex:1;min-width:220px}.select-wrap{flex:0 0 auto}}
@media(max-width:620px){.masthead{padding:34px 18px 30px}.masthead h1{font-size:52px}.lede{font-size:13px}.hero-metrics{grid-template-columns:repeat(2,1fr)}.layout{padding:26px 18px 60px}.command-bar{padding:10px 18px;gap:7px}.search-wrap{min-width:100%;order:-2}.select-wrap{flex:1}.select-wrap select{max-width:none;width:100%}.status-tabs{width:100%;overflow:auto;justify-content:flex-start}.gallery{column-count:2;column-gap:10px}.shoe-card{margin-bottom:10px;border-radius:12px}.shoe-info{padding:11px}.shoe-info h3{font-size:13px}.shoe-ref{font-size:10px}.shoe-actions{flex-direction:column}.card-action{padding:6px}.sidebar{display:flex}.phase-card,.rules-card{grid-column:auto}.content-heading{align-items:flex-end}.content-heading h2{font-size:23px}.content-actions{flex-direction:column;align-items:flex-end;gap:7px}.footer{flex-direction:column;padding:18px}.drawer-head,.drawer-body{padding-left:20px;padding-right:20px}.drawer-actions{padding:12px 20px}}

@media(max-width:620px){.layout,.sidebar,.content,.gallery,.side-card,.category-row{min-width:0}.category-row{width:100%}.category-name{min-width:0;overflow-wrap:anywhere}}

@media (hover:none){.shoe-info{max-height:220px;background:rgba(255,253,250,.97)}.shoe-ref{display:none}.tag-row{display:none}.shoe-actions{margin-top:8px}}
.imagegen-action{color:#9a503e;border-color:#e8b2a5}.imagegen-action:hover{border-color:var(--red);background:#fff4f1;color:#9c3f33}.generation-section{background:#fff8f4;border:1px solid #f0d8cf;border-radius:12px;padding:14px;margin-top:12px}.drawer-section.generation-section h3{color:#a64e3a}.generation-state{font:11px var(--mono)!important;color:#9a948b!important;margin-top:8px!important}.generation-state.generated{color:#5a7447!important}.generation-state.failed{color:#a33a33!important}.generation-state.generating,.generation-state.queued{color:#9a6b3b!important}.drawer-actions{flex-wrap:wrap}.drawer-actions #drawer-generate{min-width:140px}
.review-sync-state{font:10px var(--mono);color:#6f7f64;white-space:nowrap}.review-sync-state.is-warning{color:#a14c3d}
.import-review-note{background:#fffdfa;border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin:0 0 18px;color:var(--muted);font-size:12px;line-height:1.7}.import-review-note p{margin:0}.import-review-note a,.imported-visual-section a{color:var(--red);text-decoration:none;border-bottom:1px solid currentColor}.imported-visual-section p+p{margin-top:8px}.imported-visual-section details{margin-top:12px}.imported-visual-section summary{cursor:pointer;font-size:12px;color:var(--muted)}.generation-summary{white-space:normal;max-width:330px;line-height:1.5;text-align:right}
.driving-diversity-card .shoe-visual{aspect-ratio:1/1;min-height:260px;padding:28px 8px 68px;box-sizing:border-box}
.driving-diversity-card .shoe-visual img{background:transparent}