:root { --share-blue:#1769ff; --share-dark:#0f1d33; --share-muted:#64748b; }
body { background:var(--bg,#f5f8fc); color:var(--text,#0f172a); }
.share-shell { width:min(1500px,calc(100% - 32px)); margin:0 auto; padding:28px 0 70px; }
.share-breadcrumbs { margin:0 0 18px; color:var(--text-muted,#64748b); font-size:14px; }
.share-breadcrumbs a { color:var(--share-blue); }
.share-hero { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,.7fr); gap:28px; padding:44px; border:1px solid var(--border,#dbe4f0); border-radius:30px; background:linear-gradient(135deg,#0f1d33,#152a49); color:#fff; box-shadow:0 24px 60px rgba(15,29,51,.18); }
.share-eyebrow { display:block; color:#79aaff; text-transform:uppercase; letter-spacing:.13em; font-weight:800; font-size:13px; }
.share-hero h1 { margin:12px 0 12px; color:#fff; font:800 clamp(34px,4vw,62px)/1.04 Poppins,Inter,sans-serif; }
.share-hero p { max-width:820px; color:#c6d4e8; font-size:18px; line-height:1.7; }
.share-hero-stats { display:grid; gap:12px; align-content:center; }
.share-hero-stats div { padding:20px; border:1px solid rgba(148,174,211,.24); border-radius:18px; background:rgba(255,255,255,.055); }
.share-hero-stats span { display:block; color:#9db0ca; text-transform:uppercase; font-size:11px; font-weight:800; letter-spacing:.08em; }
.share-hero-stats strong { display:block; margin-top:6px; color:#fff; font-size:25px; }
.share-control-card { margin-top:22px; padding:22px; border:1px solid var(--border,#dbe4f0); border-radius:22px; background:var(--surface,#fff); }
.share-control-row { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.share-search { flex:1 1 300px; min-height:48px; padding:0 16px; border:1px solid var(--border,#cbd5e1); border-radius:13px; background:var(--surface-2,#f8fafc); color:var(--text,#0f172a); font:inherit; }
.share-filters { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.share-filters button { border:1px solid var(--border,#cbd5e1); border-radius:999px; padding:9px 14px; background:var(--surface-2,#f8fafc); color:var(--text,#0f172a); font-weight:750; cursor:pointer; }
.share-filters button.is-active { background:var(--share-blue); border-color:var(--share-blue); color:#fff; }
.share-privacy { display:flex; flex-wrap:wrap; gap:12px 22px; margin-top:18px; padding-top:18px; border-top:1px solid var(--border,#e2e8f0); }
.share-privacy strong { width:100%; }
.share-privacy label { display:flex; align-items:center; gap:8px; color:var(--text-muted,#64748b); font-weight:650; }
.share-status { min-height:22px; margin:12px 0 0; color:var(--share-blue); font-weight:700; }
.share-section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin:34px 0 16px; }
.share-section-heading h2 { margin:0; font-size:30px; }
.share-section-heading p { margin:5px 0 0; color:var(--text-muted,#64748b); }
.share-count { min-width:64px; padding:10px 15px; border-radius:999px; background:var(--surface,#fff); border:1px solid var(--border,#e2e8f0); text-align:center; font-weight:800; }
.share-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.share-item-card { display:flex; flex-direction:column; min-width:0; padding:20px; border:1px solid var(--border,#dbe4f0); border-radius:22px; background:var(--surface,#fff); box-shadow:0 12px 30px rgba(15,23,42,.07); }
.share-item-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.share-item-icon { display:grid; place-items:center; width:45px; height:45px; border:1px solid var(--border,#dbe4f0); border-radius:13px; background:var(--surface-2,#f5f8fc); font-size:23px; }
.share-item-type { color:var(--share-blue); text-transform:uppercase; letter-spacing:.08em; font-size:11px; font-weight:850; }
.share-item-card h2 { margin:16px 0 8px; font-size:21px; line-height:1.25; overflow-wrap:anywhere; }
.share-item-card p { margin:0 0 18px; color:var(--text-muted,#64748b); line-height:1.6; }
.share-item-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:auto; }
.share-item-metrics span { min-width:0; padding:11px; border-radius:12px; background:var(--surface-2,#f5f8fc); }
.share-item-metrics small,.share-item-metrics strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.share-item-metrics small { color:var(--text-muted,#64748b); font-size:10px; font-weight:800; text-transform:uppercase; }
.share-item-metrics strong { margin-top:4px; font-size:15px; }
.share-item-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:16px; }
.share-item-actions button,.share-preview-actions button { min-height:38px; border:1px solid var(--border,#cbd5e1); border-radius:10px; padding:8px 11px; background:var(--surface-2,#f8fafc); color:var(--text,#0f172a); font-weight:750; cursor:pointer; }
.share-item-actions button:nth-child(2),.share-preview-actions button[data-preview-action="share"] { background:var(--share-blue); border-color:var(--share-blue); color:#fff; }
.share-empty { padding:50px 24px; border:1px dashed var(--border,#cbd5e1); border-radius:22px; text-align:center; color:var(--text-muted,#64748b); background:var(--surface,#fff); }
.share-help-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:30px; }
.share-help-grid article { padding:22px; border-radius:20px; background:var(--surface,#fff); border:1px solid var(--border,#dbe4f0); }
.share-help-grid h2 { margin:0 0 8px; font-size:20px; }
.share-help-grid p { margin:0; color:var(--text-muted,#64748b); line-height:1.6; }
.share-preview { position:fixed; inset:0; z-index:2000; display:grid; place-items:center; padding:20px; background:rgba(2,8,23,.72); backdrop-filter:blur(7px); }
.share-preview[hidden] { display:none; }
.share-preview-card { width:min(720px,100%); max-height:calc(100vh - 40px); overflow:auto; padding:28px; border-radius:26px; background:var(--surface,#fff); color:var(--text,#0f172a); box-shadow:0 28px 90px rgba(0,0,0,.35); }
.share-preview-top { display:flex; align-items:start; justify-content:space-between; gap:20px; }
.share-preview-top button { border:0; background:transparent; color:inherit; font-size:28px; cursor:pointer; }
.share-preview-card h2 { margin:10px 0; font-size:32px; }
.share-preview-card>p { color:var(--text-muted,#64748b); line-height:1.6; }
.share-preview-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:22px 0; }
.share-preview-metrics span { padding:16px; border-radius:14px; background:var(--surface-2,#f5f8fc); }
.share-preview-metrics small,.share-preview-metrics strong { display:block; }
.share-preview-metrics small { color:var(--text-muted,#64748b); font-size:11px; text-transform:uppercase; font-weight:800; }
.share-preview-metrics strong { margin-top:5px; font-size:21px; }
.share-preview-actions { display:flex; flex-wrap:wrap; gap:9px; }
body.share-preview-open { overflow:hidden; }
html[data-theme="dark"] .share-item-actions button,html[data-theme="dark"] .share-preview-actions button { background:#172844; border-color:#345074; color:#eef5ff; }
html[data-theme="dark"] .share-item-actions button:nth-child(2),html[data-theme="dark"] .share-preview-actions button[data-preview-action="share"] { background:var(--share-blue); border-color:var(--share-blue); color:#fff; }
@media(max-width:1100px){.share-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.share-help-grid{grid-template-columns:1fr 1fr}.share-hero{grid-template-columns:1fr}.share-hero-stats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.share-shell{width:min(100% - 20px,1500px);padding-top:16px}.share-hero{padding:26px 20px;border-radius:22px}.share-hero-stats{grid-template-columns:1fr}.share-grid,.share-help-grid{grid-template-columns:1fr}.share-section-heading{align-items:start}.share-preview-metrics{grid-template-columns:1fr}.share-item-actions button{flex:1 1 42%}}
.share-history-card { margin-top:30px; padding:22px; border:1px solid var(--border,#dbe4f0); border-radius:22px; background:var(--surface,#fff); }
.share-history-list { display:grid; gap:8px; }
.share-history-entry { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px 14px; border-radius:13px; background:var(--surface-2,#f5f8fc); }
.share-history-entry strong,.share-history-entry small { display:block; }
.share-history-entry small { margin-top:3px; color:var(--text-muted,#64748b); }
.share-history-entry time { color:var(--text-muted,#64748b); font-size:12px; white-space:nowrap; }
.share-history-empty { color:var(--text-muted,#64748b); }
@media(max-width:600px){.share-history-entry{grid-template-columns:1fr}.share-history-entry time{white-space:normal}}
