*{box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden}body{margin:0;background:#090b0e;color:#f4f6f8;font-family:Arial,Microsoft YaHei,sans-serif}main{height:100%;overflow:hidden}header{height:64px;border-bottom:1px solid #272c34;display:flex;align-items:center;padding:0 22px}header div{display:grid;gap:3px}header small{color:#8892a0}header button,.comments button{margin-left:auto;background:#75d0cd;border:0;border-radius:9px;padding:10px 15px;display:flex;gap:7px}.review{height:calc(100vh - 64px);min-height:0;display:grid;grid-template-columns:190px 1fr 320px;overflow:hidden}.review>aside{min-height:0;border-right:1px solid #252a31;padding:12px}.review>aside>button{width:100%;border:0;background:transparent;color:#a8b0bc;padding:11px;text-align:left;border-radius:7px}.review>aside>button.active{background:#252b34;color:#fff}.stage{position:relative;display:grid;place-items:center;overflow:hidden}.stage img{max-width:90%;max-height:86%;object-fit:contain}.stage canvas{position:absolute}.stage nav{position:absolute;top:16px;display:flex;background:#1d2229;border:1px solid #343b45;border-radius:10px;padding:5px}.stage nav button,.prev,.next{background:transparent;color:#fff;border:0;padding:8px}.prev,.next{position:absolute;left:15px;top:50%}.next{left:auto;right:15px}.comments{height:100%;min-height:0;border-left:1px solid #252a31!important;border-right:0!important;padding:18px!important;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}.comments textarea{width:100%;height:130px;background:#171b20;color:#fff;border:1px solid #343b45;border-radius:9px;padding:10px;resize:vertical}.comments button{margin:10px 0 0;width:100%;justify-content:center}.comments button:disabled{opacity:.45;cursor:not-allowed}.comments>p{color:#7f8997;font-size:12px;margin-top:28px}.comment-message{display:block;min-height:20px;margin-top:8px;color:#75d0cd}.saved-comments{display:grid;gap:8px;margin-top:12px}.saved-comments article{padding:10px;background:#171b20;border:1px solid #303641;border-radius:8px}.saved-comments p{margin:0;color:#dfe5ed;font-size:13px;line-height:1.5;white-space:pre-wrap}.placeholder,.loading{color:#84909e}.loading{height:100vh;display:grid;place-items:center}.image-canvas{position:relative;display:inline-block;max-width:90%;max-height:86%}.image-canvas.marking{cursor:crosshair}.stage .image-canvas img{display:block;max-width:100%;max-height:calc(100vh - 150px);object-fit:contain;-webkit-user-select:none;user-select:none}.point-marker{position:absolute;z-index:2;width:28px;height:28px;display:grid;place-items:center;transform:translate(-50%,-50%);border-radius:50%;font-size:13px;font-weight:700;pointer-events:none}.point-marker.saved{color:#fff;background:#5c7cf6;border:2px solid white;box-shadow:0 2px 8px #0009}.point-marker.draft{color:#fff;background:#ff6b6b;border:2px solid white}.point-marker svg{width:16px}.rect-marker{position:absolute;z-index:2;pointer-events:none;border:3px solid #5c7cf6;background:#5c7cf629;box-shadow:0 0 0 1px #ffffffb3}.rect-marker.draft{border-color:#ff6b6b;background:#ff6b6b29}.rect-marker i{position:absolute;left:-12px;top:-12px;width:24px;height:24px;display:grid;place-items:center;color:#fff;background:#5c7cf6;border:2px solid #fff;border-radius:50%;font-size:11px;font-style:normal;font-weight:700}.arrow-marker{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;width:100%;height:100%;overflow:visible;pointer-events:none}.arrow-marker line{stroke:#5c7cf6;stroke-width:4;filter:drop-shadow(0 1px 1px #000)}.arrow-marker path{fill:#5c7cf6}.arrow-marker.draft line{stroke:#ff6b6b}.arrow-marker.draft path{fill:#ff6b6b}.arrow-number{position:absolute;z-index:3;width:24px;height:24px;display:grid;place-items:center;transform:translate(-50%,-50%);color:#fff;background:#5c7cf6;border:2px solid #fff;border-radius:50%;font-size:11px;font-weight:700;pointer-events:none}.path-marker{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;width:100%;height:100%;pointer-events:none}.path-marker path{fill:none;stroke:#5c7cf6;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 1px #000)}.path-marker.draft path{stroke:#ff6b6b}.path-number{position:absolute;z-index:3;width:24px;height:24px;display:grid;place-items:center;transform:translate(-50%,-50%);color:#fff;background:#5c7cf6;border:2px solid #fff;border-radius:50%;font-size:11px;font-weight:700;pointer-events:none}.prev,.next{z-index:4}.comment-mode{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:10px}.comments .comment-mode button{margin:0;padding:9px 3px;color:#aab4c2;background:#171b20;border:1px solid #343b45;font-size:11px}.comments .comment-mode button.active{color:#fff;background:#33446f;border-color:#5c7cf6}.comments .marking-tip{margin:0 0 10px;color:#f3bf72;font-size:12px;line-height:1.5}.comments .undo-draft{margin:0 0 10px;color:#f4c879;background:#2a2419;border:1px solid #594929}.comments .undo-draft svg,.saved-comments .delete-annotation svg{width:15px;height:15px}.saved-comments article{position:relative;padding-right:74px}.saved-comments .delete-annotation{position:absolute;right:8px;top:8px;width:auto;margin:0;padding:5px 7px;color:#ff9aa7;background:#321c22;border:1px solid #60303a;font-size:12px}.saved-comments b{color:#8fa6ff}.stage-tools{position:absolute;z-index:10;top:14px;left:50%;display:flex;align-items:center;gap:4px;transform:translate(-50%);padding:5px;background:#1d2229;border:1px solid #343b45;border-radius:10px;box-shadow:0 4px 14px #0006}.stage-tools button{width:34px;height:32px;display:grid;place-items:center;padding:0;color:#e8edf5;background:transparent;border:0;border-radius:6px;cursor:pointer}.stage-tools button:hover:not(:disabled),.stage-tools button.active{color:#fff;background:#3a496f}.stage-tools button:disabled{opacity:.35;cursor:not-allowed}.stage-tools button svg{width:17px;height:17px}.stage-tools span{min-width:50px;color:#aeb8c6;text-align:center;font-size:12px}.image-canvas{transform-origin:center center;will-change:transform}.image-canvas.pan-mode{cursor:grab}.image-canvas.panning{cursor:grabbing}header .task-title{display:grid;gap:3px}.header-actions{display:flex;gap:8px;margin-left:auto}.header-actions button{margin:0;align-items:center;color:#111827;cursor:pointer}.header-actions button:disabled{opacity:.5;cursor:not-allowed}.header-actions .request-changes{color:#e8edf5;background:#29313d;border:1px solid #46515f}.header-actions .approve-task{background:#75d0cd}.header-actions svg,.approved-status svg{width:17px;height:17px}.approved-status{display:flex;align-items:center;gap:6px;margin-left:18px;padding:6px 10px;color:#9ce2d8;background:#19302e;border:1px solid #31514d;border-radius:999px;font-size:13px}.version-picker{margin-left:28px;display:flex;align-items:center;gap:8px;color:#8f9aa8;font-size:13px}.version-picker select{height:36px;padding:0 30px 0 10px;color:#e8edf5;background:#171b20;border:1px solid #343b45;border-radius:8px}.comments .history-notice{margin:0 0 12px;padding:9px;color:#f3bf72;background:#2a2419;border:1px solid #594929;border-radius:7px;line-height:1.5}.stage-tools .compare-toggle{width:auto;padding:0 10px}.customer-version-compare{position:relative;display:inline-block;height:calc(100vh - 150px);max-width:90%;overflow:hidden}.customer-version-compare>img{display:block;width:auto;height:100%;max-width:100%;object-fit:contain}.customer-version-compare>img.customer-version-current{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;max-width:none}.compare-divider{position:absolute;top:0;bottom:0;width:2px;transform:translate(-1px);background:#fff;box-shadow:0 0 8px #000}.compare-label{position:absolute;top:12px;padding:5px 8px;color:#fff;background:#0a0d12cc;border-radius:6px;font-size:12px}.compare-label.before{left:12px}.compare-label.after{right:12px}.customer-version-compare input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}.customer-reply{margin-top:9px;padding:9px;color:#cbeee8;background:#152725;border:1px solid #31524d;border-radius:7px}.customer-reply b{display:block;margin-bottom:4px;color:#75d0cd}.customer-reply p{margin:0!important;color:#d8f4ef!important;white-space:pre-wrap}.customer-reply small{display:block;margin-top:5px;color:#7f9b97}.header-actions .download-all,.comments .download-current{display:flex;align-items:center;justify-content:center;gap:7px;color:#e8edf5;text-decoration:none;background:#33446f;border:1px solid #5c7cf6;border-radius:9px}.header-actions .download-all{padding:9px 13px}.comments .download-current{width:100%;margin:0 0 12px;padding:9px}.header-actions .download-all:hover,.comments .download-current:hover{background:#40558a}.header-actions .download-all svg,.comments .download-current svg{width:17px;height:17px}.approval-progress{margin-left:18px;padding:6px 10px;color:#b7c1ce;background:#171b20;border:1px solid #343b45;border-radius:999px;font-size:12px;white-space:nowrap}.review>aside>button.image-list-item{display:flex;align-items:center;gap:8px}.image-list-item span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.image-list-item .image-state{margin-left:auto;padding:3px 6px;border-radius:999px;font-size:10px;font-style:normal;white-space:nowrap}.image-state.pending_client{color:#9aa6b5;background:#252b34}.image-state.needs_fix{color:#ffc27a;background:#3b2b1d}.image-state.approved{color:#8fe0d2;background:#19332f}.image-decision{margin-bottom:12px;padding:11px;background:#171b20;border:1px solid #343b45;border-radius:10px}.image-decision>span{display:block;margin-bottom:9px;font-size:13px;font-weight:700}.image-status.pending_client{color:#b8c1cd}.image-status.needs_fix{color:#ffc27a}.image-status.approved{color:#8fe0d2}.image-decision>div{display:grid;grid-template-columns:1fr 1fr;gap:7px}.comments .image-decision button{width:100%;margin:0;padding:8px}.comments .image-needs-fix{color:#f4c879;background:#332719;border:1px solid #6b4d28}.comments .image-approve{color:#10201d;background:#75d0cd}.comments .image-approve svg{width:15px}.comments .approved-notice{margin:0 0 12px;padding:9px;color:#9ce2d8;background:#19302e;border:1px solid #31514d;border-radius:7px;line-height:1.5}.access-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% 25%,#182134 0,#090b0e 48%)}.access-card{width:min(390px,100%);display:grid;gap:14px;padding:34px;background:#171b20;border:1px solid #343b45;border-radius:18px;box-shadow:0 22px 70px #0009;text-align:center}.access-card>svg{width:42px;height:42px;margin:auto;color:#75d0cd}.access-card h1,.access-card p{margin:0}.access-card p{color:#a8b0bc;line-height:1.6}.access-card input{padding:14px;color:#fff;background:#0d1014;border:1px solid #3d4653;border-radius:10px;text-align:center;font-size:19px;letter-spacing:5px;outline:none}.access-card input:focus{border-color:#75d0cd;box-shadow:0 0 0 3px #75d0cd22}.access-card button{padding:13px;color:#102020;background:#75d0cd;border:0;border-radius:10px;font-weight:700;cursor:pointer}.access-card button:disabled{opacity:.45;cursor:not-allowed}.access-card small{color:#ff8f9c}.access-card em{color:#7f8997;font-size:12px;font-style:normal}.watermark-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr);overflow:hidden;pointer-events:none}.watermark-layer span{display:grid;place-items:center;color:#fff9;font-size:clamp(12px,1.4vw,20px);font-weight:700;letter-spacing:2px;text-shadow:0 1px 3px #000c;transform:rotate(-24deg);white-space:nowrap;-webkit-user-select:none;user-select:none}.reference-picker{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:9px;padding:9px;color:#b7c3d4;background:#171b20;border:1px dashed #46515f;border-radius:8px;font-size:12px;cursor:pointer}.reference-picker:hover{color:#fff;border-color:#6d85da}.reference-picker svg{width:17px}.reference-picker input{display:none}.reference-drafts,.reference-images{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}.reference-drafts figure{position:relative;margin:0}.reference-drafts img,.reference-images img{width:100%;height:62px;display:block;object-fit:cover;border:1px solid #3b4450;border-radius:6px}.reference-drafts button{position:absolute;right:3px;top:3px;width:22px;height:22px;margin:0;padding:3px;color:#fff;background:#1a1d23cc;border:0;border-radius:50%}.reference-drafts button svg{width:14px}.reference-images{padding-right:64px}.reference-images a{display:block}.reference-images img:hover{border-color:#7892ef}.annotation-conversation{display:grid;gap:8px;margin-top:8px}.conversation-message{padding:10px;border-radius:8px;background:#20252d}.conversation-message.customer{border-left:3px solid #f0ad4e}.conversation-message.retoucher{border-left:3px solid #5b7cfa}.conversation-message p{margin:5px 0}.conversation-message small{color:#8290a6}.follow-up-editor{display:grid;gap:8px;margin-top:10px}.follow-up-editor textarea{min-height:70px}.customer-notifications{position:relative}.header-actions .customer-notification-bell{position:relative;width:38px;height:38px;display:grid;place-items:center;padding:0;color:#dce5f2;background:#202631;border:1px solid #3a4350}.customer-notification-bell svg{width:18px}.customer-notification-bell>i{position:absolute;right:-6px;top:-7px;min-width:18px;height:18px;display:grid;place-items:center;padding:0 4px;color:#fff;background:#ef5b6d;border:2px solid #090b0e;border-radius:10px;font-size:10px;font-style:normal}.customer-notification-popover{position:absolute;z-index:30;right:0;top:46px;width:340px;overflow:hidden;color:#edf2f7;background:#171b20;border:1px solid #343b45;border-radius:11px;box-shadow:0 16px 45px #000b}.customer-notification-popover>header{height:auto;padding:12px;display:flex;border-bottom:1px solid #303641}.customer-notification-popover>header button{width:auto;margin-left:auto;padding:0;color:#91a8ff;background:transparent}.customer-notification-popover>div{max-height:420px;overflow:auto}.customer-notification-popover>div>button{width:100%;margin:0;padding:12px;color:#aeb8c5;background:transparent;border:0;border-bottom:1px solid #282e37;text-align:left}.customer-notification-popover>div>button.unread{color:#fff;background:#1c2638}.customer-notification-popover span{display:grid;gap:4px}.customer-notification-popover p{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.customer-notification-popover small{color:#7e8998}.notification-empty{padding:24px;color:#7e8998;text-align:center}