html{scroll-behavior:smooth}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Microsoft YaHei,sans-serif;background:#f8fafc;color:#333}.page-layout{min-height:100vh}.sidebar{position:fixed;top:0;left:0;z-index:200;width:260px;height:100vh;background:#fff;border-right:1px solid #e2e8f0;box-shadow:2px 0 12px rgba(0,0,0,.04);display:flex;flex-direction:column;transition:transform .3s ease}.sidebar-header{flex-shrink:0;padding:20px 16px 12px;border-bottom:1px solid #e2e8f0}.sidebar-header strong{display:block;color:#2563eb;font-size:16px}.sidebar-count{display:block;margin-top:4px;color:#94a3b8;font-size:12px}.sidebar-nav{flex:1 1;overflow-y:auto;padding:8px 0 24px;-webkit-overflow-scrolling:touch}.nav-group{margin-bottom:4px}.nav-category{display:flex;align-items:center;justify-content:space-between}.nav-cat-label{display:block;flex:1 1;min-width:0;padding:10px 4px 10px 16px;border:none;background:none;text-align:left;font-size:14px;font-weight:600;color:#1e293b;cursor:pointer;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .15s,color .15s}.nav-cat-label.active,.nav-cat-label:hover{background:#eff6ff;color:#2563eb}.nav-arrow{flex-shrink:0;width:32px;height:32px;border:none;background:none;color:#94a3b8;font-size:10px;line-height:32px;cursor:pointer;transform:rotate(90deg);transition:transform .2s ease,color .15s}.nav-arrow:hover{color:#2563eb}.nav-group.collapsed .nav-arrow{transform:rotate(0deg)}.nav-sub{display:grid;grid-template-rows:1fr;transition:grid-template-rows .25s ease}.nav-group.collapsed .nav-sub{grid-template-rows:0fr}.nav-tools{list-style:none;margin:0;padding:0 0 4px;overflow:hidden;min-height:0}.nav-tool{display:block;width:100%;padding:6px 16px 6px 28px;border:none;background:none;text-align:left;font-size:13px;color:#64748b;cursor:pointer;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .15s,color .15s}.nav-tool.active,.nav-tool:hover{background:#f0f9ff;color:#2563eb}.nav-toggle{display:none;position:fixed;bottom:24px;right:20px;z-index:300;padding:12px 18px;border:none;border-radius:999px;background:#2563eb;color:#fff;font-size:15px;font-weight:600;cursor:pointer;box-shadow:0 4px 16px rgba(37,99,235,.4);transition:background .15s}.nav-toggle:hover{background:#1d4ed8}.nav-overlay{display:none}.main-content{margin-left:260px}.container,.main-content{max-width:1100px;padding:24px}.container{margin:auto}.hero{background:#f0faff;padding:30px;border-radius:20px}h1,h2{color:#2563eb}h2{margin-top:40px}.anchor-target{scroll-margin-top:20px}.count{color:#64748b;font-size:.85em;font-weight:400;margin-left:6px}.card{background:white;border-radius:16px;padding:20px;margin:15px 0;box-shadow:0 5px 20px rgba(0,0,0,.05)}.tag{color:#10b981}.rating{color:#f59e0b;font-size:14px}.rating-num{color:#666;font-size:13px}a{color:#2563eb;text-decoration:none}.search{width:100%;padding:14px;border-radius:12px;border:1px solid #ddd;font-size:16px;box-sizing:border-box}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));grid-gap:15px;gap:15px}@media (max-width:900px){.sidebar{transform:translateX(-100%)}.sidebar.open{transform:translateX(0)}.nav-overlay,.nav-toggle{display:block}.nav-overlay{position:fixed;inset:0;z-index:150;background:rgba(0,0,0,.35)}.main-content{margin-left:0;padding:16px 16px 80px}.anchor-target{scroll-margin-top:12px}}@media (min-width:901px){.sidebar-header:after{content:none}}