/* ArcShare scripts content. Shared tokens and primitives: workspace-ui.css. */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { font-size:15px; }
body { font-family:var(--sans); background:var(--bg); color:var(--t0); min-height:100dvh; line-height:1.5; margin:0; padding:0; justify-content:flex-start; align-items:stretch; }
[data-theme="light"] .topnav { background:rgba(240,242,247,0.92); }
[data-theme="dark"] .nav-logo .logo-dark { display:block; }
[data-theme="light"] .nav-logo .logo-light { display:block; }
.theme-btn { background:none; border:1px solid var(--b2); color:var(--t2); border-radius:8px; padding:5px 10px; font-size:15px; cursor:pointer; transition:all .15s; line-height:1; }
.theme-btn:hover { background:var(--b1); color:var(--t0); }
.page-wrap { display:flex; max-width:var(--arc-content-max); margin:0 auto; padding:28px 20px; gap:24px; align-items:flex-start; }
.sidebar { width:220px; flex-shrink:0; position:sticky; top:calc(var(--nav-h) + 16px); }
.sidebar-label { font-size:var(--text-xs); font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--t3); padding:0 10px 8px; }
.cat-btn { display:flex; align-items:center; gap:9px; width:100%; text-align:left; padding:8px 10px; border-radius:8px; border:none; background:none; color:var(--t2); font-size:13px; font-weight:500; cursor:pointer; transition:all .15s; }
.cat-btn:hover { background:var(--b1); color:var(--t0); }
.cat-btn.active { background:var(--acb); color:var(--acc2); }
.cat-btn .cat-icon { font-size:15px; width:20px; text-align:center; flex-shrink:0; }
.cat-btn .cat-count { margin-left:auto; font-size:var(--text-xs); color:var(--t3); background:var(--b1); padding:1px 7px; border-radius:var(--arc-radius-sm); }
.cat-btn.active .cat-count { color:var(--acc2); background:var(--acb); }
.main { flex:1; min-width:0; }
.page-header { margin-bottom:24px; display:block; }
.page-title { font-size:var(--text-title); font-weight:650; color:var(--t0); letter-spacing:-.6px; line-height:1.2; }
.page-subtitle { font-size:14px; color:var(--t2); margin-top:8px; max-width:720px; }
.toolbar { display:flex; gap:10px; align-items:center; margin-bottom:20px; flex-wrap:wrap; }
.search-wrap { flex:1; min-width:200px; }
.search-wrap .s-icon { position:absolute; left:11px; top:50%; transform:translateY(-50%); color:var(--t3); font-size:14px; pointer-events:none; }
#searchInput { width:100%; height:38px; padding:0 12px 0 34px; background:var(--s1); border:1px solid var(--b2); color:var(--t0); border-radius:var(--arc-radius-sm); font-family:var(--sans); font-size:13.5px; transition:border-color .15s; outline:none; }
#searchInput:focus { border-color:var(--acc); }
#searchInput::placeholder { color:var(--t3); }
.lang-filters { display:flex; gap:6px; flex-wrap:wrap; }
.lang-btn { height:var(--control-action-h); padding:0 12px; border-radius:7px; border:1px solid var(--b2); background:var(--s1); color:var(--t2); font-size:12.5px; font-weight:500; cursor:pointer; transition:all .15s; display:flex; align-items:center; gap:5px; }
.lang-btn:hover { border-color:var(--b3); color:var(--t0); }
.lang-btn.active { background:var(--acb); border-color:var(--acc); color:var(--acc2); }
.lang-dot { width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.add-btn { height:var(--control-action-h); padding:0 16px; background:var(--acc); color:#fff; border:none; border-radius:var(--arc-radius-sm); font-size:13px; font-weight:600; cursor:pointer; transition:opacity .15s; display:none; align-items:center; gap:6px; flex-shrink:0; }
.add-btn:hover { opacity:.88; }
body.is-admin .add-btn { display:flex; }
.scripts-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:14px; }
.script-card { background:var(--s1); border:1px solid var(--b2); border-radius:var(--rb); padding:18px 20px; cursor:pointer; transition:border-color .15s,transform .1s,box-shadow .15s; box-shadow:none; display:flex; flex-direction:column; gap:10px; position:relative; overflow:hidden; }
.script-card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:3px; border-radius:14px 0 0 14px; background:transparent; }
.script-card[data-lang="powershell"]::before { background:var(--blue); }
.script-card[data-lang="bash"]::before { background:var(--go); }
.script-card[data-lang="cmd"]::before { background:var(--amb); }
.script-card[data-lang="python"]::before { background:var(--pur); }
.script-card:hover { border-color:var(--b3); transform:none; box-shadow:none; }
.card-top { display:flex; align-items:flex-start; gap:10px; }
.card-icon { width:36px; height:36px; border-radius:var(--arc-radius-md); display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:700; font-family:var(--mono); flex-shrink:0; border:1px solid var(--b2); }
.script-card[data-lang="powershell"] .card-icon { background:var(--blb); color:var(--acc2); }
.script-card[data-lang="bash"] .card-icon { background:var(--gob); color:var(--go); }
.script-card[data-lang="cmd"] .card-icon { background:var(--ambb); color:var(--amb); }
.script-card[data-lang="python"] .card-icon { background:var(--purb); color:var(--pur); }
.card-meta { flex:1; min-width:0; }
.card-name { font-size:13.5px; font-weight:600; color:var(--t0); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.card-cat { font-size:var(--text-xs); color:var(--t3); margin-top:2px; }
.card-desc { font-size:12.5px; color:var(--t2); line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.card-footer { display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:2px; }
.lang-badge { font-size:var(--text-xs); font-weight:600; padding:2px 8px; border-radius:5px; font-family:var(--mono); letter-spacing:.02em; }
.lang-badge.powershell { background:var(--blb); color:var(--acc2); }
.lang-badge.bash { background:var(--gob); color:var(--go); }
.lang-badge.cmd { background:var(--ambb); color:var(--amb); }
.lang-badge.python { background:var(--purb); color:var(--pur); }
.tag-pill { font-size:var(--text-xs); padding:2px 7px; border-radius:5px; background:var(--b1); color:var(--t3); }
.card-copy-btn { margin-left:auto; flex-shrink:0; height:var(--control-action-h); padding:0 10px; background:var(--s2); border:1px solid var(--b2); color:var(--t1); border-radius:6px; font-size:12px; font-weight:500; cursor:pointer; transition:all .15s; display:flex; align-items:center; gap:4px; }
.card-copy-btn:hover { background:var(--s3); border-color:var(--b3); }
.empty-state { text-align:center; padding:60px 20px; color:var(--t3); grid-column:1/-1; }
.empty-state .ei { font-size:40px; margin-bottom:12px; opacity:.5; }
.empty-state h3 { font-size:15px; color:var(--t2); margin-bottom:6px; }
.skeleton { background:var(--s1); border:1px solid var(--b2); border-radius:var(--rb); padding:18px 20px; animation:shimmer 1.4s infinite; }
@keyframes shimmer{0%,100%{opacity:1;}50%{opacity:.5;}}
.sl { height:12px; border-radius:4px; background:var(--b2); margin-bottom:8px; }
.w60 { width:60%; }
.w40 { width:40%; }
.w80 { width:80%; }
.modal-overlay { position:fixed; inset:0; z-index:900; background:rgba(10,12,16,0.75); backdrop-filter:none; display:none; align-items:flex-start; justify-content:center; padding:32px 16px; overflow-y:auto; }
.modal-overlay.open { display:flex; }
.reader { background:var(--s1); border:1px solid var(--b3); border-radius:var(--ra); box-shadow:none; width:100%; max-width:860px; overflow:hidden; animation:slideUp .2s ease; }
@keyframes slideUp{from{transform:translateY(12px);opacity:0;}to{transform:translateY(0);opacity:1;}}
.reader-header { padding:22px 26px 18px; border-bottom:1px solid var(--b2); display:flex; align-items:flex-start; gap:14px; }
.reader-icon { width:44px; height:44px; border-radius:var(--arc-radius-md); display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:700; font-family:var(--mono); flex-shrink:0; border:1px solid var(--b2); }
.reader-info { flex:1; min-width:0; }
.reader-name { font-size:18px; font-weight:700; color:var(--t0); }
.reader-cat { font-size:12.5px; color:var(--t3); margin-top:3px; }
.reader-badges { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.reader-actions { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.reader-copy-btn { height:var(--control-action-h); padding:0 16px; background:var(--acc); color:#fff; border:none; border-radius:8px; font-size:13px; font-weight:600; cursor:pointer; transition:opacity .15s; display:flex; align-items:center; gap:6px; }
.reader-copy-btn:hover { opacity:.88; }
.reader-close { width:36px; height:36px; border-radius:8px; background:var(--s2); border:1px solid var(--b2); color:var(--t2); font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .15s; }
.reader-close:hover { background:var(--s3); color:var(--t0); }
.reader-desc { padding:16px 26px; border-bottom:1px solid var(--b1); font-size:13.5px; color:var(--t1); line-height:1.6; }
.reader-usage { padding:12px 26px; border-bottom:1px solid var(--b2); display:flex; gap:10px; align-items:flex-start; background:var(--ambb); }
.usage-icon { font-size:14px; margin-top:2px; flex-shrink:0; }
.usage-text { font-size:12.5px; color:var(--t1); line-height:1.55; }
.reader-code-header { padding:10px 26px; background:var(--s2); border-top:1px solid var(--b1); display:flex; align-items:center; gap:8px; }
.reader-code-header .rlang { font-size:var(--text-xs); color:var(--t3); font-family:var(--mono); }
.copy-code-btn { margin-left:auto; height:var(--control-action-h); padding:0 10px; background:var(--s3); border:1px solid var(--b2); color:var(--t1); border-radius:5px; font-size:var(--text-xs); font-weight:500; cursor:pointer; transition:all .15s; }
.copy-code-btn:hover { background:var(--s4); }
.reader-code { padding:20px 26px; margin:0; font-family:var(--mono); font-size:12.5px; line-height:1.65; color:var(--t1); white-space:pre; overflow-x:auto; tab-size:2; max-height:65vh; background:var(--bg); }
.reader-footer { padding:12px 26px; border-top:1px solid var(--b2); display:flex; align-items:center; gap:12px; }
.reader-meta { font-size:var(--text-xs); color:var(--t3); }
.reader-tags { display:flex; gap:5px; flex-wrap:wrap; margin-left:auto; }
.admin-btns { display:none; gap:6px; }
body.is-admin .admin-btns { display:flex; }
.edit-btn { height:var(--control-action-h); padding:0 12px; background:var(--s2); border:1px solid var(--b2); color:var(--t1); border-radius:7px; font-size:12px; font-weight:500; cursor:pointer; }
.del-btn { height:var(--control-action-h); padding:0 12px; background:var(--reb); border:1px solid var(--rer); color:var(--red); border-radius:7px; font-size:12px; font-weight:500; cursor:pointer; }
.form-modal { position:fixed; inset:0; z-index:1000; background:rgba(10,12,16,0.8); backdrop-filter:none; display:none; align-items:center; justify-content:center; padding:20px; }
.form-modal.open { display:flex; }
.form-box { background:var(--s1); border:1px solid var(--b3); border-radius:var(--ra); box-shadow:none; width:100%; max-width:640px; max-height:90vh; overflow-y:auto; padding:26px; animation:slideUp .2s ease; }
.form-title { font-size:17px; font-weight:700; color:var(--t0); margin-bottom:20px; }
.form-row { margin-bottom:14px; }
.form-label { font-size:12px; font-weight:600; color:var(--t2); margin-bottom:5px; display:block; }
.form-input,.form-select,.form-textarea { width:100%; background:var(--s2); border:1px solid var(--b2); color:var(--t0); border-radius:8px; font-family:var(--sans); font-size:13.5px; padding:9px 12px; outline:none; transition:border-color .15s; }
.form-input:focus,.form-select:focus,.form-textarea:focus { border-color:var(--acc); }
.form-textarea { font-family:var(--mono); font-size:12.5px; min-height:200px; resize:vertical; line-height:1.6; }
.form-row-2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:14px; }
.form-btns { display:flex; gap:8px; margin-top:20px; justify-content:flex-end; }
.form-save { height:36px; padding:0 18px; background:var(--acc); color:#fff; border:none; border-radius:8px; font-size:13px; font-weight:600; cursor:pointer; }
.form-cancel { height:36px; padding:0 14px; background:var(--s2); border:1px solid var(--b2); color:var(--t1); border-radius:8px; font-size:13px; cursor:pointer; }
.toast { position:fixed; bottom:24px; right:24px; z-index:9999; padding:11px 18px; background:var(--t0); color:var(--bg); border-radius:var(--arc-radius-md); font-size:13px; font-weight:500; opacity:0; transform:translateY(8px); transition:all .25s; pointer-events:none; }
.toast.show { opacity:1; transform:translateY(0); }
@media (max-width:800px) {.page-wrap { flex-direction:column; max-width:var(--arc-content-max); }
.scripts-grid { grid-template-columns:1fr; }
.main { order:1; }
.sidebar { order:2; width:100%; position:static; display:flex; flex-direction:row; overflow-x:auto; gap:6px; padding-bottom:4px; -webkit-overflow-scrolling:touch; scrollbar-width:none; margin-top:8px; }
.sidebar::-webkit-scrollbar { display:none; }
.sidebar-label { display:none; }
.cat-btn { flex-shrink:0; white-space:nowrap; padding:6px 12px; border-radius:var(--arc-radius-sm); border:1px solid var(--b2); background:var(--s1); font-size:12px; }
.cat-btn .cat-count { display:none; }
.cat-btn .cat-icon { display:none; }}
.arc-page-scripts .page-wrap { max-width:1280px; padding-top:24px; }
.arc-page-scripts .page-header { display:block; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:24px; }
.arc-page-scripts .page-title { font-size:var(--text-title); letter-spacing:-.6px; font-weight:650; line-height:1.2; }
.arc-page-scripts .page-subtitle { max-width:720px; font-size:14px; margin-top:8px; }
.script-personal { display:grid; gap:10px; margin-bottom:16px; }
.script-personal[hidden] { display:none !important; }
.script-personal-section { display:flex; align-items:flex-start; gap:12px; padding:12px 14px; background:var(--s1); border:1px solid var(--b1); border-radius:var(--arc-radius-md); }
.script-personal-label { width:74px; flex:0 0 74px; padding-top:6px; font-size:var(--text-xs); font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--t3); }
.script-personal-items { display:flex; flex-wrap:wrap; gap:7px; min-width:0; }
.script-quick { height:32px; max-width:260px; display:inline-flex; align-items:center; gap:7px; padding:0 10px; border:1px solid var(--b2); border-radius:8px; background:var(--s2); color:var(--t1); cursor:pointer; font-size:12px; transition:border-color .12s,background .12s; }
.script-quick:hover { border-color:var(--b3); background:var(--s3); color:var(--t0); }
.script-quick-code { font-family:var(--mono); font-size:var(--text-xs); font-weight:700; color:var(--acc2); }
.script-quick-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.search-wrap { position:relative; }
#searchInput { padding-right:38px; }
.script-search-clear { position:absolute; right:6px; top:50%; transform:translateY(-50%); width:28px; height:28px; border:0; border-radius:7px; background:transparent; color:var(--t3); font-size:16px; cursor:pointer; display:none; align-items:center; justify-content:center; }
.script-search-clear.visible { display:flex; }
.script-search-clear:hover { background:var(--s2); color:var(--t0); }
.script-results-meta { display:flex; align-items:center; gap:8px; min-height:28px; margin:-10px 0 12px; color:var(--t3); font-size:var(--text-xs); }
.script-result-count { font-family:var(--mono); }
.script-active-tag { display:inline-flex; align-items:center; gap:6px; height:26px; padding:0 9px; border:1px solid var(--acr); border-radius:var(--arc-radius-md); background:var(--acb); color:var(--acc2); font-size:var(--text-xs); font-weight:600; cursor:pointer; }
.script-active-tag:hover { border-color:var(--acc2); }
.script-card { padding-right:44px; }
.script-fav-btn { position:absolute; top:12px; right:12px; width:28px; height:var(--control-action-h); border:1px solid transparent; border-radius:7px; background:transparent; color:var(--t3); font-size:16px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:2; }
.script-fav-btn:hover { background:var(--s2); border-color:var(--b2); color:var(--amb); }
.script-fav-btn[aria-pressed="true"] { color:var(--amb); background:var(--ambb); border-color:var(--ambr); }
.reader-fav-btn { width:36px; height:var(--control-action-h); border-radius:8px; background:var(--s2); border:1px solid var(--b2); color:var(--t3); font-size:17px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.reader-fav-btn:hover { background:var(--s3); color:var(--amb); }
.reader-fav-btn[aria-pressed="true"] { color:var(--amb); background:var(--ambb); border-color:var(--ambr); }
.reader-code-header { position:sticky; top:0; z-index:2; }
.reader-code { scrollbar-gutter:stable; }
.script-tag-btn { cursor:pointer; }
@media (max-width:800px) {.arc-page-scripts .page-wrap { padding:18px 14px; gap:12px; }
.arc-page-scripts .page-header { display:block; margin-bottom:24px; }
.arc-page-scripts .sidebar { order:0; width:100%; position:static; margin:0 0 2px; display:flex; overflow-x:auto; gap:6px; padding-bottom:4px; }
.arc-page-scripts .main { order:1; width:100%; }
.script-personal-section { display:block; padding:10px 11px; }
.script-personal-label { width:auto; padding:0; margin-bottom:7px; }
.script-personal-items { flex-wrap:nowrap; overflow-x:auto; padding-bottom:2px; scrollbar-width:none; }
.script-personal-items::-webkit-scrollbar { display:none; }
.script-quick { flex:0 0 auto; max-width:220px; }
.toolbar { gap:8px; }
.search-wrap { flex-basis:100%; }
.lang-filters { width:100%; flex-wrap:nowrap; overflow-x:auto; padding-bottom:2px; scrollbar-width:none; }
.lang-filters::-webkit-scrollbar { display:none; }
.lang-btn { flex:0 0 auto; }
.reader-header { padding:18px; flex-wrap:wrap; }
.reader-actions { width:100%; justify-content:flex-end; }
.reader-desc,.reader-usage,.reader-code-header,.reader-footer { padding-left:18px; padding-right:18px; }
.reader-code { padding:18px; font-size:12px; }}
