:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;color-scheme:light;--bg:#f6f8fb;--ink:#263347;--muted:#7d889b;--line:#e7ebf2;--card:#fff;--primary:#5266d4;--primary-soft:#eef1fd;--subtle:#f8f9fc;--danger:#c64c56;--danger-bg:#fdf0f1;--input:#fff}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.6}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.45;cursor:not-allowed}a{color:var(--primary)}:focus-visible{outline:3px solid #8a9af0;outline-offset:3px}h1,h2,h3,p{margin-top:0}h1{font-size:27px;letter-spacing:-.7px;line-height:1.4}h2{font-size:16px;line-height:1.5}h3{font-size:15px}.icon{width:20px;height:20px;flex-shrink:0;display:inline-block;vertical-align:middle}.muted{color:var(--muted);font-size:13px;line-height:1.8}
.layout{display:flex;min-height:100vh}.sidebar{width:224px;flex-shrink:0;background:var(--card);border-right:1px solid var(--line);padding:30px 18px 20px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{display:flex;gap:11px;align-items:center;font-size:22px;font-weight:700;padding:0 10px 47px;min-width:0}.brand-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.brand-icon{width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--primary);color:#fff;font-size:28px;font-weight:700;line-height:1}.logo-dot{font-size:26px;color:#c5ceff;margin-bottom:1px}.custom-logo{object-fit:contain;background:transparent}.side-label{color:#9aa4b4;font-size:11px;letter-spacing:1px;padding:0 12px 14px}.side-link{width:100%;border:0;padding:12px 13px;background:transparent;border-radius:9px;color:var(--muted);display:flex;align-items:center;gap:12px;text-align:left;margin-bottom:7px;font-size:13px}.side-link:hover{background:var(--subtle);color:var(--ink)}.side-link.active{color:var(--primary);background:var(--primary-soft);font-weight:600}.side-bottom{margin-top:auto;padding-top:40px}.storage{display:flex;gap:11px;align-items:center;padding:15px 10px;margin-bottom:20px;color:var(--muted)}.storage strong{display:block;font-size:12px;font-weight:500;color:var(--ink)}.storage small{display:block;font-size:10px;margin-top:3px}.profile{width:100%;border:0;border-top:1px solid var(--line);background:transparent;display:flex;align-items:center;gap:9px;text-align:left;padding:20px 4px 0}.profile>.icon{width:17px;color:var(--muted)}.avatar{width:34px;height:34px;border-radius:50%;flex-shrink:0;display:inline-grid;place-items:center;background:var(--primary-soft);color:var(--primary);font-weight:600}.avatar.mini{width:30px;height:30px;font-size:12px}.profile-name{font-size:12px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.profile-name small{display:block;font-size:10px;color:var(--muted);margin-top:2px}
.main{flex:1;min-width:0;max-width:1520px;padding:0 clamp(22px,4vw,62px);margin:0 auto}.topbar{padding:36px 0 27px;display:flex;justify-content:space-between;align-items:center;gap:15px}.eyebrow{font-size:10px;letter-spacing:1.4px;color:#9ca5b6;margin-bottom:9px}.topbar h1{margin:0 0 8px}.topbar p{margin:0}.top-actions{display:flex;align-items:center;gap:12px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:8px;padding:9px 15px;background:var(--primary);color:#fff;font-size:12px;font-weight:600;white-space:nowrap;min-height:38px}.btn:hover:not(:disabled){filter:brightness(.95)}.btn .icon{width:16px;height:16px}.btn.ghost{background:var(--card);color:var(--ink);border-color:var(--line)}.btn.danger{background:var(--danger-bg);color:var(--danger)}.btn.full{width:100%;margin-top:6px;min-height:43px}.icon-btn,.text-btn{border:0;background:transparent;color:var(--muted);padding:8px;border-radius:7px}.icon-btn:hover,.text-btn:hover{color:var(--primary);background:var(--primary-soft)}.text-btn{font-size:12px}.text-btn.full{width:100%;margin-top:14px}
.upload-card{padding:27px 28px;display:flex;align-items:center;gap:20px;border:1px dashed #c5cee5;border-radius:12px;background:var(--card)}.upload-card.over{border-color:var(--primary);background:var(--primary-soft)}.upload-symbol{width:49px;height:49px;background:var(--primary-soft);border-radius:13px;display:grid;place-items:center;color:var(--primary);flex-shrink:0}.upload-symbol .icon{width:23px;height:23px}.upload-card h2{font-size:15px;margin:0 0 4px}.upload-card p{margin:0 0 3px;font-size:12px}.upload-hint{font-size:10px;color:#9ba5b7}.upload-card .btn{margin-left:auto}.upload-progress{padding:12px 16px;margin-top:12px;color:var(--primary);background:var(--primary-soft);border-radius:8px;font-size:12px;overflow-wrap:anywhere}.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:20px 0 32px}.stat{padding:18px 22px;background:var(--card);border:1px solid var(--line);border-radius:11px}.stat>span{color:var(--muted);font-size:11px}.stat strong{display:block;font-size:27px;font-weight:600;letter-spacing:-.4px;margin:3px 0}.stat small{color:#a0a9b9;font-size:10px}.collection-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.collection-head h2{font-size:15px;margin:0}.collection-head h2 span,.count-badge{display:inline-block;min-width:21px;font-size:10px;font-weight:500;color:var(--muted);background:var(--line);border-radius:5px;padding:1px 5px;text-align:center;margin-left:7px;vertical-align:middle}
.toolbar{display:flex;align-items:center;gap:10px;margin:0 0 20px}.search{display:flex;align-items:center;gap:9px;background:var(--card);border:1px solid var(--line);padding:0 12px;border-radius:8px;flex:1;min-width:130px;color:#929db0}.search .icon{width:16px}.search input{width:100%;min-width:0;border:0;background:transparent;color:var(--ink);padding:10px 0;font-size:12px;outline:none}.search:focus-within{border-color:var(--primary)}.select-all{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;color:var(--muted);font-size:12px}input[type=checkbox]{accent-color:var(--primary);cursor:pointer;width:16px;height:16px;flex-shrink:0}.toolbar select{width:107px;min-height:39px;padding:7px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:8px;font-size:12px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px}.image-card{background:var(--card);border:1px solid var(--line);border-radius:11px;overflow:hidden;position:relative;transition:box-shadow .15s}.image-card:hover{box-shadow:0 4px 15px #26334709}.image-card.selected{border-color:var(--primary);box-shadow:0 0 0 1px var(--primary)}.image-preview{display:block;height:166px;background:var(--subtle)}.image-preview img{display:block;width:100%;height:100%;object-fit:cover}.check{position:absolute;left:10px;top:10px;width:25px;height:25px;border-radius:6px;background:#ffffffdd;display:grid;place-items:center;z-index:1}.check input{margin:0}.image-info{padding:14px 14px 10px}.image-info strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;font-weight:600}.image-info small{display:flex;gap:8px;font-size:10px;color:var(--muted);margin:6px 0 12px}.image-info button{display:flex;justify-content:space-between;width:100%;background:transparent;color:var(--muted);border:0;border-top:1px solid var(--line);padding:9px 0 1px;font-size:11px}.image-info button:hover{color:var(--primary)}.empty{grid-column:1/-1;text-align:center;padding:60px 20px 70px;border:1px dashed var(--line);border-radius:12px}.empty .icon{width:40px;height:40px;color:#bdc6d8;margin-bottom:15px}.empty h3{margin-bottom:6px;font-size:14px;font-weight:500}.workspace-footer{padding:38px 0 24px;font-size:10px;color:#a5aebc;display:flex;justify-content:space-between}.workspace-footer span{font-weight:600}
.panel{padding:26px;background:var(--card);border:1px solid var(--line);border-radius:12px}.panel h2{margin-bottom:7px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-bottom:18px;border-bottom:1px solid var(--line)}.panel-head p{margin:0;font-size:12px}.table-scroll{overflow-x:auto}table{border-collapse:collapse;width:100%;text-align:left;font-size:13px}th{font-size:11px;color:var(--muted);font-weight:500;background:var(--subtle);padding:12px}td{padding:17px 12px;border-bottom:1px solid var(--line);white-space:nowrap}tr:last-child td{border:0}.user-cell{display:flex;align-items:center;gap:10px}.user-cell strong{font-size:12px;font-weight:500}.pill{font-size:10px;display:inline-block;background:var(--primary-soft);color:var(--primary);padding:4px 10px;border-radius:5px}.pill.neutral{background:var(--subtle);color:var(--muted)}.settings-form{width:100%;display:grid;gap:20px}.settings-form .field>input{max-width:410px}.setting-row{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:19px 0;border-bottom:1px solid var(--line);cursor:pointer}.setting-row:last-child{border-bottom:0;padding-bottom:3px}.setting-row strong{font-size:13px;font-weight:500}.setting-row p{margin:5px 0 0;font-size:11px}input.switch{appearance:none;width:35px;height:20px;background:#ccd3df;border-radius:20px;position:relative;margin:0}input.switch::before{content:'';position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:white;transition:transform .15s}input.switch:checked{background:var(--primary)}input.switch:checked::before{transform:translateX(15px)}.logo-controls{display:flex;align-items:center;gap:9px}.path-preview{margin-top:20px;padding:14px;background:var(--subtle);border:1px solid var(--line);border-radius:8px;overflow-wrap:anywhere}.path-preview span{display:block;font-size:10px;color:var(--muted);margin-bottom:4px}.path-preview code{display:block;color:var(--primary);font-size:11px;margin-bottom:10px}.path-preview code:last-child{margin-bottom:0}.settings-save{display:flex;align-items:center;justify-content:flex-end;gap:15px;padding:0 0 12px}
.auth-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px}.auth-card{width:100%;max-width:432px;padding:36px;background:var(--card);border:1px solid var(--line);border-radius:15px;box-shadow:0 12px 40px #26334707}.auth-brand{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:650;margin-bottom:33px}.auth-card h1{margin:0 0 9px;font-size:23px}.auth-card>.muted{margin:0 0 23px;font-size:12px}.auth-footer{color:#a5aebc;font-size:10px;margin-top:22px}.field{display:flex;flex-direction:column;gap:7px;margin:16px 0}.field>span{font-size:12px;color:var(--ink);font-weight:500}.field input,.field select,textarea{padding:10px 12px;border:1px solid var(--line);background:var(--input);color:var(--ink);border-radius:8px;width:100%;min-width:0;font-size:13px}input::placeholder,textarea::placeholder{color:#a5aebd;font-size:12px}.field input:focus,.field select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}.field input[aria-invalid=true]{border-color:var(--danger)}.checkbox-line{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:11px}.checkbox-line input{margin:0;width:14px;height:14px}.form-error{color:var(--danger);font-size:12px;margin:10px 0;overflow-wrap:anywhere}.form-error:empty{display:none}.tip{border-top:1px solid var(--line);padding-top:20px;font-size:10px;color:var(--muted);margin:24px 0 0;text-align:center}.modal{background:var(--card);color:var(--ink);width:calc(100% - 32px);max-width:444px;max-height:calc(100vh - 40px);padding:29px;border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 90px #0c183a30;overflow-y:auto}.modal::backdrop{background:#18233370}.modal>h2{font-size:19px;margin:0 30px 9px 0}.modal>p{font-size:12px}.close{position:absolute;right:14px;top:14px}.close .icon{width:18px;height:18px}.token-create{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;margin:20px 0}.token-create .field{margin:0;flex:1;max-width:420px}.token-create .form-error{flex-basis:100%;margin:0}.token-row{display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid var(--line);padding:16px 0}.token-row strong{font-size:13px}.token-row small{display:block;color:var(--muted);margin-top:4px;font-size:11px}.api-note{background:var(--subtle);border:1px solid var(--line);border-radius:8px;padding:17px;margin-top:24px}.api-note>strong,.api-note>code{display:block;margin-bottom:6px;font-size:12px}.api-note p{margin:0;font-size:11px}.toast{position:fixed;right:22px;bottom:22px;background:#263347;color:#fff;padding:12px 18px;border-radius:9px;z-index:20;font-size:12px;box-shadow:0 6px 25px #0002;max-width:calc(100vw - 44px);overflow-wrap:anywhere}.clipboard-field{position:fixed;left:-9999px}
.dark{color-scheme:dark;--bg:#111823;--ink:#dce3ee;--muted:#919fb4;--line:#2a3647;--card:#1a2432;--primary:#91a1f6;--primary-soft:#2a3659;--subtle:#202c3e;--danger:#f099a2;--danger-bg:#422d38;--input:#16202d}.dark .btn:not(.ghost):not(.danger),.dark .brand-icon:not(.custom-logo){color:#132039}.dark .upload-card{border-color:#40516b}.dark .check{background:#1a2432dd}
@media(min-width:1600px){.main{padding-left:64px;padding-right:64px}}@media(max-width:1100px){.sidebar{width:195px}.main{padding:0 25px}.toolbar{flex-wrap:wrap}.search{min-width:190px}}@media(max-width:780px){.sidebar{width:66px;padding:25px 8px 16px}.brand{padding:0 8px 36px}.brand-name,.side-label,.side-link span,.storage,.profile-name,.profile>.icon{display:none}.side-link{justify-content:center;padding:12px}.profile{justify-content:center}.main{padding:0 18px}.topbar{padding-top:25px;align-items:flex-start}.topbar h1{font-size:23px}.topbar p{font-size:11px}.top-actions{gap:4px}.upload-card{padding:20px;gap:13px;flex-wrap:wrap}.upload-description{flex:1;min-width:160px}.upload-card .btn{margin-left:62px}.stats-row{gap:9px;margin-bottom:24px}.stat{padding:13px}.stat strong{font-size:22px}.stat small{display:none}.search{flex-basis:100%}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.image-preview{height:140px}.panel{padding:20px}.setting-row{align-items:flex-start}.logo-controls{flex-wrap:wrap;justify-content:flex-end}.panel-head{align-items:flex-start}}
@media(max-width:480px){.sidebar{width:56px;padding-left:3px;padding-right:3px}.brand{padding-left:8px}.brand-icon{width:31px;height:31px}.main{padding:0 13px}.topbar{flex-wrap:wrap;gap:12px;padding-bottom:20px}.top-actions{width:100%;justify-content:flex-end}.top-actions .btn{min-height:33px}.upload-card{padding:16px}.upload-description{min-width:140px}.upload-symbol{width:36px;height:36px}.upload-card .btn{margin-left:0}.stats-row{gap:6px}.stat{padding:10px}.stat>span{font-size:10px}.stat strong{font-size:18px}.toolbar{gap:7px}.toolbar .btn{padding:8px;font-size:11px}.toolbar select{width:86px;font-size:11px}.grid{grid-template-columns:minmax(0,1fr)}.image-preview{height:180px}.panel{padding:16px}.panel-head{flex-wrap:wrap}.setting-row p{max-width:230px}.logo-controls .text-btn{display:none}.auth-card{padding:27px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Separate upload and library workspaces share compact, left-to-right cards. */
.upload-card{min-height:300px;padding:36px 24px;flex-direction:column;justify-content:center;gap:17px;text-align:center}
.upload-symbol{width:58px;height:58px;border-radius:16px}
.upload-symbol .icon{width:28px;height:28px}
.upload-description{flex:none;min-width:0}
.upload-description h2{font-size:19px;margin-bottom:7px}
.upload-card .btn{margin:0;min-width:116px}
.upload-hint{display:block}
.upload-results{margin-top:28px}
.upload-results[hidden]{display:none}
.upload-results-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.upload-results-head h2{margin:0 0 4px;font-size:15px}
.upload-results-head .muted{font-size:11px}
.upload-copy-hint{font-size:11px;margin:16px 0 0}
.stats-row{margin-top:0}
.batch-copy{display:flex;flex-wrap:wrap;gap:6px}
.toolbar{flex-wrap:wrap}
.grid,.card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.image-card{min-width:0;display:flex;flex-direction:column}
.grid>.empty{grid-column:1/-1}
.image-preview{height:168px;cursor:zoom-in;flex-shrink:0}
.image-preview img{object-fit:cover;object-position:center}
.image-info{flex:1;padding:13px 13px 12px;min-width:0}
.image-info small{gap:5px;flex-wrap:wrap;align-items:center}
.card-actions{display:flex;align-items:center;gap:6px}
.image-info>.card-actions{border-top:1px solid var(--line);padding-top:10px}
.card-action,.image-info .card-action{display:inline-flex;align-items:center;justify-content:center;flex:1;width:auto;min-width:0;min-height:34px;margin:0;padding:7px;border:0;border-radius:7px;background:transparent;color:var(--muted);cursor:pointer}
.card-action .icon{width:19px;height:19px}
.card-action:hover,.image-info .card-action:hover{color:var(--primary);background:var(--primary-soft)}
.card-action.active,.image-info .card-action.active{color:var(--primary);background:var(--primary-soft)}
.card-action.delete-action:hover,.image-info .card-action.delete-action:hover{color:var(--danger);background:var(--danger-bg)}
.card-link{display:block;width:100%;min-width:0;height:36px;border:1px solid var(--line);border-radius:7px;background:var(--input);color:var(--ink);font-size:12px;padding:8px 10px}
.card-link:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.link-control .card-actions{margin-top:9px}
.upload-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--muted);font-size:12px;cursor:default}
.upload-placeholder .icon{width:34px;height:34px;opacity:.6}
.upload-result-card.success .upload-file-status{color:#27816b}
.dark .upload-result-card.success .upload-file-status{color:#82cfb2}
.upload-result-card.failed .upload-file-status,.upload-result-card.failed .upload-placeholder{color:var(--danger)}
.upload-result-card.uploading .upload-file-status{color:var(--primary)}
.upload-card-message{margin:0;min-height:79px;display:flex;align-items:center;font-size:11px;overflow-wrap:anywhere}
.image-modal{width:calc(100% - 32px);max-width:1000px;padding:26px;margin:auto}
.image-modal>h2{font-size:16px;overflow-wrap:anywhere}
.preview-stage{display:flex;align-items:center;justify-content:center;background:var(--subtle);border:1px solid var(--line);border-radius:9px;margin-top:18px;min-height:180px;height:52vh}
.preview-stage img{display:block;max-width:100%;max-height:100%;object-fit:contain}
.preview-meta{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:12px 0 18px}
.preview-meta a{font-size:12px;text-decoration:none}
.preview-meta a:hover{text-decoration:underline}
.preview-links{border-top:1px solid var(--line);padding-top:16px}
.preview-links .link-control{display:flex;align-items:center;gap:12px}
.preview-links .card-link{flex:1}
.preview-links .card-actions{margin:0;width:156px;flex-shrink:0}
@media(max-width:1100px){.grid,.card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:780px){.upload-card{min-height:280px;padding:28px 18px}.grid,.card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.image-preview{height:150px}.image-modal{padding:20px}.preview-stage{height:42vh}}
@media(max-width:480px){.upload-card{min-height:280px}.upload-description h2{font-size:17px}.upload-description p{font-size:12px}.upload-hint{font-size:10px;line-height:1.8}.upload-results-head{gap:8px}.batch-copy{width:100%}.batch-copy .btn{flex:1}.grid,.card-grid{grid-template-columns:minmax(0,1fr)}.image-preview{height:180px}.card-action,.image-info .card-action{min-height:40px}.preview-meta{flex-wrap:wrap}.image-modal{padding:18px}.preview-stage{height:36vh;min-height:120px}.preview-links .link-control{display:block}.preview-links .card-actions{margin-top:9px;width:100%}}

/* Keep uploader attribution compact, including long usernames. */
.image-owner{display:flex!important;align-items:center;gap:5px;min-width:0}.image-owner .icon{width:13px;height:13px;flex:none}.image-owner span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Public landing page */
.brand-link,.public-brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}.public-home{min-height:100vh;display:flex;flex-direction:column;background:var(--bg);color:var(--ink)}.public-nav{height:72px;padding:0 clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:var(--card)}.public-brand strong{font-size:20px}.public-nav nav{display:flex;align-items:center;gap:14px}.public-hero{width:min(1200px,calc(100% - 36px));margin:0 auto;padding:78px 0 50px;flex:1}.public-hero>h1{font-size:clamp(30px,5vw,52px);letter-spacing:-.04em;margin:10px 0 12px}.public-hero>p{font-size:15px;margin-bottom:38px}.public-drop{cursor:pointer;border:1px dashed var(--primary);background:var(--card);box-shadow:0 12px 40px #2633470d}.public-drop.over{border-style:solid;background:var(--primary-soft);transform:translateY(-2px)}.public-locked{opacity:.92}.public-results{margin-top:34px}.public-footer{text-align:center;padding:24px;color:var(--muted);font-size:12px;border-top:1px solid var(--line)}
@media(max-width:600px){.public-nav{height:62px;padding:0 16px}.public-brand strong{font-size:17px}.public-nav .btn{padding:9px}.public-hero{padding:42px 0 30px}.public-hero>h1{font-size:32px}.public-hero>p{font-size:13px}.public-nav nav{gap:5px}}
/* Public landing page */
.brand-link,.public-brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}.public-home{min-height:100vh;display:flex;flex-direction:column;background:var(--bg);color:var(--ink)}.public-nav{height:72px;padding:0 clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:var(--card)}.public-brand strong{font-size:20px}.public-nav nav{display:flex;align-items:center;gap:14px}.public-hero{width:min(1200px,calc(100% - 36px));margin:0 auto;padding:78px 0 50px;flex:1}.public-hero>h1{font-size:clamp(30px,5vw,52px);letter-spacing:-.04em;margin:10px 0 12px}.public-hero>p{font-size:15px;margin-bottom:38px}.public-drop{cursor:pointer;border:1px dashed var(--primary);background:var(--card);box-shadow:0 12px 40px #2633470d}.public-drop.over{border-style:solid;background:var(--primary-soft);transform:translateY(-2px)}.public-results{margin-top:34px}.public-footer{text-align:center;padding:24px;color:var(--muted);font-size:12px;border-top:1px solid var(--line)}
@media(max-width:600px){.public-nav{height:62px;padding:0 16px}.public-brand strong{font-size:17px}.public-nav .btn{padding:9px}.public-hero{padding:42px 0 30px}.public-hero>h1{font-size:32px}.public-hero>p{font-size:13px}.public-nav nav{gap:5px}}
/* Public landing page */
.brand-link,.public-brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}.public-home{min-height:100vh;display:flex;flex-direction:column;background:var(--bg);color:var(--ink)}.public-nav{height:72px;padding:0 clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:var(--card)}.public-brand strong{font-size:20px}.public-nav nav{display:flex;align-items:center;gap:14px}.public-hero{width:min(1200px,calc(100% - 36px));margin:0 auto;padding:78px 0 50px;flex:1}.public-hero>h1{font-size:clamp(30px,5vw,52px);letter-spacing:-.04em;margin:10px 0 12px}.public-hero>p{font-size:15px;margin-bottom:38px}.public-drop{cursor:pointer;border:1px dashed var(--primary);background:var(--card);box-shadow:0 12px 40px #2633470d}.public-drop.over{border-style:solid;background:var(--primary-soft);transform:translateY(-2px)}.public-results{margin-top:34px}.public-footer{text-align:center;padding:24px;color:var(--muted);font-size:12px;border-top:1px solid var(--line)}
@media(max-width:600px){.public-nav{height:62px;padding:0 16px}.public-brand strong{font-size:17px}.public-nav .btn{padding:9px}.public-hero{padding:42px 0 30px}.public-hero>h1{font-size:32px}.public-hero>p{font-size:13px}.public-nav nav{gap:5px}}
.brand-link{color:inherit;text-decoration:none}.public-admin{display:flex;align-items:center;gap:8px;padding:8px 11px;color:var(--ink);text-decoration:none;border:1px solid var(--line);border-radius:8px;font-size:13px}.public-admin .icon{width:16px;height:16px;color:var(--muted)}.public-admin:hover{border-color:var(--primary);color:var(--primary)}
/* Refined public landing typography: keep attention on the uploader. */
.public-hero{padding-top:46px}.public-hero>h1{font-size:24px;line-height:1.3;font-weight:600;letter-spacing:-.02em;text-align:center;margin:0 0 7px}.public-hero>p{text-align:center;font-size:12px;margin:0 0 28px}.public-drop{min-height:280px}.public-drop .upload-description h2{font-size:18px;font-weight:600}
@media(max-width:600px){.public-hero{padding-top:34px}.public-hero>h1{font-size:21px}.public-hero>p{font-size:11px;margin-bottom:22px}}
.public-tagline{text-align:center;font-size:12px;margin:0 0 28px;color:var(--muted)}
/* Public uploader breathing room */
.public-drop{min-height:340px}
@media(max-width:600px){.public-drop{min-height:320px}}
/* Component UI experiment — shadcn/ui-inspired tokens and responsive primitives.
   Kept dependency-free so CelPic remains self-hosted/offline-friendly. */
:root{--radius:12px;--ring:#8294ee66;--shadow-sm:0 1px 2px #1d2b4b0a;--shadow-md:0 12px 30px #1d2b4b12}
*{box-sizing:border-box}button,a,input,select{transition:color .16s ease,background-color .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--primary);outline-offset:2px;box-shadow:0 0 0 4px var(--ring)}
.btn,.icon-btn,.text-btn,.side-link{font-weight:600;letter-spacing:.01em}.btn{border-radius:9px;box-shadow:var(--shadow-sm)}
.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn:active{transform:translateY(0)}
.layout{background:linear-gradient(135deg,var(--bg),#f1f4fb)}
.sidebar{background:color-mix(in srgb,var(--card) 90%,transparent);backdrop-filter:blur(18px);border-right:1px solid color-mix(in srgb,var(--line) 80%,transparent);box-shadow:8px 0 30px #1d2b4b06}
.brand-link{padding:7px 9px;border-radius:10px}.brand-link:hover{background:var(--primary-soft)}.brand-name{font-weight:750;letter-spacing:-.02em}
.side-label{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:700}.side-link{border-radius:9px;margin:2px 8px;padding:10px 12px}.side-link:hover{background:var(--subtle);color:var(--primary)}.side-link.active{background:var(--primary-soft);color:var(--primary);box-shadow:inset 3px 0 var(--primary)}
.main{max-width:1500px}.topbar{padding:28px clamp(20px,4vw,56px) 24px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 84%,transparent);backdrop-filter:blur(14px)}.top-actions{gap:8px}
#content{padding:28px clamp(20px,4vw,56px)}.workspace-footer{padding-left:clamp(20px,4vw,56px);padding-right:clamp(20px,4vw,56px)}
.upload-card,.panel,.image-card,.upload-result-card,.stat{border-radius:var(--radius);box-shadow:var(--shadow-sm)}.upload-card:hover{border-color:var(--primary);box-shadow:0 0 0 3px var(--ring),var(--shadow-md)}
.panel{box-shadow:var(--shadow-sm)}.image-card{overflow:hidden}.image-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.public-home{background:radial-gradient(circle at 50% -15%,#eef1ff 0,var(--bg) 42%)}.public-nav{height:68px;box-shadow:0 1px 0 var(--line);background:color-mix(in srgb,var(--card) 88%,transparent);backdrop-filter:blur(18px)}.public-brand{padding:7px 9px;border-radius:10px}.public-brand:hover{background:var(--primary-soft)}.public-admin{border-radius:9px;background:var(--card);box-shadow:var(--shadow-sm)}
.public-hero{padding-top:54px}.public-drop{border-radius:16px;box-shadow:0 18px 50px #5368d812;background:color-mix(in srgb,var(--card) 92%,transparent)}.public-drop:hover{box-shadow:0 0 0 3px var(--ring),0 18px 50px #5368d826}.public-tagline{letter-spacing:.08em;font-weight:600}
.auth-wrap{background:radial-gradient(circle at 50% 0,#eef1ff,var(--bg) 54%)}.auth-card{border-radius:16px;box-shadow:0 22px 70px #26334718;border:1px solid color-mix(in srgb,var(--line) 80%,transparent)}.auth-card .btn{height:42px}
@media(max-width:800px){.layout{display:block}.sidebar{position:sticky;top:0;z-index:20;width:100%;height:auto;border-right:0;border-bottom:1px solid var(--line);padding:8px 12px}.sidebar .brand{display:inline-flex}.sidebar .side-label,.sidebar .side-bottom{display:none}.sidebar nav{display:flex;overflow-x:auto;gap:2px;padding:4px 0}.side-link{flex:0 0 auto;margin:0;padding:9px 11px}.side-link span{font-size:11px}.main{min-width:0}.topbar{padding:20px 16px}.topbar h1{font-size:22px}.top-actions .btn{font-size:12px;padding:9px 11px}#content{padding:20px 16px}.workspace-footer{padding:28px 16px 18px}.grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}}
@media(max-width:520px){.public-nav{padding:0 14px}.public-nav nav{gap:5px}.public-admin{padding:8px}.public-admin span{display:none}.public-hero{width:min(100% - 28px,1200px);padding-top:34px}.public-drop{min-height:330px}.upload-result-card{grid-template-columns:1fr!important}.auth-card{width:calc(100% - 28px);padding:24px 20px}.grid{grid-template-columns:1fr 1fr}.image-preview{height:130px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
.dark .layout{background:linear-gradient(135deg,var(--bg),#111827)}.dark .public-home{background:radial-gradient(circle at 50% -15%,#20294a,var(--bg) 46%)}

/* Navigation refinement: collapsible desktop rail and compact touch targets. */
.sidebar{transition:width .2s ease,transform .2s ease}.sidebar .brand{display:flex;align-items:center;justify-content:space-between;gap:6px}.sidebar-toggle{width:32px;height:32px;flex:none}.sidebar-collapsed .sidebar{width:78px}.sidebar-collapsed .brand-name,.sidebar-collapsed .side-label,.sidebar-collapsed .side-link span,.sidebar-collapsed .storage>div,.sidebar-collapsed .profile-name{display:none}.sidebar-collapsed .brand-link{padding:7px}.sidebar-collapsed .sidebar .brand{justify-content:center}.sidebar-collapsed .side-link{justify-content:center;padding-inline:0}.sidebar-collapsed .storage,.sidebar-collapsed .profile{justify-content:center}.sidebar-collapsed .profile{padding-inline:0}.sidebar-collapsed .main{margin-left:0}.sidebar-collapsed .sidebar-toggle .icon{transform:rotate(180deg)}
@media(max-width:800px){.sidebar-collapsed .sidebar{width:100%}.sidebar-collapsed .brand-name,.sidebar-collapsed .side-label,.sidebar-collapsed .side-link span,.sidebar-collapsed .storage>div,.sidebar-collapsed .profile-name{display:initial}.sidebar-collapsed .side-label,.sidebar-collapsed .side-bottom{display:none}.sidebar-collapsed .side-link{justify-content:flex-start;padding:9px 11px}.sidebar-toggle{display:none}}
/* Alignment pass: center the workspace in the available viewport and keep the rail controls on a stable grid. */
.main{width:100%;max-width:none;padding:0;}
.main>.topbar,.main>#content,.main>.workspace-footer{width:min(calc(100% - 48px),1280px);margin-inline:auto}
.main>.topbar{padding-left:0;padding-right:0}.main>#content{padding-left:0;padding-right:0}.main>.workspace-footer{padding-left:0;padding-right:0}
.sidebar .brand{position:relative;min-height:40px;padding:0 8px 0 10px}
.sidebar-collapsed .sidebar .brand{height:40px;min-height:40px;padding:0;justify-content:center}
.sidebar-collapsed .sidebar .brand-link{padding:3px}
.sidebar-collapsed .sidebar-toggle{position:absolute;right:-1px;top:4px;width:24px;height:32px;padding:4px}
.sidebar-collapsed .sidebar-toggle .icon{width:15px;height:15px}
.sidebar-collapsed .side-label{display:none}
@media(max-width:800px){.main>.topbar,.main>#content,.main>.workspace-footer{width:calc(100% - 32px)}.main>.topbar{padding-left:0;padding-right:0}.main>#content{padding-left:0;padding-right:0}.main>.workspace-footer{padding-left:0;padding-right:0}}
/* Sidebar rail correction based on shadcn icon-mode pattern: the trigger sits on the rail edge,
   while the brand remains an independent centered header item. */
.sidebar{position:sticky;overflow:visible;flex:0 0 224px;min-width:224px}
.sidebar .brand{justify-content:flex-start;padding-right:0}
.sidebar-toggle{position:absolute;z-index:5;right:-15px;top:24px;width:30px;height:30px;padding:5px;border:1px solid var(--line);border-radius:999px;background:var(--card);box-shadow:0 2px 8px #1d2b4b14}
.sidebar-toggle:hover{background:var(--primary-soft);border-color:var(--primary)}
.sidebar-collapsed .sidebar{width:78px;flex-basis:78px;min-width:78px}
.sidebar-collapsed .sidebar .brand{justify-content:center;padding:0}
.sidebar-collapsed .sidebar-toggle{right:-15px;top:24px;width:30px;height:30px;padding:5px}
.sidebar-collapsed .sidebar-toggle .icon{transform:rotate(180deg)}
@media(max-width:800px){.sidebar,.sidebar-collapsed .sidebar{position:sticky;flex:0 0 auto;min-width:0;width:100%;overflow:hidden}.sidebar-toggle,.sidebar-collapsed .sidebar-toggle{display:none}}
/* Final rail alignment: keep the edge trigger outside the compact logo column. */
.sidebar-collapsed .sidebar-toggle{right:-22px;top:17px}
.sidebar-collapsed .sidebar .brand{height:64px;min-height:64px;align-items:flex-start;padding-top:15px}
.sidebar-collapsed .sidebar .brand-link{padding:0}
.custom-logo{width:34px!important;height:34px!important;max-width:34px!important;max-height:34px!important;object-fit:contain!important;display:block!important}
#logoPreview{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;overflow:hidden;border-radius:10px}
#logoPreview .custom-logo{border-radius:10px}
@media(max-width:800px){.sidebar-collapsed .sidebar .brand{height:40px;min-height:40px;padding-top:0}}
/* Collapse navigation removed: keep one stable, readable sidebar layout. */
.sidebar,.sidebar-collapsed .sidebar{width:224px!important;min-width:224px!important;flex-basis:224px!important}
.sidebar .brand,.sidebar-collapsed .sidebar .brand{height:auto;min-height:40px;justify-content:flex-start;align-items:center;padding:0 8px 47px 10px}
.sidebar .brand-link,.sidebar-collapsed .sidebar .brand-link{padding:7px 9px}
.sidebar-toggle,.sidebar-collapsed .sidebar-toggle{display:none!important}
.sidebar-collapsed .brand-name,.sidebar-collapsed .side-label,.sidebar-collapsed .side-link span,.sidebar-collapsed .storage>div,.sidebar-collapsed .profile-name{display:initial}
.sidebar-collapsed .side-link{justify-content:flex-start;padding:10px 12px}
@media(max-width:800px){.sidebar,.sidebar-collapsed .sidebar{width:100%!important;min-width:0!important;flex-basis:auto!important}.sidebar .brand,.sidebar-collapsed .sidebar .brand{height:auto;min-height:40px;padding:0 8px 8px;justify-content:flex-start}.sidebar .brand-link,.sidebar-collapsed .sidebar .brand-link{padding:7px 9px}}
.pagination{display:flex;align-items:center;justify-content:center;gap:6px;margin:28px 0 8px;flex-wrap:wrap}.page-btn{min-width:34px;height:34px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--muted);font-size:12px;font-weight:600;cursor:pointer}.page-btn:hover:not(:disabled){border-color:var(--primary);color:var(--primary);background:var(--primary-soft)}.page-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.page-btn:disabled{opacity:.45;cursor:not-allowed}.page-ellipsis{padding:0 3px;color:var(--muted)}.page-summary{margin-left:8px;color:var(--muted);font-size:11px;white-space:nowrap}@media(max-width:520px){.pagination{gap:4px}.page-btn{min-width:31px;height:32px;padding:0 7px}.page-summary{width:100%;text-align:center;margin:4px 0 0}}
.pagination{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:30px 0 10px;padding:12px 0;border-top:1px solid var(--line);flex-wrap:wrap}.page-controls{display:flex;align-items:center;justify-content:center;gap:6px;order:2}.page-total{order:1}.page-jump{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12px;order:3;white-space:nowrap}.page-jump input{width:54px;height:32px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink);text-align:center;font-size:12px}.page-jump-btn{height:32px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink);font-size:12px;cursor:pointer}.page-jump-btn:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-soft)}
@media(max-width:650px){.pagination{justify-content:center;gap:10px}.page-total{width:100%;text-align:center;order:1}.page-controls{order:2}.page-jump{order:3;width:100%;justify-content:center}}

/* 存储管理：多后端卡片布局 */
.storage-shell{max-width:1180px;margin:0 auto;padding:4px 0 40px}
.storage-shell-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:8px 0 24px}
.storage-shell-head h2{margin:0 0 7px;font-size:22px;letter-spacing:-.02em}
.storage-shell-head p{margin:0;font-size:13px}
.storage-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.storage-card{min-width:0;background:var(--panel,#fff);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:0 8px 24px rgba(31,56,82,.045);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.storage-card:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(31,56,82,.09)}
.storage-card.is-default{border-color:#8bd8b1;box-shadow:0 8px 26px rgba(39,169,104,.09)}
.storage-card-head{display:flex;align-items:flex-start;gap:12px;min-width:0}
.storage-icon{width:42px;height:42px;display:grid;place-items:center;flex:none;border-radius:13px;background:var(--primary-soft);color:var(--primary)}
.storage-icon .icon{width:21px;height:21px}
.storage-title{min-width:0;flex:1;padding-top:1px}
.storage-title h3{margin:0;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.storage-title p{margin:6px 0 0;color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.storage-badges{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px;max-width:100px}
.status-pill,.default-pill{display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:999px;font-size:10px;white-space:nowrap}
.status-pill{color:#18824b;background:#e7f8ee}.status-pill:before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor;margin-right:5px}
.muted-pill{color:var(--muted);background:var(--soft)}.muted-pill:before{background:currentColor}
.default-pill{color:#a46b05;background:#fff4d6}
.storage-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:24px 0 18px;padding-top:16px;border-top:1px solid var(--line)}
.storage-metrics div{min-width:0}.storage-metrics span,.storage-usage span{display:block;color:var(--muted);font-size:11px;margin-bottom:5px}.storage-metrics strong{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.storage-usage>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:10px}.storage-usage b{font-size:11px;font-weight:600;color:var(--ink)}
.usage-track{height:7px;margin-top:9px;background:var(--soft);border-radius:99px;overflow:hidden}.usage-track i{display:block;height:100%;min-width:2px;background:linear-gradient(90deg,#59c98d,#2ea96c);border-radius:inherit}
.storage-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.storage-actions .btn{min-height:33px;padding:0 12px;font-size:11px}
.storage-dialog{width:min(680px,calc(100vw - 32px));max-width:none;padding:28px;border:1px solid var(--line);border-radius:20px;background:var(--panel,#fff);color:var(--ink);box-shadow:0 24px 80px rgba(20,38,58,.2)}
.storage-dialog h2{margin:0 0 6px;font-size:20px}.storage-dialog>p{margin:0 0 22px;font-size:12px}.storage-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.storage-form-grid .field:nth-child(3),.storage-form-grid .field:nth-child(4),.storage-form-grid .field:nth-child(5),.storage-form-grid .field:nth-child(6),.storage-form-grid .field:nth-child(7){grid-column:1/-1}
.storage-options{display:flex;flex-wrap:wrap;gap:14px;margin:18px 0 22px}.storage-options .checkbox-line{font-size:12px}.storage-dialog .form-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:22px}.storage-dialog .form-actions .btn{min-width:84px}
@media(max-width:1100px){.storage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.storage-shell{max-width:none}}
@media(max-width:700px){.storage-shell-head{align-items:flex-start;flex-direction:column}.storage-shell-head .btn{width:100%;justify-content:center}.storage-grid{grid-template-columns:1fr}.storage-card{padding:17px}.storage-dialog{padding:22px 18px}.storage-form-grid{grid-template-columns:1fr}.storage-form-grid .field{grid-column:1/-1!important}.storage-dialog .form-actions{flex-direction:column-reverse}.storage-dialog .form-actions .btn{width:100%}}
/* 存储表单紧凑布局修正：两列对齐，避免长条竖排 */
.storage-dialog{width:min(760px,calc(100vw - 32px));max-height:min(760px,calc(100vh - 40px));overflow:auto;padding:30px 32px}
.storage-dialog::backdrop{background:rgba(18,31,49,.42);backdrop-filter:blur(3px)}
.storage-dialog .dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:24px}
.storage-dialog .dialog-head h2{margin:0 0 7px;font-size:20px}.storage-dialog .dialog-head p{margin:0;font-size:12px}
.storage-dialog .dialog-head .icon-btn{flex:none;margin:-4px -8px 0 0}
.storage-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 14px}
.storage-form-grid .field{min-width:0;margin:0}
.storage-form-grid .field:nth-child(3),.storage-form-grid .field:nth-child(4),.storage-form-grid .field:nth-child(5),.storage-form-grid .field:nth-child(6),.storage-form-grid .field:nth-child(7){grid-column:auto}
.storage-form-grid .field input,.storage-form-grid .field select{min-width:0;width:100%}
.storage-options{padding:14px 15px;margin:20px 0 0;border:1px solid var(--line);border-radius:11px;background:var(--subtle,#f7f9fc);gap:12px 22px}
.storage-dialog .dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.storage-dialog .dialog-actions .btn{min-width:88px}
@media(max-width:620px){.storage-dialog{padding:23px 18px}.storage-form-grid{grid-template-columns:1fr}.storage-form-grid .field{grid-column:1!important}.storage-dialog .dialog-actions{flex-direction:column-reverse}.storage-dialog .dialog-actions .btn{width:100%}}
/* 存储弹窗与“添加用户”统一使用同一套弹窗容器和操作方式 */
.storage-user-modal{width:min(444px,calc(100vw - 32px));max-width:none;padding:30px;border:1px solid var(--line);border-radius:14px;background:var(--card,#fff);color:var(--ink);box-shadow:0 24px 80px rgba(20,38,58,.22)}
.storage-user-modal h2{margin:0 0 8px;font-size:20px}.storage-user-modal>p{margin:0 0 22px;font-size:12px}
.storage-user-modal .storage-form-grid{display:block}.storage-user-modal .storage-form-grid .field{display:flex;margin:0 0 16px}.storage-user-modal .storage-form-grid .field input,.storage-user-modal .storage-form-grid .field select{width:100%}
.storage-user-modal .storage-options{display:flex;flex-direction:column;gap:11px;margin:0 0 17px;padding:0;border:0;background:transparent}
.storage-user-modal .form-error{min-height:18px;margin:0 0 9px}.storage-user-modal .btn.full{width:100%;margin-top:0}
.storage-user-modal::backdrop{background:rgba(24,37,55,.48);backdrop-filter:blur(3px)}
@media(max-width:520px){.storage-user-modal{padding:25px 20px}}
.storage-driver-hint{font-size:11px;line-height:1.6;margin:7px 0 0}.storage-user-modal .field[hidden]{display:none}
/* 添加存储：保留添加用户的视觉风格，但用更舒展的双列表单 */
.storage-user-modal{width:min(720px,calc(100vw - 32px));padding:30px 32px}
.storage-user-modal .storage-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 16px}
.storage-user-modal .storage-form-grid .field{display:flex;margin:0;min-width:0}
.storage-user-modal .storage-form-grid .field input,.storage-user-modal .storage-form-grid .field select{width:100%;min-width:0}
.storage-user-modal .storage-form-grid .field[hidden]{display:none}
.storage-user-modal .storage-driver-hint{grid-column:1/-1;margin:-3px 0 1px}
.storage-user-modal .storage-options{grid-column:1/-1;display:flex;flex-direction:row;flex-wrap:wrap;gap:10px 24px;margin:5px 0 14px}
.storage-user-modal .form-error{grid-column:1/-1}
.storage-user-modal .btn.full{grid-column:1/-1}
@media(max-width:620px){.storage-user-modal{padding:25px 20px}.storage-user-modal .storage-form-grid{display:block}.storage-user-modal .storage-form-grid .field{margin:0 0 16px}.storage-user-modal .storage-driver-hint{margin:-4px 0 14px}.storage-user-modal .storage-options{display:flex;margin:0 0 14px}}

.storage-head-actions{display:flex;align-items:center;gap:9px}.storage-head-actions .btn{white-space:nowrap}.storage-actions .btn:first-child{color:var(--primary);border-color:color-mix(in srgb,var(--primary) 24%,var(--line));background:var(--primary-soft)}.storage-actions .btn:first-child:hover{background:var(--primary);color:#fff}
@media(max-width:700px){.storage-head-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.storage-head-actions .btn{width:100%;justify-content:center}}

/* 页面主内容统一对齐：存储管理不再因 max-width 产生额外左缩进 */
.storage-shell{max-width:none;width:100%;margin:0;padding-left:0;padding-right:0}
.storage-shell-head{width:100%}
.storage-grid{width:100%;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));align-items:stretch}
.storage-card{width:100%}
.top-actions{padding-right:12px}
@media(max-width:800px){.top-actions{padding-right:0}}

/* 页面级操作按钮统一规格，避免“上传图片 / 添加存储 / 添加用户”大小和位置不一致 */
.top-actions .btn,.storage-head-actions .action-btn,.panel-head>.action-btn{min-height:38px;padding:9px 15px;font-size:12px;gap:8px}
.top-actions .btn,.storage-head-actions .action-btn,.panel-head>.action-btn{min-width:104px}
.storage-head-actions{align-items:center}
.panel-head>.action-btn{flex:none}

.origin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.origin-grid .field{margin:12px 0}.settings-form>.panel>.muted{font-size:11px;line-height:1.7;max-width:760px}@media(max-width:780px){.origin-grid{grid-template-columns:1fr;gap:0}}

/* Desktop gallery: blurred cover backdrop with a sharp, fully visible original image. */
.image-preview{position:relative;isolation:isolate;overflow:hidden;background:var(--subtle)}.image-preview .image-backdrop{position:absolute;inset:-18px;width:calc(100% + 36px);height:calc(100% + 36px);object-fit:cover;filter:blur(18px);transform:scale(1.08);opacity:.72;z-index:0}.image-preview .image-main{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;display:block}.image-card .card-actions{opacity:0;transform:translateY(4px);pointer-events:none;transition:opacity .16s ease,transform .16s ease}.image-card:hover .card-actions{opacity:1;transform:none;pointer-events:auto}
@media(max-width:780px){.image-card .card-actions{opacity:1;transform:none;pointer-events:auto}.image-preview .image-backdrop{filter:blur(14px)}}


/* Full-bleed gallery cards: metadata is intentionally omitted; controls appear on hover. */
.image-preview-link{position:absolute;inset:0;display:block;z-index:1}.image-preview>.card-actions{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:28px 8px 8px;background:linear-gradient(transparent,rgba(8,14,22,.82));gap:4px}.image-preview>.card-actions .card-action{color:#fff;text-shadow:0 1px 2px #0008}.image-preview>.card-actions .card-action:hover,.image-preview>.card-actions .card-action.active{background:transparent;color:#fff}.image-card .check{opacity:0;transition:opacity .16s ease;z-index:4}.image-card:hover .check{opacity:1}.image-card .image-preview{height:210px}.image-card .image-preview .image-main{object-fit:contain}.image-card .image-preview .image-backdrop{object-fit:cover}@media(max-width:780px){.image-card .check{opacity:1}.image-card .image-preview{height:180px}}





/* Confirmation dialog: clear hierarchy and a calmer destructive action. */
.delete-modal{width:min(460px,calc(100vw - 32px));padding:28px 30px 24px;border-radius:18px;box-shadow:0 24px 80px rgba(20,38,58,.26)}
.delete-modal::backdrop{background:rgba(18,31,49,.52);backdrop-filter:blur(4px)}
.delete-dialog-head{display:flex;align-items:flex-start;gap:13px;padding-right:24px}
.delete-dialog-head h2{margin:2px 0 7px;font-size:19px;line-height:1.35}
.delete-dialog-head p{margin:0;color:var(--muted);font-size:12px;line-height:1.7}
.delete-dialog-icon{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:11px;color:var(--danger);background:var(--danger-bg)}
.delete-dialog-icon .icon{width:20px;height:20px}
.delete-warning{margin:20px 0 18px;padding:11px 13px;border:1px solid color-mix(in srgb,var(--danger) 22%,var(--line));border-radius:10px;color:var(--muted);background:color-mix(in srgb,var(--danger-bg) 46%,var(--card));font-size:11px;line-height:1.6}
.delete-dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:15px;padding-top:17px;border-top:1px solid var(--line)}
.delete-dialog-actions .btn{min-width:88px}
.delete-dialog-actions .btn.danger{background:var(--danger);color:#fff;border-color:var(--danger)}
.delete-dialog-actions .btn.danger:hover{filter:brightness(.94)}
.image-preview>.card-actions .card-action.copied{color:#b9ffc9}
@media(max-width:520px){.delete-modal{padding:25px 20px 20px}.delete-dialog-actions{flex-direction:column-reverse}.delete-dialog-actions .btn{width:100%}}

/* 存储管理图标使用清爽的绿色，与容量/存储语义保持一致。 */
.storage-icon{background:#e8faf1;color:#20b977}
.dark .storage-icon{background:#183a2b;color:#69e0a8}

/* 存储卡片恢复为紧凑宽度，避免单个后端横向铺满整页。 */
.storage-grid{grid-template-columns:repeat(auto-fill,minmax(340px,380px));justify-content:start}
.storage-icon{background:#e8faf1;color:#20b977}
.dark .storage-icon{background:#183a2b;color:#69e0a8}
@media(max-width:700px){.storage-grid{grid-template-columns:1fr}}

.upload-limit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:18px 0 4px}.upload-limit-grid .field{margin:0}.upload-limit-grid small{font-size:11px;margin-top:1px}@media(max-width:620px){.upload-limit-grid{grid-template-columns:1fr}}