:root{--bg:#f5f7ff;--o1:#dce7ff;--o2:#eddcff;--card:#ffffffad;--text:#172033;--muted:#68758d;--line:#7184a938;--brand:#5046e5;--soft:#e9e8ff;--shadow:0 18px 50px #25315a1c}:root[data-theme=dark]{--bg:#0b1020;--o1:#18285b;--o2:#3d2458;--card:#121a30b3;--text:#f2f5ff;--muted:#abb6ce;--line:#b9c6e629;--brand:#a5b4fc;--soft:#818cf82b;--shadow:0 18px 50px #00000052}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0b1020;--o1:#18285b;--o2:#3d2458;--card:#121a30b3;--text:#f2f5ff;--muted:#abb6ce;--line:#b9c6e629;--brand:#a5b4fc;--soft:#818cf82b}}*{box-sizing:border-box}body{margin:0;min-width:320px;color:var(--text);font:15px/1.5 Inter,"Noto Sans TC","Microsoft JhengHei",system-ui;background:radial-gradient(circle at 2% 0,var(--o1),transparent 31rem),radial-gradient(circle at 100% 8%,var(--o2),transparent 29rem),var(--bg)}button,input{font:inherit}.shell{width:min(1500px,calc(100% - 32px));margin:auto;padding:24px 0 40px}.glass{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(20px) saturate(150%)}.top{display:flex;align-items:center;gap:12px;padding:13px 16px;border-radius:16px}.brand{display:flex;align-items:center;gap:10px;color:var(--text);font-weight:800;text-decoration:none}.mark{display:grid;width:35px;height:35px;place-items:center;color:white;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:12px}.brand small{display:block;color:var(--muted);font-size:.65rem;letter-spacing:.1em}.search{flex:1;max-width:620px;margin-left:auto}.search input{width:100%;padding:10px;color:var(--text);background:#ffffff80;border:1px solid var(--line);border-radius:11px}.button,.icon,.pin,.collapse{border:1px solid var(--line);border-radius:11px;background:transparent;color:var(--text);cursor:pointer}.button{padding:9px 12px;font-size:.82rem}.icon{width:40px;height:40px}.dash{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;margin-top:24px}.cats{position:sticky;top:16px;padding:8px;border-radius:16px}.cats a{display:flex;justify-content:space-between;gap:8px;padding:7px 6px;color:var(--muted);font-size:.82rem;border-radius:9px;text-decoration:none}.cats a:hover{color:var(--brand);background:var(--soft)}.cats em{font-size:.7rem;font-style:normal}.groups{display:grid;gap:13px}.group{padding:15px 17px;border-radius:16px}.head{display:flex;align-items:center;gap:9px;margin-bottom:12px}.badge{display:grid;width:31px;height:31px;place-items:center;color:var(--brand);background:var(--soft);border-radius:10px}.head h2{margin:0;font-size:.95rem}.head small{margin-left:auto;color:var(--muted)}.collapse{padding:2px 7px}.links{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:7px}.group.is-collapsed .links{display:none}.link{display:flex;align-items:center;gap:7px;min-width:0;padding:8px;background:#ffffff75;border:1px solid transparent;border-radius:10px;transition:.18s}.link:hover{border-color:var(--line);transform:translateY(-2px)}.link a{overflow:hidden;color:var(--text);font-size:.85rem;font-weight:650;text-decoration:none;text-overflow:ellipsis;white-space:nowrap}.fav,.fallback{display:grid;width:18px;height:18px;flex:0 0 auto;place-items:center;border-radius:4px;font-size:10px}.fallback{color:white;background:var(--brand)}.pin{margin-left:auto;padding:1px 5px;color:var(--muted)}.pin.active{color:#f59e0b}.divider{height:1px;grid-column:1/-1;background:var(--line)}.loading,.empty{padding:54px;color:var(--muted);text-align:center}footer{padding:26px 4px 0;color:var(--muted);font-size:.78rem;text-align:center}footer a{color:inherit}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}@media(max-width:860px){.dash{grid-template-columns:1fr}.cats{position:static;display:flex;gap:6px;overflow:auto}.cats a{flex:0 0 auto}}@media(max-width:600px){.shell{width:calc(100% - 20px);padding-top:10px}.top{flex-wrap:wrap}.search{order:3;flex-basis:100%}.links{grid-template-columns:1fr}}
.bookmark-form{min-width:min(360px,90vw);display:grid;gap:13px;padding:6px;color:var(--text);background:var(--card)}.bookmark-form h2{margin:0;font-size:1.05rem}.bookmark-form label{display:grid;gap:5px;color:var(--muted);font-size:.82rem}.bookmark-form input{padding:9px;color:var(--text);background:transparent;border:1px solid var(--line);border-radius:9px}.bookmark-form menu{display:flex;justify-content:flex-end;gap:8px;margin:3px 0 0;padding:0}.bookmark-form button{padding:8px 12px;color:var(--text);background:var(--soft);border:1px solid var(--line);border-radius:9px;cursor:pointer}dialog{border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);background:var(--card);backdrop-filter:blur(20px)}dialog::backdrop{background:#0b102080}
.link{display:grid;grid-template-columns:20px minmax(0,1fr) 36px auto auto}.link a{display:block;min-width:0;width:100%;color:var(--text)!important;line-height:1.35}.pin{width:30px;min-height:30px;margin:0}.edit-custom,.delete-custom{width:30px;min-height:30px;background:transparent;border:1px solid var(--line);border-radius:8px;cursor:pointer}.edit-custom{color:var(--brand)}.delete-custom{color:#dc2626}.head h2{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.collapse{flex:0 0 36px;min-height:32px}@media(max-width:600px){.group{padding:12px}.head{gap:7px;margin-bottom:10px}.head small{display:none}.head h2{font-size:1rem}.links{grid-template-columns:minmax(0,1fr);gap:8px}.link{grid-template-columns:22px minmax(0,1fr) 36px auto auto;min-height:46px;padding:9px}.link a{font-size:.95rem}.fav,.fallback{width:20px;height:20px}.pin{font-size:1rem}.cats{scroll-snap-type:x proximity}.cats a{scroll-snap-align:start}.top{gap:8px}.button{padding:9px}.brand{font-size:.9rem}.brand small{font-size:.58rem}}
.clear-recent{padding:3px 7px;color:var(--muted);background:transparent;border:1px solid var(--line);border-radius:8px;font-size:.72rem;cursor:pointer}.clear-recent:hover{color:var(--brand);background:var(--soft)}
.quick-nav{display:grid;justify-content:center;gap:6px;margin-bottom:16px}.quick-nav strong{color:var(--text)}.quick-nav a{display:block;text-decoration:none}.quick-nav a:hover{color:var(--brand);text-decoration:underline}
