.shared-center{
  min-height:calc(100vh - 58px);
  padding:28px 34px 44px;
  box-sizing:border-box;
  background:
    linear-gradient(color-mix(in srgb,var(--accent) 4%,transparent) 1px,transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--accent) 4%,transparent) 1px,transparent 1px),
    #070812;
  background-size:24px 24px;
}
.shared-center-head{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;margin-bottom:18px}
.shared-center-heading{min-width:220px}
.shared-center-heading h1{margin:0 0 6px;color:#fff;font-size:24px;letter-spacing:.04em}
.shared-center-heading p{margin:0;color:#73788a;font-size:12px;line-height:1.6}
.shared-center-head-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:1}
.shared-center-search{position:relative;width:min(520px,44vw)}
.shared-center-search span{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--accent);font-size:18px;pointer-events:none}
.shared-center-search input{width:100%;height:42px;box-sizing:border-box;padding:0 14px 0 42px;border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);border-radius:12px;background:rgba(9,10,20,.9);color:#fff;outline:0}
.shared-center-search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent)}
.shared-center-admin-add{height:42px;padding:0 17px;border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);border-radius:11px;background:color-mix(in srgb,var(--accent) 12%,#090a14);color:#fff;font-weight:800;cursor:pointer;white-space:nowrap}
.shared-center-admin-add:hover{background:var(--grad);border-color:transparent}
.shared-center-tabs{display:flex;align-items:center;gap:4px;width:max-content;max-width:100%;margin-bottom:12px;padding:4px;overflow-x:auto;border:1px solid rgba(255,255,255,.1);border-radius:11px;background:rgba(5,6,12,.8);scrollbar-width:none}
.shared-center-tabs::-webkit-scrollbar{display:none}
.shared-center-tabs button{min-width:72px;height:34px;padding:0 14px;border:0;border-radius:8px;background:transparent;color:#797d8a;font:600 12px/1 inherit;cursor:pointer;white-space:nowrap}
.shared-center-tabs button.active{color:#fff;background:var(--grad);box-shadow:0 0 15px color-mix(in srgb,var(--accent) 24%,transparent)}
.shared-center-status{min-height:26px;margin-bottom:10px;color:#626779;font-size:11px;line-height:26px}
.shared-center-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(164px,1fr));gap:15px;align-items:start}
.shared-center-empty{grid-column:1/-1;min-height:52vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#63687a}
.shared-center-empty strong{color:#a7acba;font-size:15px}.shared-center-empty span{font-size:12px}
.shared-media-card{position:relative;aspect-ratio:9/16;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:#090a10;box-shadow:0 8px 22px rgba(0,0,0,.28);transition:transform .16s,border-color .16s,box-shadow .16s;isolation:isolate}
.shared-media-card:hover,.shared-media-card:focus-visible{outline:0;transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 68%,transparent);box-shadow:0 12px 28px rgba(0,0,0,.4),0 0 18px color-mix(in srgb,var(--accent) 14%,transparent)}
.shared-media-preview{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(155deg,#151926,#07080e 70%);cursor:pointer}
.shared-media-preview img,.shared-media-preview video{width:100%;height:100%;display:block;object-fit:cover}
.shared-media-preview video{background:#050507}
.shared-file-mark{width:108px;min-height:132px;display:flex;flex-direction:column;justify-content:flex-end;gap:7px;box-sizing:border-box;padding:18px 14px;border:1px solid rgba(255,255,255,.22);border-radius:9px;background:linear-gradient(155deg,color-mix(in srgb,var(--accent) 18%,transparent),#0a0b12);color:#fff}
.shared-file-mark strong{color:var(--accent);font-size:17px;overflow:hidden;text-overflow:ellipsis}.shared-file-mark span{color:#858a98;font-size:10px;line-height:1.4}
.shared-audio-card{grid-column:span 2;aspect-ratio:auto;min-height:130px}.shared-audio-card .shared-media-preview{padding:18px;box-sizing:border-box}.shared-audio-card audio{width:100%;accent-color:var(--accent)}
.shared-card-favorite{position:absolute;left:4px;bottom:4px;z-index:6;width:17px;height:17px;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.34);border-radius:50%;background:rgba(5,7,13,.78);backdrop-filter:blur(10px);color:#fff;font-size:10px;line-height:1;cursor:pointer;opacity:0;transform:translateY(4px);transition:opacity .16s,transform .16s,background .16s,border-color .16s}
.shared-media-card:hover .shared-card-favorite,.shared-media-card:focus-within .shared-card-favorite{opacity:1;transform:none}
.shared-card-favorite:hover,.shared-card-favorite.is-favorite{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 22%,rgba(5,7,13,.88));color:#fff}
.shared-card-favorite::after{content:'收藏';position:absolute;left:calc(100% + 5px);bottom:-2px;padding:3px 6px;border:1px solid rgba(255,255,255,.22);border-radius:6px;background:rgba(5,7,13,.92);box-shadow:0 4px 14px rgba(0,0,0,.35);color:#fff;font-size:9px;font-weight:700;line-height:1.2;white-space:nowrap;pointer-events:none;opacity:0;transform:translateX(-3px);transition:opacity .14s,transform .14s}
.shared-card-favorite:hover::after,.shared-card-favorite:focus-visible::after{opacity:1;transform:none}
.shared-card-favorite.is-favorite::after{content:'已收藏'}
.shared-card-favorite.is-pending{pointer-events:none;opacity:.65}
.shared-card-admin{position:absolute;right:8px;top:8px;z-index:7;display:flex;gap:6px}
.shared-card-admin button{width:30px;height:30px;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.3);border-radius:8px;background:rgba(5,7,13,.82);backdrop-filter:blur(10px);color:#fff;font-size:15px;cursor:pointer}
.shared-card-admin button:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 20%,rgba(5,7,13,.9))}
.shared-card-admin button[data-shared-delete]:hover{border-color:#ff627d;background:rgba(151,20,49,.82)}
.shared-card-access{position:absolute;left:8px;top:8px;z-index:5;padding:4px 8px;border-radius:7px;background:rgba(5,7,13,.74);backdrop-filter:blur(10px);color:#fff;font-size:9px;font-weight:800}
.shared-card-access.vip{background:linear-gradient(135deg,#f59e0b,#ef4444)}.shared-card-access.svip{background:var(--grad)}
.shared-card-title-tooltip{position:absolute;inset:auto 8px 8px 52px;z-index:5;padding:7px 9px;border-radius:8px;background:rgba(5,7,13,.8);backdrop-filter:blur(10px);color:#fff;font-size:10px;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .16s,transform .16s}
.shared-media-card:hover .shared-card-title-tooltip,.shared-media-card:focus-within .shared-card-title-tooltip{opacity:1;transform:none}
.shared-visual-card .shared-card-title-tooltip{display:none}
.shared-center-modal{position:fixed;inset:0;z-index:12000;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.74);backdrop-filter:blur(8px)}
.shared-center-modal.is-open{display:flex}
.shared-center-dialog{width:min(720px,94vw);max-height:min(820px,90vh);overflow:auto;border:1px solid color-mix(in srgb,var(--accent) 42%,transparent);border-radius:16px;background:#0b0c18;box-shadow:0 30px 90px rgba(0,0,0,.65),0 0 34px color-mix(in srgb,var(--accent) 14%,transparent)}
.shared-center-dialog header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.09)}
.shared-center-dialog header h2{margin:0;color:#fff;font-size:18px}.shared-center-dialog header button{width:34px;height:34px;border:0;border-radius:8px;background:rgba(255,255,255,.07);color:#fff;font-size:20px;cursor:pointer}
.shared-center-form{display:grid;grid-template-columns:1fr 1fr;gap:13px;padding:20px}
.shared-center-form label{display:flex;flex-direction:column;gap:7px;color:#8d93a5;font-size:11px}.shared-center-form label.full{grid-column:1/-1}
.shared-center-form label[hidden]{display:none!important}
.shared-center-form input,.shared-center-form textarea,.shared-center-form select{width:100%;box-sizing:border-box;padding:11px 12px;border:1px solid rgba(255,255,255,.13);border-radius:9px;outline:0;background:#111326;color:#fff;font:12px/1.5 inherit}
.shared-center-form textarea{min-height:92px;resize:vertical}.shared-center-form input:focus,.shared-center-form textarea:focus,.shared-center-form select:focus{border-color:var(--accent)}
.shared-center-form small{color:#636a7c;line-height:1.55}.shared-center-form-actions{grid-column:1/-1;display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:4px}
.shared-center-form-actions button{height:40px;padding:0 18px;border:1px solid rgba(255,255,255,.14);border-radius:9px;background:#15172a;color:#fff;font-weight:700;cursor:pointer}.shared-center-form-actions button.primary{border:0;background:var(--grad)}
.shared-center-form-status{grid-column:1/-1;min-height:20px;color:#8aa0ba;font-size:11px}.shared-center-form-status.error{color:#ff738a}.shared-center-form-status.success{color:#5eeaa1}
@media(max-width:900px){.shared-center{padding:20px 16px 34px}.shared-center-head{align-items:stretch;flex-direction:column}.shared-center-head-actions{justify-content:stretch}.shared-center-search{width:100%}.shared-center-admin-add{flex:0 0 auto}.shared-center-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:11px}}
@media(max-width:620px){.shared-center-head-actions{align-items:stretch;flex-direction:column}.shared-center-form{grid-template-columns:1fr}.shared-center-form label.full,.shared-center-form-actions,.shared-center-form-status{grid-column:1}.shared-center-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.shared-audio-card{grid-column:span 2}}
