:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#eef2f0;color:#17211d;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{border:0}.app-shell{display:grid;grid-template-columns:minmax(0,1fr) 320px;min-height:100vh}.workspace{padding:28px}.topbar,.result-panel,.side-header,.photo-toolbar,.actions,.toolbar-actions,.stats-row,.stat,.icon-button,.notice,.warning,.candidate-row{display:flex;align-items:center}.topbar{justify-content:space-between;gap:20px;margin-bottom:18px}.eyebrow{margin:0 0 6px;color:#526159;font-size:12px;font-weight:800;text-transform:uppercase}h1,h2,h3,p{margin:0}h1{font-size:36px;line-height:1.05}h2{font-size:22px}h3{overflow:hidden;max-width:260px;font-size:15px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}.actions{flex-wrap:wrap;justify-content:flex-end;gap:10px}.icon-button,.icon-only,.candidate,.candidate-remove{cursor:pointer;transition:transform .15s ease,background-color .15s ease,border-color .15s ease,color .15s ease}.icon-button{gap:8px;min-height:42px;padding:0 16px;border-radius:8px;font-weight:800}.glyph{display:inline-grid;flex:0 0 auto;place-items:center;width:18px;height:18px;font-size:17px;line-height:1}.glyph-upload:before{content:"+";font-size:23px;font-weight:900}.glyph-shuffle:before{content:"↝";font-size:21px;font-weight:900}.glyph-image:before{content:"▧"}.glyph-users:before{content:"◉"}.glyph-auto:before{content:"✦"}.glyph-manual:before{content:"⌖"}.glyph-refresh:before{content:"↻";font-size:20px}.glyph-trash:before{content:"×";font-size:24px;font-weight:900}.glyph-loader:before{content:"◌";font-size:22px}.glyph-person:before{content:"●"}.glyph-crosshair:before{content:"⌖";font-size:20px}.glyph-alert:before{content:"!";font-weight:900}.icon-button:active,.icon-only:active,.candidate:active,.candidate-remove:active{transform:translateY(1px)}.icon-button.primary{background:#176f58;color:#fff}.icon-button.ghost{background:#fff;color:#17211d;box-shadow:inset 0 0 0 1px #d5ddd8}.icon-button.subtle{background:#ecf4ef;color:#176f58}.icon-button:disabled,.icon-only:disabled{cursor:not-allowed;opacity:.45}.stats-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}.stat{min-height:62px;gap:10px;padding:14px;border:1px solid #d7dfda;border-radius:8px;background:#fff}.stat span{color:#526159;font-size:13px;font-weight:700}.stat strong{margin-left:auto;font-size:24px}.result-panel{justify-content:flex-start;gap:18px;margin-bottom:16px;padding:16px;border:1px solid #94c8aa;border-radius:8px;background:#fff}.result-panel>div{min-width:0}.result-panel h2{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.result-panel .icon-button{margin-left:auto}.result-label{margin-bottom:4px;color:#176f58;font-size:12px;font-weight:900}.result-panel p:last-child{margin-top:4px;color:#526159}.dropzone{display:flex;align-items:center;gap:14px;min-height:92px;margin-bottom:18px;padding:20px;border:2px dashed #a9b7af;border-radius:8px;background:#f8fbf9;color:#35423b;cursor:pointer}.dropzone.dragging{border-color:#176f58;background:#e8f4ee}.dropzone div{display:grid;gap:4px}.dropzone span{color:#66756d;font-size:14px}.file-input{display:none}.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.photo-card,.side-panel,.empty-state{border:1px solid #d7dfda;border-radius:8px;background:#fff}.photo-card{overflow:hidden}.photo-toolbar{justify-content:space-between;gap:12px;padding:12px 12px 10px}.photo-toolbar p{margin-top:4px;color:#66756d;font-size:13px}.toolbar-actions{gap:6px}.icon-only{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:8px;background:#edf2ef;color:#24312b}.icon-only.active{background:#176f58;color:#fff}.icon-only.danger{color:#9f2a2a}.photo-stage{position:relative;overflow:hidden;width:100%;max-height:520px;background:#17211d}.photo-stage img{display:block;width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none}.stage-overlay{position:absolute;inset:0;display:grid;place-items:center;background:#17211d5c;color:#fff}.person-box{position:absolute;display:grid;place-items:center;min-width:26px;min-height:26px;border:3px solid #ffd84b;border-radius:8px;background:#ffd84b1f;color:#fff;font-size:13px;font-weight:900;text-shadow:0 1px 2px rgb(0 0 0 / 70%)}.person-box.picked{border-color:#ff5c4d;background:#ff5c4d3d;box-shadow:0 0 0 4px #ff5c4d3d}.warning,.hint{margin:10px 12px 12px;color:#7c4b00;font-size:13px}.warning{gap:7px}.hint{color:#176f58}.empty-state{display:grid;place-items:center;min-height:280px;padding:34px;text-align:center}.empty-state h2{margin-top:12px}.empty-state p{max-width:420px;margin-top:8px;color:#66756d}.side-panel{position:sticky;top:0;overflow:auto;height:100vh;padding:20px;border-top:0;border-right:0;border-bottom:0;border-radius:0}.side-header{justify-content:space-between;gap:10px;margin-bottom:12px}.notice{gap:8px;margin-bottom:12px;padding:10px 12px;border-radius:8px;background:#edf7f0;color:#176f58;font-size:13px;font-weight:800}.candidate-list{display:grid;gap:8px}.candidate-row{gap:8px;min-height:62px;padding:4px;border:1px solid #d7dfda;border-radius:8px;background:#fff}.candidate{display:grid;grid-template-columns:42px minmax(0,1fr);gap:2px 10px;width:100%;min-width:0;min-height:52px;padding:6px;border:0;border-radius:8px;background:transparent;color:#17211d;text-align:left}.candidate>.glyph,.candidate>.face-thumb{grid-row:span 2}.candidate span,.candidate small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.candidate span{font-weight:900}.candidate small{color:#66756d}.candidate-row.selected{border-color:#ff5c4d;background:#fff6f4}.candidate-remove{display:inline-grid;flex:0 0 34px;place-items:center;width:34px;height:34px;border-radius:8px;background:#fff0ed;color:#9f2a2a}.muted{color:#66756d;line-height:1.5}.face-thumb{position:relative;display:block;flex:0 0 42px;overflow:hidden;width:42px;height:42px;border:2px solid #fff;border-radius:8px;background:#17211d;box-shadow:0 0 0 1px #cfdad4}.face-thumb.large{flex-basis:78px;width:78px;height:78px;border-color:#fff7d6;box-shadow:0 0 0 1px #e3d59b,0 10px 26px #17211d24}.face-thumb.spotlight{flex-basis:clamp(210px,28vw,320px);width:clamp(210px,28vw,320px);height:clamp(210px,28vw,320px);border:4px solid #fff7d6;border-radius:28px;box-shadow:0 0 0 1px #ffffff3d,0 24px 80px #0000004d}.face-thumb img{position:absolute;top:0;left:0;max-width:none;object-fit:fill;transform-origin:top left;-webkit-user-select:none;user-select:none}.draw-overlay{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:28px;background:radial-gradient(circle at top,rgb(255 216 75 / 18%),transparent 28%),radial-gradient(circle at bottom,rgb(23 111 88 / 24%),transparent 34%),#0a1612d1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.draw-modal{position:relative;display:grid;justify-items:center;width:min(100%,820px);min-height:min(86vh,720px);padding:36px 32px 30px;border:1px solid rgb(255 255 255 / 12%);border-radius:32px;background:linear-gradient(180deg,#f6f8f4fa,#eaf1ebf5);box-shadow:0 28px 90px #00000047,inset 0 1px #fffc;animation:drawModalIn .32s ease}.draw-close{position:absolute;top:18px;right:18px;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:999px;background:#17211d14;color:#17211d}.draw-kicker{margin-bottom:12px;color:#176f58;font-size:12px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}.draw-stage{position:relative;display:grid;place-items:center;width:100%;min-height:420px;margin-bottom:20px}.draw-portrait{position:relative;z-index:2}.draw-photo-frame{position:relative;z-index:2;overflow:hidden;width:min(72vw,720px);max-width:100%;aspect-ratio:4 / 3;border:4px solid rgb(255 255 255 / 78%);border-radius:28px;background:#17211d;box-shadow:0 0 0 1px #ffffff1f,0 24px 80px #0000004d;animation:drawSpinFrame .2s linear infinite alternate}.draw-photo-image{display:block;width:100%;height:100%;object-fit:contain}.draw-photo-box{position:absolute;border:4px solid #ffd84b;border-radius:18px;background:#ffd84b24;box-shadow:0 0 0 6px #ffd84b29,0 0 28px #ffd84b57;animation:drawBoxPulse .42s ease-in-out infinite alternate}.draw-portrait.revealed .face-thumb{animation:drawRevealBounce .46s cubic-bezier(.18,.9,.26,1.2)}.draw-rings{position:absolute;inset:0;display:grid;place-items:center}.draw-rings span{position:absolute;border:1px solid rgb(23 111 88 / 18%);border-radius:999px;animation:drawRipple 2.1s ease-out infinite}.draw-rings span:nth-child(1){width:min(34vw,320px);height:min(34vw,320px)}.draw-rings span:nth-child(2){width:min(48vw,480px);height:min(48vw,480px);animation-delay:.28s}.draw-rings span:nth-child(3){width:min(62vw,620px);height:min(62vw,620px);animation-delay:.52s}.draw-copy{display:grid;gap:8px;width:100%;max-width:520px;margin-bottom:22px;text-align:center}.draw-copy h2{font-size:clamp(34px,5vw,56px);line-height:.98}.draw-copy p{color:#526159;font-size:16px}.draw-action{min-width:180px;justify-content:center}.spin{animation:spin .8s linear infinite}@keyframes drawModalIn{0%{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes drawSpinPulse{0%{transform:scale(.96) rotate(-2deg);filter:saturate(.8)}to{transform:scale(1.04) rotate(2deg);filter:saturate(1.15)}}@keyframes drawSpinFrame{0%{transform:scale(.985);filter:saturate(.82)}to{transform:scale(1);filter:saturate(1.08)}}@keyframes drawBoxPulse{0%{transform:scale(.98)}to{transform:scale(1.02)}}@keyframes drawRevealBounce{0%{transform:scale(.84)}65%{transform:scale(1.06)}to{transform:scale(1)}}@keyframes drawRipple{0%{opacity:0;transform:scale(.82)}20%{opacity:1}to{opacity:0;transform:scale(1.08)}}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:960px){.app-shell{grid-template-columns:1fr}.workspace{padding:20px}.side-panel{position:static;height:auto;border-top:1px solid #d7dfda;border-left:0}}@media(max-width:680px){.topbar,.result-panel{align-items:flex-start;flex-direction:column}.topbar{margin-bottom:14px}h1{font-size:30px}.actions,.result-panel .icon-button{width:100%}.actions .icon-button,.result-panel .icon-button{justify-content:center;width:100%}.stats-row{grid-template-columns:repeat(2,minmax(0,1fr))}.photo-grid{grid-template-columns:1fr}.dropzone{align-items:flex-start}.draw-overlay{padding:14px}.draw-modal{min-height:calc(100vh - 28px);padding:28px 20px 24px;border-radius:24px}.draw-stage{min-height:320px}.draw-photo-frame{width:100%;border-radius:22px}.draw-photo-box{border-radius:14px}.draw-copy p{font-size:14px}}