/* directory-base */

:root{color-scheme:light;--bg:#f5f6f8;--panel:#fff;--text:#303846;--sub:#7a8495;--line:#e9ecf1;--blue:#3978ed;--soft:#edf3ff;--hover:#f7f9fc;--shadow:0 3px 12px #24375d04;--tag:#eff2f7;--green:#43a889}html[data-theme=dark]{color-scheme:dark;--bg:#181b21;--panel:#22262e;--text:#dee3ed;--sub:#929caf;--line:#303641;--blue:#87acff;--soft:#2b3750;--hover:#292f39;--shadow:none;--tag:#303744;--green:#76cdb0}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;background:var(--bg);font:13px/1.5 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--text)}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button,a,input{touch-action:manipulation}button{color:inherit}a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--blue);outline-offset:3px}button{border:0;background:none}svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.65;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}.sidebar{width:205px;position:fixed;inset:0 auto 0 0;background:var(--panel);border-right:1px solid var(--line);padding:25px 18px 18px;display:flex;flex-direction:column;overflow:auto;z-index:10}.brand{display:flex;gap:10px;align-items:center;font-size:21px;letter-spacing:-.5px;font-weight:700}.brand-mark{font-family:Georgia,serif;font-size:36px;color:var(--blue);line-height:1}.brand small{display:block;font-size:10px;font-weight:400;letter-spacing:.2px;color:var(--sub);margin-top:3px}.side-label{font-size:10px;color:var(--sub);padding:0 12px;margin:28px 0 10px}.side-nav{display:flex;flex-direction:column;gap:4px}.side-nav button{display:flex;align-items:center;gap:12px;width:100%;font-size:12px;text-align:left;padding:10px 12px;border-radius:6px;color:var(--sub)}.side-nav button svg{width:16px;height:16px;color:#92a2be}.side-nav button.active{background:var(--soft);color:var(--blue);font-weight:600}.side-nav button:hover{background:var(--hover);color:var(--blue)}.side-nav small{margin-left:auto;font-size:10px;opacity:.7}.side-foot{margin-top:auto;border-top:1px solid var(--line);padding:20px 12px 0;font-size:10px;color:var(--sub);line-height:1.9}.side-foot strong{font-weight:500;color:var(--text)}.topbar{position:sticky;top:0;margin-left:205px;z-index:9;background:var(--panel);border-bottom:1px solid var(--line);height:61px;padding:0 29px;display:flex;align-items:center;justify-content:space-between;gap:15px}.toplinks{display:flex;align-items:center;gap:26px;font-size:12px;color:var(--sub)}.toplinks a:first-child{color:var(--blue);font-weight:600}.topright{display:flex;gap:16px;align-items:center;font-size:11px;color:var(--sub)}.theme-toggle{display:flex;gap:6px;align-items:center;padding:8px 10px;background:var(--hover);border-radius:6px;font-size:11px}.theme-toggle svg{width:15px;height:15px}.small-pill{font-size:9px;padding:3px 8px;background:var(--tag);color:var(--sub);border-radius:4px}.mobile-logo{display:none}.main{margin-left:205px;padding:0 29px 24px;max-width:1770px}.search-zone{padding:27px 0 24px;display:flex;flex-direction:column;align-items:center}.search-zone h1{font-size:23px;letter-spacing:-.6px;font-weight:650;margin:0 0 5px}.search-zone>p{font-size:11px;color:var(--sub);margin:0 0 18px}.search-context{display:flex;gap:27px;margin-bottom:12px}.search-context button{padding:0 0 7px;font-size:12px;color:var(--sub);border-bottom:2px solid transparent}.search-context button.active{color:var(--blue);border-color:var(--blue)}.search-form{display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);width:min(790px,100%);padding:7px 8px 7px 19px;border-radius:7px;box-shadow:var(--shadow)}.search-form>svg{color:#a0abba}.search-form input{color:var(--text);background:none;min-width:0;flex:1;outline:none;border:0;padding:11px 0;font-size:12px}.search-form button{background:#4e85ec;color:#fff;border-radius:5px;padding:10px 26px;font-size:12px}.engine-row{display:flex;gap:16px;align-items:center;margin-top:11px;font-size:10px;color:var(--sub)}.engine-row button{padding:1px 0;color:var(--sub);font-size:10px}.engine-row button.active{color:var(--blue)}.engine-row i{height:10px;width:1px;background:var(--line);margin:0 2px}.discovery-shortcuts{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:7px;overflow:hidden;margin-bottom:20px}.shortcut{padding:13px 14px;background:var(--panel);text-align:left;display:flex;align-items:center;gap:10px;color:var(--text);font-size:12px}.shortcut svg{width:17px;height:17px;color:var(--blue)}.shortcut small{font-size:9px;color:var(--sub);margin-left:auto}.shortcut:hover{background:var(--hover)}.section{margin-bottom:21px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.section-head h2{font-size:15px;font-weight:650;letter-spacing:-.2px;display:flex;gap:8px;align-items:center;margin:0}.section-head h2>svg{width:17px;color:var(--blue)}.section-head h2 small{font-size:10px;font-weight:400;color:var(--sub);margin-left:6px}.section-head>a,.section-head>button,.section-head>span{font-size:10px;color:var(--sub)}.eco-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.eco-card{background:var(--panel);border:1px solid var(--line);padding:15px 16px;display:flex;align-items:center;gap:12px;border-radius:6px;text-align:left;min-width:0}.eco-card:hover{border-color:var(--blue)}.eco-icon{height:36px;width:36px;border-radius:9px;background:var(--soft);color:var(--blue);display:grid;place-items:center;font-weight:650;font-size:12px;flex:none}.eco-card:nth-child(2) .eco-icon{color:#cc7291;background:#cc729115}.eco-card:nth-child(3) .eco-icon{color:#9b80d9;background:#9b80d915}.eco-card:nth-child(4) .eco-icon{color:var(--green);background:#43a88915}.eco-card strong{font-size:13px;display:block;font-weight:600;margin-bottom:5px}.eco-card p{font-size:10px;margin:0;color:var(--sub)}.eco-card>svg{margin-left:auto;color:var(--sub);height:13px;width:13px}.latest-box{background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:14px 17px;display:grid;grid-template-columns:95px 1fr 35px;gap:15px;align-items:center;margin-bottom:19px}.latest-label strong{display:block;font-size:13px;white-space:nowrap}.latest-label strong:before{content:"";display:inline-block;width:5px;height:5px;background:var(--green);border-radius:50%;vertical-align:middle;margin-right:7px}.latest-label small{display:block;font-size:9px;color:var(--sub);margin-top:5px}.ticker-window{overflow:hidden;min-width:0;mask-image:linear-gradient(to right,transparent,#000 2%,#000 97%,transparent);touch-action:pan-x}.ticker-track{display:flex;width:max-content;gap:14px;animation:ticker var(--ticker-duration,60s) linear infinite}.ticker-cycle{display:flex;gap:14px;flex:none}.ticker-item{display:flex;align-items:center;gap:10px;padding:2px 13px 2px 0;border-right:1px solid var(--line);width:194px;flex:none}.ticker-item strong{font-size:11px;display:block;font-weight:550;white-space:nowrap}.ticker-item small{display:block;font-size:9px;color:var(--sub);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px}.ticker-item .site-icon{width:25px;height:25px;flex:none}.ticker-control{color:var(--sub);display:grid;place-items:center;background:var(--hover);width:29px;height:29px;border-radius:5px}.ticker-control svg{width:13px;height:13px}.latest-box:hover .ticker-track,.latest-box:has(.ticker-item:focus) .ticker-track,.latest-box.paused .ticker-track{animation-play-state:paused}.latest-box.no-loop .ticker-track{animation:none}.latest-box.no-loop .ticker-copy{display:none}@keyframes ticker{to{transform:translateX(calc(-1 * var(--ticker-distance)))}}.personal{background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:16px 18px;margin-bottom:23px}.personal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:12px}.tabs{display:flex;gap:21px;align-items:center}.tabs button{font-size:11px;color:var(--sub);padding:0}.tabs button.active{color:var(--blue);font-weight:600}.personal-note{font-size:9px;color:var(--sub)}.quick-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:14px}.quick-link{display:flex;gap:7px;align-items:center;font-size:11px;min-width:0}.quick-link>span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quick-link:hover{color:var(--blue)}.site-icon{position:relative;width:28px;height:28px;display:grid;place-items:center;color:var(--blue);background:var(--soft);border-radius:6px;overflow:hidden;font-size:11px;flex:none}.site-icon img{position:absolute;inset:2px;width:calc(100% - 4px);height:calc(100% - 4px);object-fit:contain;background:#fff;border-radius:4px}.quick-link .site-icon{height:22px;width:22px;border-radius:5px}.recommend-head{display:flex;gap:23px;align-items:center}.recommend-head h2{margin-right:8px}.recommend-head .tabs{gap:18px}.recommend-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.resource-card{position:relative;display:flex;gap:10px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:15px 13px;min-height:78px;min-width:0;box-shadow:var(--shadow)}.resource-card:hover{border-color:#8aa9e1}.resource-card:focus-within{border-color:var(--blue)}.resource-copy{flex:1;min-width:0;padding-right:7px}.resource-copy a{font-size:11px;font-weight:600;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.resource-copy a:after{content:"";position:absolute;inset:0;border-radius:6px}.resource-copy p{margin:5px 0 0;color:var(--sub);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.save{position:absolute;top:2px;right:2px;padding:4px;z-index:2;width:23px;height:23px;color:#b0bacb;font-size:11px;display:grid;place-items:center}.save.saved{color:var(--blue)}.resource-copy a:hover{color:var(--blue)}.mini-badge{font-size:8px;background:var(--soft);color:var(--blue);padding:2px 5px;border-radius:3px;margin-left:6px;vertical-align:middle}.catalog-head{border-bottom:1px solid var(--line);padding-bottom:12px}.catalog-tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px}.catalog-tabs button{border:1px solid var(--line);background:var(--panel);padding:6px 11px;font-size:10px;color:var(--sub);border-radius:4px}.catalog-tabs button.active{background:var(--soft);border-color:var(--blue);color:var(--blue)}.groups{display:flex;flex-direction:column;gap:22px}.group{scroll-margin-top:85px}.group-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px;gap:15px}.group-title{display:flex;align-items:center;gap:8px}.group-title svg{color:var(--blue);height:17px;width:17px}.group-title h3{font-size:14px;margin:0;font-weight:600}.group-title small{font-size:10px;color:var(--sub);margin-left:5px}.group-sub{display:flex;gap:12px;align-items:center}.group-sub button{color:var(--sub);font-size:10px;padding:0}.group-sub a{color:var(--sub);font-size:10px}.group-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.empty{grid-column:1/-1;padding:24px;border:1px dashed var(--line);color:var(--sub);font-size:12px;text-align:center;border-radius:6px}.result-line{color:var(--sub);font-size:11px;margin-bottom:13px}.result-line button{color:var(--blue);font-size:11px;margin-left:12px}.eco-expanded{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.eco-expanded .eco-card{min-height:82px}.eco-expanded .eco-card button,.eco-expanded .eco-card>a{font-size:10px;color:var(--blue);margin-left:auto;white-space:nowrap;z-index:2}.footer{margin-top:30px;background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:22px 24px;color:var(--sub)}.footer-head{display:flex;align-items:center;justify-content:space-between;gap:18px}.footer-head strong{font-size:14px;color:var(--text)}.footer-links{display:flex;gap:18px;font-size:11px}.footer p{font-size:10px;margin:10px 0 0;line-height:1.9}.footer-bottom{margin-top:17px;border-top:1px solid var(--line);padding-top:16px;display:flex;justify-content:space-between;align-items:center;font-size:10px;gap:15px}.uptime{font-size:12px!important;color:var(--text);margin:0!important;white-space:nowrap}.uptime strong{font-size:17px;color:var(--blue);margin:0 4px;font-variant-numeric:tabular-nums}.bottom-tools{display:flex;gap:15px;align-items:center}.bottom-tools button{font-size:10px;color:var(--sub)}.float-tools{position:fixed;bottom:25px;right:14px;display:flex;flex-direction:column;gap:7px;z-index:11}.float-tools button{background:var(--panel);border:1px solid var(--line);border-radius:6px;width:34px;height:34px;color:var(--sub);display:grid;place-items:center;box-shadow:var(--shadow)}.float-tools svg{width:15px;height:15px}.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);padding:12px 18px;background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:7px;box-shadow:0 8px 30px #0001;z-index:30;font-size:12px;display:none}.sync-note{font-size:9px;color:var(--sub)}.mobile-menu{display:none}.side-nav button svg,.shortcut svg{opacity:.85}
@media(min-width:1700px){.main{padding:0 40px 30px}.resource-copy a{font-size:12px}.resource-copy p{font-size:10px}}@media(max-width:1250px){.sidebar{width:180px;padding:23px 13px}.topbar,.main{margin-left:180px}.topbar{padding:0 23px}.main{padding:0 23px 24px}.group-grid,.recommend-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.recommend-grid>.resource-card:nth-child(n+11){display:none}.quick-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.quick-link:nth-child(n+7){display:none}.toplinks{gap:19px}.recommend-head{gap:17px}.recommend-head .tabs{gap:13px}}@media(max-width:980px){.sidebar{width:164px;padding:23px 10px}.topbar,.main{margin-left:164px}.main{padding:0 18px 24px}.topbar{padding:0 18px}.group-grid,.recommend-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.recommend-grid>.resource-card:nth-child(n+9){display:none}.discovery-shortcuts{grid-template-columns:repeat(4,minmax(0,1fr))}.eco-grid{gap:8px}.eco-card{padding:12px 10px;gap:8px}.eco-card p{font-size:8px}.eco-icon{height:30px;width:30px;font-size:10px}.eco-card strong{font-size:11px}.toplinks a:nth-child(n+4){display:none}.search-context{gap:24px}.recommend-head h2{margin-right:0}.recommend-head .tabs{gap:10px}.recommend-head .tabs button{font-size:10px}.group-sub button{display:none}.latest-box{grid-template-columns:86px 1fr 30px;gap:10px;padding:12px}.footer-links{gap:12px}}@media(max-width:760px){.sidebar{display:none}.main,.topbar{margin-left:0}.toplinks{display:none}.mobile-logo{display:flex;font-size:17px}.mobile-logo .brand-mark{font-size:29px}.topbar{height:58px;padding:0 17px}.main{padding:0 17px 22px}.mobile-menu{display:grid;place-items:center;padding:8px}.search-zone{padding:24px 0 22px}.search-zone h1{font-size:23px}.group-grid,.recommend-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.footer-head{align-items:flex-start}.footer-bottom{flex-wrap:wrap}.side-open .sidebar{display:flex;width:240px;box-shadow:20px 0 80px #0004;padding:24px;inset:58px auto 0 0}.recommend-head{flex-wrap:wrap;gap:9px}.section-head h2 small{display:none}}@media(max-width:520px){.main{padding:0 14px 22px}.topright{gap:9px}.topright .small-pill{display:none}.topright>a{display:none}.theme-toggle{font-size:10px;padding:7px 9px}.search-zone h1{font-size:22px}.search-zone>p{font-size:10px}.search-context{gap:22px}.search-context button{font-size:11px}.search-form{padding-left:13px;gap:8px}.search-form input{font-size:11px}.search-form button{padding:10px 20px;font-size:11px}.engine-row{gap:14px;font-size:9px}.discovery-shortcuts{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:18px}.shortcut{padding:12px 9px;gap:7px;font-size:10px}.shortcut svg{height:14px;width:14px}.shortcut small{font-size:8px}.eco-grid{grid-template-columns:1fr 1fr;gap:8px}.eco-card{padding:13px 11px;gap:9px}.eco-card p{font-size:9px}.eco-card strong{font-size:12px}.latest-box{grid-template-columns:75px 1fr 27px;padding:11px 10px;gap:7px}.latest-label strong{font-size:11px}.latest-label small{font-size:8px}.ticker-item{width:180px}.ticker-window{overflow-x:auto;scrollbar-width:none;mask-image:none}.ticker-window::-webkit-scrollbar{display:none}.ticker-item strong{font-size:11px}.ticker-item small{font-size:9px}.personal{padding:14px 12px}.tabs{gap:15px}.tabs button{font-size:10px}.personal-note{font-size:8px}.quick-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.quick-link{font-size:10px}.quick-link:nth-child(n+7){display:flex}.group-grid,.recommend-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.resource-card{padding:13px 9px;min-height:74px;gap:9px}.resource-copy a{font-size:11px}.resource-copy p{font-size:9px}.resource-card .site-icon{width:25px;height:25px}.resource-copy{padding-right:3px}.save{top:0;right:0}.recommend-head{display:block}.recommend-head .tabs{margin-top:11px;gap:17px}.section-head h2{font-size:14px}.section-head{align-items:flex-start}.catalog-tabs{gap:6px}.catalog-tabs button{font-size:9px;padding:6px 9px}.group-title h3{font-size:13px}.group-title small{font-size:9px}.group-sub a{font-size:9px}.eco-expanded{grid-template-columns:1fr}.footer{padding:18px 15px}.footer-head{flex-direction:column;gap:12px}.footer-links{gap:14px;flex-wrap:wrap;font-size:10px}.footer-bottom{gap:10px;align-items:flex-start;flex-direction:column}.uptime{font-size:11px!important}.uptime strong{font-size:16px}.float-tools{right:8px;bottom:18px}.float-tools button{width:30px;height:30px}.footer-bottom .bottom-tools{gap:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}.ticker-track{animation:none!important}.ticker-copy{display:none}.ticker-window{overflow-x:auto;mask-image:none}}
.brand-mark{width:35px;height:35px;display:grid;place-items:center;flex:none;color:var(--blue)}.brand-mark img{display:block;width:35px;height:35px}.sponsor-section{margin-bottom:21px}.sponsor-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.sponsor-heading h2{font-size:13px;margin:0;font-weight:600}.ad-label{font-size:9px;color:var(--sub);border:1px solid var(--line);border-radius:3px;padding:2px 6px}.sponsor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.sponsor-card{display:flex;align-items:center;gap:13px;min-width:0;min-height:82px;border:1px solid var(--line);border-radius:6px;padding:15px 17px;background:var(--panel);position:relative}.sponsor-card:hover{border-color:#a6b8d8}.sponsor-symbol{width:37px;height:37px;display:grid;place-items:center;flex:none;border-radius:8px;background:#be936318;color:#b18b5d}.sponsor-symbol img{width:100%;height:100%;object-fit:contain;border-radius:7px}.sponsor-symbol svg{height:20px;width:20px}.sponsor-card strong{font-size:12px;font-weight:600;display:block}.sponsor-card p{font-size:10px;color:var(--sub);margin:5px 0 0}.sponsor-card>.ad-label{position:absolute;right:9px;top:6px;font-size:8px;border:0;padding:0}.sponsor-card>div{min-width:0;padding-right:20px}.sponsor-placeholder{background:linear-gradient(105deg,var(--panel),var(--hover));border-style:dashed}.sponsor-dialog{width:min(420px,calc(100% - 36px));border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text);padding:27px}.sponsor-dialog::backdrop{background:#10192866}.sponsor-dialog h2{font-size:19px;margin:0 0 14px}.sponsor-dialog p{font-size:13px;color:var(--sub);line-height:1.9}.sponsor-dialog button{padding:9px 19px;background:var(--soft);color:var(--blue);border-radius:5px;margin-top:8px}.footer-links button{font-size:inherit;color:inherit;padding:0}@media(max-width:760px){.mobile-logo .brand-mark{width:28px;height:28px}.mobile-logo .brand-mark img{width:28px;height:28px}.sponsor-card{padding:14px 11px;gap:9px}.sponsor-card p{font-size:9px}.sponsor-symbol{height:30px;width:30px}}@media(max-width:520px){.sponsor-grid{grid-template-columns:1fr;gap:8px}.sponsor-card{min-height:62px;padding:13px}.sponsor-card strong{font-size:11px}.sponsor-card p{font-size:9px}.sponsor-heading h2{font-size:12px}}
.uptime-clock{font-variant-numeric:tabular-nums;font-size:11px;white-space:nowrap}.uptime strong{font-variant-numeric:tabular-nums}
/* directory-ambient */
/* YS: quiet atmosphere around a dense, readable directory. */
:root {
  --ambient-base: #f3f6fc;
  --ambient-blue: #abc7fa70;
  --ambient-lilac: #d4cafb75;
  --ambient-gold: #f2d49f80;
  --ambient-mist: #ffffffc4;
  --ambient-ink: #6584bf;
  --ambient-noise: .14;
  --ambient-orbit-opacity: .8;
  --panel: #ffffffed;
  --line: #dce4ef;
  --sub: #667287;
  --shadow: 0 3px 16px #38517c07;
}
html[data-theme='dark'] {
  --ambient-base: #111827;
  --ambient-blue: #4569b86b;
  --ambient-lilac: #67609850;
  --ambient-gold: #bda16b38;
  --ambient-mist: #19243d40;
  --ambient-ink: #8da8df;
  --ambient-noise: .09;
  --ambient-orbit-opacity: .45;
  --panel: #202a3bed;
  --text: #e7edf8;
  --sub: #a9b6cc;
  --line: #3a496360;
  --hover: #2a364a;
  --soft: #2c3e5a;
}
body {
  isolation: isolate;
  background: var(--ambient-base);
}
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(ellipse 65% 49% at 94% 5%, var(--ambient-gold), transparent 75%),
    radial-gradient(ellipse 76% 69% at 39% -12%, var(--ambient-blue), transparent 77%),
    radial-gradient(ellipse 53% 59% at 78% 49%, var(--ambient-lilac), transparent 80%),
    radial-gradient(ellipse 50% 42% at 22% 97%, var(--ambient-blue), transparent 80%),
    linear-gradient(135deg, var(--ambient-mist), transparent 66%);
}
body::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: var(--ambient-noise);
  background-image: url('/ambient-grain.svg');
  background-size: 120px 120px;
}
.main { position: relative; --ambient-gutter: 29px; }
.search-zone {
  position: relative;
  isolation: isolate;
}
.search-zone::before {
  content: '';
  position: absolute;
  inset: -15px calc(-1 * var(--ambient-gutter)) -52px;
  z-index: -1;
  pointer-events: none;
  background: url('/ambient-orbits.svg') center 39% / cover no-repeat;
  opacity: var(--ambient-orbit-opacity);
  color: var(--ambient-ink);
}
.search-zone h1 { color: var(--text); text-shadow: 0 1px 18px #ffffff20; }
.search-form {
  box-shadow: 0 10px 35px #385f9e0c, inset 0 1px 0 #ffffff99;
  border-color: #b6c9e88c;
}
.sidebar, .topbar {
  background: #ffffffb8;
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}
html[data-theme='dark'] .sidebar,
html[data-theme='dark'] .topbar {
  background: #182132d9;
}
html[data-theme='dark'] .search-form {
  box-shadow: 0 14px 36px #030b1c25, inset 0 1px 0 #ffffff0b;
  border-color: #6b88b350;
}
.resource-card, .eco-card, .personal, .latest-box, .footer {
  box-shadow: 0 2px 9px #244b7d05;
}
html[data-theme='dark'] .resource-card,
html[data-theme='dark'] .eco-card,
html[data-theme='dark'] .personal,
html[data-theme='dark'] .latest-box,
html[data-theme='dark'] .footer { box-shadow: 0 2px 12px #07102314; }
@media (min-width: 1700px) { .main { --ambient-gutter: 40px; } }
@media (max-width: 1250px) { .main { --ambient-gutter: 23px; } }
@media (max-width: 980px) { .main { --ambient-gutter: 18px; } }
@media (max-width: 760px) {
  .main { --ambient-gutter: 17px; }
  .search-zone::before { inset-block: -16px -35px; background-size: auto 370px; }
  .sidebar { background: #f8fafff7; }
  html[data-theme='dark'] .sidebar { background: #182132f7; }
}
@media (max-width: 520px) { .main { --ambient-gutter: 14px; } }
@media (forced-colors: active) {
  body::before, body::after, .search-zone::before { display: none; }
  .sidebar, .topbar { background: Canvas; backdrop-filter: none; }
}

/* directory-motion */
/* A single brand entrance; small feedback only where a visitor acts. */
.ys-intro { display: none; }
html.ys-intro-active .ys-intro {
  display: grid; place-items: center; position: fixed; inset: 0; z-index: 80;
  pointer-events: none; overflow: hidden; background: var(--ambient-base);
}
.ys-intro::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse 34% 42% at 50% 44%, #ecc67b32, transparent 80%),
    radial-gradient(ellipse 64% 64% at 20% 12%, var(--ambient-blue), transparent 80%),
    radial-gradient(ellipse 55% 65% at 92% 88%, var(--ambient-lilac), transparent 80%);
}
.ys-intro-stage { position: relative; display: flex; flex-direction: column; align-items: center; }
.ys-intro-orbit {
  position: absolute; width: 282px; height: 282px; top: -89px;
  border: 1px solid #be995728; border-radius: 50%;
  box-shadow: 0 0 80px #d6ab4610, inset 0 0 64px #d6ab4609;
}
.ys-intro-orbit::before {
  content: ''; position: absolute; inset: 24px; border: 1px solid #be995717; border-radius: 50%;
}
.ys-intro-orbit::after {
  content: ''; position: absolute; width: 5px; height: 5px; border-radius: 50%;
  left: 38px; top: 36px; background: #e0b359; box-shadow: 0 0 12px #e0b37c;
}
.ys-intro-emblem { width: 104px; height: 104px; position: relative; }
.ys-intro-emblem img { width: 100%; height: 100%; filter: drop-shadow(0 12px 18px #b17b2228); }
.ys-intro-outline { position: absolute; inset: 0; width: 100%; height: 100%; color: #c59230; }
.ys-intro-outline path { stroke-width: .65; stroke-dasharray: 180; stroke-dashoffset: 180; }
.ys-intro-sweep {
  position: absolute; inset: 12px 0; pointer-events: none; overflow: hidden;
  mask: url('/logo-gold-ingot.svg') center / 104px 104px no-repeat;
  -webkit-mask: url('/logo-gold-ingot.svg') center / 104px 104px no-repeat;
}
.ys-intro-sweep::after {
  content: ''; display: block; width: 24px; height: 120px;
  background: linear-gradient(90deg, transparent, #fff9d4d9, transparent);
  transform: translateX(-40px) skewX(-20deg);
}
html.ys-intro-active .ys-intro-outline path { animation: ys-outline 400ms ease-out forwards; }
html.ys-intro-active .ys-intro-emblem img { animation: ys-materialize 430ms ease-out both; }
html.ys-intro-active .ys-intro-sweep::after { animation: ys-gold-sweep 520ms 80ms ease-in-out both; }
.ys-intro-title { margin: 22px 0 6px; font-size: 27px; font-weight: 650; letter-spacing: -.8px; }
.ys-intro-caption { margin: 0; font-size: 11px; letter-spacing: 3px; color: var(--sub); }
.ys-intro-index { display: flex; gap: 15px; margin-top: 30px; font-size: 9px; letter-spacing: 1px; color: var(--sub); }
.ys-intro-index span + span::before { content: '/'; margin-right: 15px; opacity: .35; }
.ys-intro-flight { position: fixed; pointer-events: none; z-index: 81; filter: drop-shadow(0 4px 9px #c1953020); }
.ys-preview-replay {
  position: fixed; right: 14px; bottom: 111px; z-index: 12;
  display: flex; align-items: center; gap: 7px;
  padding: 9px 12px; border: 1px solid #c3a46565; border-radius: 20px;
  background: var(--panel); color: var(--text); font-size: 10px;
  box-shadow: 0 4px 18px #172f5810;
}
.ys-preview-replay img { width: 20px; height: 20px; }
.ys-preview-replay:disabled { cursor: default; opacity: .6; }
.search-form { transition: border-color 200ms, box-shadow 200ms, transform 200ms; }
.search-form:focus-within { border-color: var(--blue); box-shadow: 0 0 0 4px #4e85ec12, 0 10px 34px #385f9e15; }
.resource-card, .eco-card, .sponsor-card { transition: transform 180ms ease, border-color 180ms, box-shadow 180ms; }
.save { transition: color 150ms, transform 150ms; border-radius: 50%; }
.save.saved { color: #cf9b33; }
.save:focus-visible { outline-offset: 0; }
.search-form button, .shortcut, .catalog-tabs button, .theme-toggle, .float-tools button, .ys-preview-replay {
  transition: background-color 180ms, border-color 180ms, box-shadow 180ms, transform 150ms;
}
button:active, a.eco-card:active { transform: scale(.98); }
.save:active { transform: scale(.85); }
html.ys-theme-transition body, html.ys-theme-transition .resource-card,
html.ys-theme-transition .eco-card, html.ys-theme-transition .sponsor-card,
html.ys-theme-transition .sidebar, html.ys-theme-transition .topbar,
html.ys-theme-transition .personal, html.ys-theme-transition .latest-box,
html.ys-theme-transition .footer, html.ys-theme-transition .search-form {
  transition: background-color 300ms, color 250ms, border-color 250ms, box-shadow 250ms;
}
.ys-theme-wash { position: fixed; inset: 0; pointer-events: none; z-index: 70; background: var(--ambient-base); }
.ys-save-ring { position: fixed; width: 25px; height: 25px; border: 1px solid #d1a547; border-radius: 50%; pointer-events: none; z-index: 40; }
@keyframes ys-outline { to { stroke-dashoffset: 0; opacity: 0; } }
@keyframes ys-materialize { from { opacity: 0; transform: scale(.9) translateY(5px); } to { opacity: 1; transform: none; } }
@keyframes ys-gold-sweep { to { transform: translateX(140px) skewX(-20deg); } }
@media (hover: hover) and (pointer: fine) {
  .resource-card:hover, .eco-card:hover, .sponsor-card:hover {
    transform: translateY(-3px); border-color: #bba16f80;
    box-shadow: 0 8px 20px #38517c10, inset 0 1px 0 #ffffff25;
  }
  .save:hover { transform: scale(1.2); color: #cf9b33; }
  .shortcut:hover, .ys-preview-replay:hover { box-shadow: inset 0 0 0 1px #c3a46565; }
}
@media (max-width: 520px) {
  .ys-intro-orbit { width: 230px; height: 230px; top: -63px; }
  .ys-preview-replay { right: 8px; bottom: 96px; padding: 7px 9px; font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  html.ys-intro-active .ys-intro, .ys-intro-flight, .ys-save-ring, .ys-theme-wash { display: none; }
  .ys-intro *, .ys-preview-replay, .resource-card, .eco-card, .sponsor-card { animation: none !important; transition: none !important; transform: none !important; }
}
@media (forced-colors: active) { .ys-intro { display: none !important; } }

/* directory-operations */
.ops-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 12px; }
.ops-heading h2 { margin:0; font-size:15px; font-weight:650; }
.ops-heading p { margin:4px 0 0; font-size:10px; color:var(--sub); }
.ops-heading button { font-size:11px; color:var(--blue); white-space:nowrap; }
.ops-topics { margin:0 0 22px; }
.recommend-head .tabs { flex-wrap:wrap; row-gap:9px; }
.ops-maintenance-strip { display:flex; justify-content:space-between; gap:12px; margin:-8px 0 20px; padding:0 4px; color:var(--sub); font-size:10px; flex-wrap:wrap; }
.ops-maintenance-strip button { color:var(--blue); font-size:10px; padding:0; }
.ops-topic-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; }
.ops-topic { min-width:0; background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:15px 12px; text-align:left; }
.ops-topic>svg { color:var(--blue); width:20px; height:20px; margin-bottom:9px; }
.ops-topic:nth-child(1)>svg { color:#b39a59; }.ops-topic:nth-child(2)>svg { color:#b98097; }.ops-topic:nth-child(5)>svg { color:#9682ba; }
.ops-topic strong { display:block; font-size:12px; font-weight:600; margin-bottom:5px; }
.ops-topic small { display:block; font-size:9px; color:var(--sub); line-height:1.8; }
.ops-topic:hover, .ops-topic[aria-pressed=true] { border-color:var(--blue); background:var(--soft); }
.ops-topic-count { display:block; font-size:9px; color:var(--blue); margin-top:10px; }
.ops-toolbar { display:flex; flex-wrap:wrap; gap:7px; align-items:center; padding:12px; border:1px solid var(--line); background:var(--panel); border-radius:7px; margin:0 0 16px; }
.ops-toolbar button { font-size:10px; color:var(--sub); padding:6px 9px; border-radius:4px; }
.ops-toolbar button[aria-pressed=true] { color:var(--blue); background:var(--soft); }
.ops-toolbar label { margin-left:auto; display:flex; gap:7px; align-items:center; color:var(--sub); font-size:10px; }
.ops-toolbar select { font:inherit; color:var(--text); background:var(--panel); border:1px solid var(--line); padding:5px; border-radius:4px; }
.ops-active-topic { margin:0 0 12px; font-size:11px; color:var(--sub); }.ops-active-topic button { color:var(--blue); margin-left:10px; }
.resource-card { min-height:100px; padding-bottom:23px; align-items:flex-start; }
.resource-card>.site-icon { margin-top:3px; }
.ops-card-meta { display:flex; gap:5px; align-items:center; margin-top:7px; overflow:hidden; }
.ops-card-meta span { background:var(--tag); padding:1px 4px; border-radius:3px; font-size:8px; color:var(--sub); white-space:nowrap; }
.ops-card-meta .ops-new { color:#41a789; background:#43a88912; }
.ops-card-detail { position:absolute; bottom:4px; right:7px; z-index:2; font-size:8px; color:var(--sub); padding:2px 4px; }
.ops-card-detail:hover { color:var(--blue); }
.ops-more { padding:5px 0; color:var(--blue)!important; font-size:10px; }
.ops-updates { display:grid; grid-template-columns:1.1fr 1fr; gap:16px; padding:20px; background:var(--panel); border:1px solid var(--line); border-radius:8px; margin:22px 0; }
.ops-update-item { border-bottom:1px solid var(--line); padding:11px 0; display:flex; align-items:flex-start; gap:13px; }
.ops-update-item:last-child { border:0; }
.ops-update-item time { font-size:10px; font-variant-numeric:tabular-nums; color:var(--sub); white-space:nowrap; padding-top:2px; }
.ops-update-item strong { font-size:11px; display:block; font-weight:550; }.ops-update-item small { display:block; font-size:9px; color:var(--sub); margin-top:3px; }
.ops-today { font-size:11px; margin:0 0 12px; color:var(--sub); line-height:1.8; }.ops-today strong { color:var(--text); }
.ops-participate { padding:0 0 0 20px; border-left:1px solid var(--line); }
.ops-participate h2 { font-size:15px; margin:0 0 7px; }.ops-participate p { font-size:10px; color:var(--sub); line-height:1.9; }
.ops-action-row { display:flex; flex-wrap:wrap; gap:8px; margin:17px 0; }
.ops-action-row button { padding:9px 12px; font-size:11px; background:var(--soft); color:var(--blue); border:1px solid var(--line); border-radius:5px; }
.ops-personal-tools { display:flex; flex-wrap:wrap; gap:10px; margin-top:15px; border-top:1px solid var(--line); padding-top:12px; }
.ops-personal-tools button { font-size:10px; color:var(--sub); }.ops-personal-tools button:hover { color:var(--blue); }
.ops-dialog { max-width:520px; width:calc(100% - 32px); max-height:85dvh; overflow:auto; border:1px solid var(--line); background:var(--panel); color:var(--text); border-radius:14px; padding:25px; box-shadow:0 20px 90px #07172b40; }
.ops-dialog::backdrop { background:#0f1b3466; backdrop-filter:blur(5px); }
.ops-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:18px; }
.ops-dialog-header h2 { margin:0; font-size:19px; font-weight:650; }
.ops-dialog-close { padding:4px 9px; color:var(--sub); font-size:20px; }
.ops-dialog p { font-size:12px; color:var(--sub); line-height:1.8; overflow-wrap:anywhere; }
.ops-dialog form { display:flex; flex-direction:column; gap:13px; }
.ops-field { display:flex; flex-direction:column; gap:6px; font-size:12px; }
.ops-field input,.ops-field select,.ops-field textarea { width:100%; font:inherit; color:var(--text); background:var(--hover); border:1px solid var(--line); border-radius:6px; padding:10px 12px; }
.ops-field textarea { min-height:90px; resize:vertical; }.ops-field small { color:var(--sub); font-size:10px; }
.ops-submit { align-self:flex-start; padding:10px 20px; background:var(--blue); color:var(--panel); border-radius:6px; font-size:12px; }
.ops-submit:disabled { opacity:.55; cursor:wait; }
.ops-message { font-size:12px; color:var(--text); line-height:1.8; overflow-wrap:anywhere; }
.ops-error { color:#cb6f69; }.ops-receipt { padding:13px; border:1px solid var(--line); border-radius:7px; background:var(--hover); margin-top:12px; }
.ops-receipt code { display:block; font-size:11px; margin:8px 0; overflow-wrap:anywhere; }.ops-receipt button { color:var(--blue); font-size:11px; }
.ops-preview-note { color:#a7853a!important; font-size:10px!important; }
.ops-detail-info { display:grid; grid-template-columns:80px 1fr; gap:9px; font-size:11px; margin:18px 0; }
.ops-detail-info dt { color:var(--sub); }.ops-detail-info dd { margin:0; overflow-wrap:anywhere; }
.ops-detail-actions { display:flex; gap:12px; align-items:center; margin-top:20px; font-size:12px; }.ops-detail-actions a { background:var(--blue); color:var(--panel); border-radius:6px; padding:9px 15px; }.ops-detail-actions button { color:var(--sub); }
.ops-custom-list { display:flex; flex-direction:column; gap:8px; margin-top:12px; }.ops-custom-row { display:flex; align-items:center; gap:8px; padding:9px; background:var(--hover); border-radius:5px; font-size:11px; }.ops-custom-row strong { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.ops-custom-row button { font-size:10px; color:var(--blue); }
.ops-search-shell { width:min(790px,100%); position:relative; }.ops-search-shell .search-form { width:100%; }
.ops-suggestions { position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:20; border:1px solid var(--line); border-radius:9px; background:var(--panel); box-shadow:0 12px 35px #12203e20; padding:7px; }
.ops-suggestions[hidden] { display:none; }.ops-suggestions button { width:100%; text-align:left; padding:10px; display:flex; justify-content:space-between; align-items:center; gap:10px; border-radius:5px; font-size:12px; }
.ops-suggestions button small { font-size:9px; color:var(--sub); }.ops-suggestions button:hover,.ops-suggestions button[aria-selected=true] { background:var(--soft); color:var(--blue); }
.ops-suggestion-note { padding:5px 10px; color:var(--sub); font-size:9px; }
.ops-topbar-action { color:var(--blue); font-size:11px; padding:0; }
@media(max-width:1250px) { .ops-topic-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:760px) { .ops-updates { grid-template-columns:1fr; }.ops-participate { border-left:0; border-top:1px solid var(--line); padding:17px 0 0; } }
@media(max-width:520px) { .ops-topic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.ops-topic { padding:13px 11px; }.ops-topic strong { font-size:11px; }.ops-toolbar { padding:9px; }.ops-toolbar label { margin:5px 0 0; width:100%; }.ops-updates { padding:16px; }.ops-dialog { padding:20px; }.resource-card { min-height:101px; }.ops-heading p { font-size:9px; }.ops-topbar-action { display:none; } }

/* directory-refinement */
/* YS directory: legibility first, gold reserved for the brand. */
:root {
  --ambient-base:#f4f6f8; --ambient-blue:#91add422; --ambient-lilac:#ffffff00;
  --ambient-gold:#dfc48a22; --ambient-mist:#ffffff80; --ambient-noise:.065;
  --ambient-orbit-opacity:.35; --panel:#ffffffed; --text:#252e3b;
  --sub:#657183; --line:#dfe5eb; --blue:#315ec5; --soft:#eaf0fc;
  --hover:#f3f6fa; --tag:#f1f4f7; --shadow:none;
}
html[data-theme='dark'] {
  --ambient-base:#171c24; --ambient-blue:#627fa326; --ambient-lilac:#ffffff00;
  --ambient-gold:#b8986020; --ambient-mist:#ffffff00; --ambient-noise:.045;
  --ambient-orbit-opacity:.19; --panel:#222a35f5; --text:#edf1f7;
  --sub:#aab5c4; --line:#35404e; --blue:#a1bfff; --soft:#303f59;
  --hover:#2a3441; --tag:#2b3543; --shadow:none;
}
body { font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif; line-height:1.65; }
.sidebar { width:218px; padding:26px 16px 18px; }
.topbar,.main { margin-left:218px; }
.main { padding:0 32px 30px; --ambient-gutter:32px; }
.topbar { height:65px; padding:0 32px; }
.sidebar,.topbar { background:#fbfcfde8; }
html[data-theme='dark'] .sidebar,html[data-theme='dark'] .topbar { background:#1b222ceb; }
.brand { font-size:22px; letter-spacing:-.7px; gap:9px; }
.brand small { font-size:11px; letter-spacing:0; }
.side-label { font-size:11px; margin-top:25px; }
.side-nav { gap:3px; }
.side-nav button { font-size:13px; padding:10px 12px; border-radius:8px; }
.side-nav small { font-size:11px; opacity:1; font-variant-numeric:tabular-nums; }
.side-nav button.active { box-shadow:inset 3px 0 0 var(--blue); }
.side-foot { font-size:11px; }
.toplinks { font-size:13px; gap:26px; height:100%; }
.toplinks a { height:100%; display:flex; align-items:center; position:relative; }
.toplinks a:first-child { color:var(--sub); font-weight:400; }
.toplinks a[aria-current='location'] { color:var(--text); font-weight:600; }
.toplinks a[aria-current='location']::after { content:''; height:2px; background:var(--blue); position:absolute; bottom:0; left:0; right:0; }
.topright { gap:14px; }.theme-toggle { min-height:36px; font-size:12px; border-radius:8px; }
.ops-topbar-action { font-size:12px; min-height:36px; }
.search-zone { padding:28px 0 22px; }
.search-zone h1 { font-size:28px; font-weight:650; letter-spacing:-1px; line-height:1.3; text-shadow:none; }
.search-zone>p { font-size:13px; margin:7px 0 17px; }
.search-context { gap:28px; margin-bottom:11px; }
.search-context button { font-size:13px; padding-bottom:6px; }
.search-form { padding:5px 6px 5px 18px; border-radius:12px; gap:12px; min-height:56px; transition:border-color .15s,box-shadow .15s; }
.search-form:focus-within { border-color:var(--blue); box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 13%,transparent); }
.search-form input { font-size:14px; line-height:1.5; padding:10px 0; }
.search-form>button[type='submit'],.search-form>button:not([type]) { background:#315ec5; font-size:13px; padding:10px 24px; border-radius:8px; }
.search-form .refine-clear { background:none; color:var(--sub); padding:0; width:32px; height:36px; font-size:22px; flex:none; }
.refine-shortcut { font-size:11px; color:var(--sub); border:1px solid var(--line); padding:2px 6px; border-radius:5px; white-space:nowrap; }
.engine-row { font-size:11px; gap:18px; margin-top:10px; }.engine-row button { font-size:11px; padding:3px 0; }
.discovery-shortcuts { border-radius:10px; margin-bottom:24px; }
.shortcut { padding:13px 14px; font-size:13px; }.shortcut small { font-size:11px; }
.section { margin-bottom:26px; }.section-head { margin-bottom:13px; }
.section-head h2,.ops-heading h2 { font-size:17px; letter-spacing:-.3px; }
.section-head h2 small { font-size:11px; }
.section-head>a,.section-head>button,.section-head>span { font-size:12px; min-height:30px; }
.eco-grid { gap:0; background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:4px; }
.eco-grid .eco-card { border:0; border-radius:6px; background:transparent; box-shadow:none; padding:13px 15px; min-height:75px; }
.eco-grid .eco-card:not(:last-child) { border-right:1px solid var(--line); }
.eco-card strong { font-size:14px; margin-bottom:2px; }.eco-card p { font-size:11px; }
.eco-icon { width:38px; height:38px; border-radius:10px; }
.resource-card:hover,.eco-card:hover,.sponsor-card:hover { transform:none; box-shadow:none; }
.eco-grid .eco-card:hover { background:var(--hover); }
.ops-topics { margin-bottom:24px; }
.ops-heading { margin-bottom:12px; }.ops-heading p { font-size:12px; margin-top:3px; }.ops-heading button { font-size:12px; }
.ops-topic-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 22px; }
.ops-topic { display:grid; grid-template-columns:28px 1fr auto; gap:2px 10px; align-items:center; padding:13px 4px; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; }
.ops-topic>svg { grid-row:1/3; margin:0; width:21px; height:21px; color:var(--sub)!important; }
.ops-topic strong { font-size:14px; margin:0; font-weight:600; }
.ops-topic small { grid-column:2/4; font-size:11px; line-height:1.6; }
.ops-topic-count { grid-column:3; grid-row:1; font-size:11px; color:var(--sub); margin:0; }
.ops-topic:hover,.ops-topic[aria-pressed='true'] { background:var(--hover); border-color:var(--blue); }
.ops-topic[aria-pressed='true'] strong { color:var(--blue); }
.sponsor-section { background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:10px 14px; margin-bottom:22px; }
.sponsor-heading { margin-bottom:6px; }.sponsor-heading h2 { font-size:11px; font-weight:500; color:var(--sub); }
.sponsor-grid { gap:0; }.sponsor-card { background:none; border:0; border-radius:0; min-height:49px; padding:5px 14px; gap:10px; }
.sponsor-card:not(:last-child) { border-right:1px solid var(--line); }.sponsor-placeholder { background:none; }
.sponsor-symbol { width:26px; height:26px; background:var(--hover); }.sponsor-symbol svg { width:16px; height:16px; }
.sponsor-card strong { font-size:12px; font-weight:500; }.sponsor-card p { font-size:11px; margin-top:1px; }
.sponsor-card>.ad-label { position:static; align-self:flex-start; font-size:10px; white-space:nowrap; margin-left:auto; }
.sponsor-card>div { padding-right:0; }.ad-label { font-size:10px; }
.latest-box { border-radius:8px; padding:13px 16px; grid-template-columns:102px 1fr 36px; }
.latest-label strong { font-size:14px; }.latest-label small,.ticker-item small { font-size:11px; }
.ticker-item strong { font-size:13px; }.ticker-item { width:220px; }.ticker-control { width:34px; height:34px; }
.ops-maintenance-strip,.ops-maintenance-strip button { font-size:11px; }
.personal { padding:17px 18px; border-radius:10px; }.personal-head { flex-wrap:wrap; }
.tabs button { font-size:13px; padding:5px 0; position:relative; }.tabs button.active::after { content:''; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--blue); }
.personal-note { font-size:11px; }.quick-link { font-size:12px; min-height:32px; gap:8px; }.quick-grid { gap:8px 14px; }
.ops-personal-tools { gap:18px; padding-top:9px; margin-top:14px; }.ops-personal-tools button { min-height:30px; font-size:11px; }
.group-grid,.recommend-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.recommend-grid>.resource-card:nth-child(n+9) { display:none; }
.resource-card { min-height:112px; border-radius:9px; box-shadow:none!important; gap:11px; padding:17px 14px 28px; transition:background-color .15s,border-color .15s; }
.resource-card:hover { background:var(--hover); border-color:var(--line); }
.resource-card:focus-within { border-color:var(--blue); }
.resource-card>.site-icon { width:31px; height:31px; margin-top:1px; }
.resource-copy { padding-right:12px; }.resource-copy a { font-size:13px; font-weight:600; line-height:1.5; }
.resource-copy p { font-size:11px; margin-top:5px; line-height:1.6; }
.ops-card-meta { margin-top:8px; gap:8px; }.ops-card-meta span { font-size:10px; background:none; padding:0; }
.ops-card-meta span+span::before { content:''; display:inline-block; width:1px; height:8px; margin-right:8px; background:var(--line); }
.save { top:3px; right:3px; width:32px; height:32px; font-size:16px; border-radius:7px; color:var(--sub); }
.save:hover,.ops-card-detail:hover { background:var(--soft); color:var(--blue); }
.ops-card-detail { bottom:3px; right:6px; font-size:10px; padding:3px 8px; min-height:28px; border-radius:5px; }
.catalog-tabs { gap:8px; margin-bottom:14px; }.catalog-tabs button { font-size:12px; padding:7px 12px; border-radius:7px; }
.ops-toolbar { background:none; border:0; border-bottom:1px solid var(--line); border-radius:0; padding:0 0 13px; gap:6px; margin-bottom:12px; }
.ops-toolbar button { font-size:12px; padding:7px 10px; border-radius:6px; }.ops-toolbar label { font-size:11px; }.ops-toolbar select { padding:7px; border-radius:6px; }
.ops-active-topic,.result-line { font-size:12px; margin-bottom:16px; }
.groups { gap:28px; }.group-title h3 { font-size:16px; }.group-title small { font-size:11px; }.group-sub button,.group-sub a,.ops-more { font-size:11px; }
.ops-more { margin-top:7px; min-height:30px; }.empty { font-size:13px; padding:30px 20px; }
.ops-updates { padding:24px; border-radius:10px; gap:24px; }
.ops-update-item strong,.ops-today { font-size:13px; }.ops-update-item time,.ops-update-item small { font-size:11px; }
.ops-participate h2 { font-size:17px; }.ops-participate p { font-size:12px; }.ops-action-row button { font-size:12px; }
.footer { border:0; border-top:1px solid var(--line); border-radius:0; background:none; box-shadow:none; padding:22px 0; }
.footer p,.footer-links,.footer-bottom,.bottom-tools button,.sync-note { font-size:11px; }
.float-tools button { width:38px; height:38px; border-radius:9px; }
.ops-dialog { border-radius:16px; padding:28px; }
.ops-dialog-header h2 { font-size:22px; letter-spacing:-.4px; }.ops-dialog-close { width:36px; height:36px; padding:0; border-radius:8px; background:var(--hover); }
.ops-dialog p,.ops-field,.ops-message,.ops-detail-info,.ops-detail-actions { font-size:13px; }
.ops-field input,.ops-field textarea,.ops-field select { min-height:44px; background:var(--panel); border-radius:8px; }
.ops-field small { font-size:11px; }.ops-submit { background:#315ec5; color:#fff; font-size:13px; min-height:42px; border-radius:8px; }
.ops-detail-actions a { background:#315ec5; color:#fff; }.ops-custom-row { font-size:13px; padding:10px; }.ops-custom-row button { font-size:12px; min-height:34px; }
.ops-suggestions { border-radius:12px; padding:6px; }.ops-suggestions button { font-size:14px; min-height:44px; }.ops-suggestions button small,.ops-suggestion-note { font-size:11px; }
.refine-menu-shade { display:none; }
button:disabled { opacity:.5; cursor:default; }
button:active:not(:disabled) { filter:brightness(.95); }
:where(button,a,input,select,textarea):focus-visible { outline:2px solid var(--blue); outline-offset:3px; }
.search-form input:focus-visible { outline:none; }
[hidden] { display:none!important; }
@media(min-width:1500px) { .group-grid,.recommend-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }.recommend-grid>.resource-card:nth-child(n+9) { display:flex; } }
@media(max-width:1100px) {
  .sidebar { width:190px; padding-inline:12px; }.topbar,.main { margin-left:190px; }.main { padding-inline:24px; --ambient-gutter:24px; }.topbar { padding-inline:24px; }
  .group-grid,.recommend-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.recommend-grid>.resource-card:nth-child(n+7) { display:none; }
  .eco-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.eco-grid .eco-card:nth-child(2) { border-right:0; }.eco-grid .eco-card:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .ops-topic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.toplinks { gap:20px; }.ops-topic-count { font-size:10px; }
}
@media(max-width:760px) {
  .sidebar { display:none; }.main,.topbar { margin-left:0; }.main { padding-inline:20px; --ambient-gutter:20px; }.topbar { padding:0 16px; height:60px; }
  .mobile-logo { font-size:19px; }.toplinks { display:none; }.theme-toggle { min-height:38px; }.mobile-menu { width:40px; height:40px; }
  .search-zone { padding-top:24px; }.search-zone h1 { font-size:27px; }
  .discovery-shortcuts { grid-template-columns:repeat(4,minmax(0,1fr)); }.shortcut { padding:12px 10px; gap:7px; }
  .refine-menu-shade { position:fixed; inset:60px 0 0; background:#10172280; z-index:9; }
  .side-open .refine-menu-shade { display:block; }.side-open .sidebar { display:flex; top:60px; background:var(--panel); width:260px; padding:24px 18px; }
  body.side-open { overflow:hidden; }.side-open .main { pointer-events:none; }
  .sponsor-grid { grid-template-columns:1fr; }.sponsor-card:not(:last-child) { border-right:0; border-bottom:1px solid var(--line); }.sponsor-card { min-height:54px; padding:9px 0; }
  .personal-note { width:100%; }.ops-updates { grid-template-columns:1fr; }.ops-participate { padding:20px 0 0; border-left:0; border-top:1px solid var(--line); }
}
@media(max-width:520px) {
  .main { padding:0 16px 24px; --ambient-gutter:16px; }.topright { gap:4px; }.topright>.ops-topbar-action { display:none; }.theme-toggle { font-size:11px; padding:8px; }
  .search-zone h1 { font-size:25px; }.search-zone>p { font-size:12px; }.search-context { gap:19px; }.search-context button { font-size:12px; }
  .search-form { gap:7px; padding-left:12px; }.search-form input { font-size:13px; }.search-form>button[type='submit'],.search-form>button:not([type]) { padding:10px 16px; }
  .refine-shortcut { display:none; }.search-form .refine-clear { width:24px; }.engine-row { font-size:10px; gap:13px; }.engine-row button { font-size:11px; }
  .discovery-shortcuts { grid-template-columns:repeat(3,minmax(0,1fr)); }.shortcut { font-size:11px; padding:12px 9px; }.shortcut small { font-size:10px; }
  .eco-card strong { font-size:13px; }.eco-card p { font-size:11px; }.eco-grid .eco-card { padding:13px 10px; gap:9px; }.eco-icon { width:32px; height:32px; }
  .ops-topic-grid { gap:0 14px; }.ops-topic { grid-template-columns:24px 1fr; padding:13px 2px; gap:2px 6px; }.ops-topic strong { font-size:13px; }.ops-topic small { grid-column:2; font-size:10px; }.ops-topic-count { grid-column:2; grid-row:3; font-size:10px; }.ops-topic>svg { grid-row:1/4; width:18px; height:18px; }
  .ops-heading p { font-size:11px; }.section-head h2,.ops-heading h2 { font-size:16px; }.latest-box { grid-template-columns:82px 1fr 34px; padding:11px; gap:7px; }.latest-label strong { font-size:12px; }.latest-label small { font-size:10px; }
  .group-grid,.recommend-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.resource-card { padding:14px 10px 34px; min-height:142px; gap:8px; flex-wrap:wrap; align-content:flex-start; }.resource-card>.site-icon { width:27px; height:27px; margin:0; }
  .resource-copy { flex-basis:100%; padding-right:0; }.resource-copy a { font-size:13px; }.resource-copy p { font-size:11px; }.ops-card-meta { margin-top:5px; gap:6px; }.ops-card-meta span { font-size:9px; }.ops-card-meta span+span::before { margin-right:6px; }
  .save { width:36px; height:36px; }.ops-card-detail { font-size:11px; min-height:32px; bottom:1px; }
  .catalog-tabs button { font-size:11px; padding:7px 10px; }.ops-toolbar { padding:0 0 13px; }.ops-toolbar button { font-size:11px; padding:7px 8px; }.ops-toolbar label { width:auto; margin-left:auto; }
  .personal { padding:15px 12px; }.personal-head .tabs { gap:15px; }.tabs button { font-size:12px; }.quick-link { font-size:11px; }.ops-personal-tools { gap:9px; }.ops-personal-tools button { font-size:11px; }
  .recommend-head .tabs { gap:17px; row-gap:3px; }.recommend-head .tabs button { font-size:12px; }.recommend-head h2 { margin-bottom:6px; }
  .ops-updates { padding:18px; }.ops-participate .ops-topbar-action { display:inline-block; }.ops-dialog { padding:22px; max-height:88dvh; }.ops-field input,.ops-field select,.ops-field textarea { font-size:16px; }
  .footer-links { font-size:12px; }.footer { padding-bottom:60px; }.group-sub a { font-size:10px; }.group-title h3 { font-size:15px; }.group-title small { font-size:10px; }
}
@media(prefers-reduced-motion:reduce) { .search-form,.resource-card { transition:none; } }

/* directory-findability */
/* Second-level tags, empty-search help and resource profiles. Uses the directory's theme tokens. */
.fd-subtags { display:flex; flex-wrap:wrap; gap:8px; padding:2px 0 12px; margin:0 0 4px; }
.fd-subtags[hidden] { display:none; }
.fd-subtags button { flex:none; display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border:1px solid var(--line); border-radius:999px; background:var(--panel); color:var(--text); font-size:12px; line-height:1.2; white-space:nowrap; }
.fd-subtags button small { color:var(--sub); font-size:11px; }
.fd-subtags button:hover { border-color:var(--blue); }
.fd-subtags button[aria-pressed=true] { background:var(--blue); border-color:var(--blue); color:#fff; }
.fd-subtags button[aria-pressed=true] small { color:rgba(255,255,255,.8); }
.ops-card-meta .fd-tag { color:var(--blue); }

.empty .fd-empty { text-align:left; margin:0; }
.fd-empty strong { display:block; font-size:15px; color:var(--text); margin-bottom:4px; }
.fd-empty p { margin:0 0 10px; color:var(--sub); }
.fd-chips { display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 4px; }
.fd-chips button { padding:6px 12px; border:1px solid var(--line); border-radius:999px; background:var(--panel); color:var(--text); font-size:12px; }
.fd-chips button:hover { border-color:var(--blue); color:var(--blue); }
.fd-empty-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; align-items:center; }
.fd-empty-actions button, .fd-empty-actions a { padding:8px 14px; border-radius:8px; border:1px solid var(--line); background:var(--panel); color:var(--text); font-size:12px; }
.fd-empty-actions .fd-primary { background:var(--blue); border-color:var(--blue); color:#fff; font-weight:600; }

.fd-profile h3 { font-size:13px; margin:14px 0 6px; }
.fd-profile ul { margin:0 0 6px; padding-left:18px; }
.fd-profile li { margin:2px 0; }
.fd-profile dd small { display:block; color:var(--sub); font-size:11px; margin-top:2px; }
.fd-profile dd small a { color:var(--blue); }
.ops-detail-actions .ops-detail-page { border:1px solid var(--line); background:var(--panel); color:var(--text); }

/* Footer mixes links and buttons; align them on one baseline row that wraps evenly. */
.footer-links { flex-wrap:wrap; align-items:center; row-gap:8px; justify-content:flex-end; }
.footer-links a, .footer-links button { display:inline-flex; align-items:center; line-height:1.6; padding:0; font:inherit; color:inherit; background:none; border:0; }
.footer-links .fd-footer { display:contents; }

@media (max-width:600px) {
  .fd-subtags { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; margin-inline:-2px; padding-bottom:10px; }
  .fd-subtags::-webkit-scrollbar { display:none; }
  .footer-links { justify-content:flex-start; }
  .fd-subtags button { padding:7px 11px; }
  .fd-empty-actions button, .fd-empty-actions a { flex:1 1 auto; text-align:center; }
}

/* ys-home-polish */
/* Visual polish for the directory homepage, matching the opening overlay.
   Appearance only: no layout structure, markup or behaviour changes. Loaded last. */

/* ---------- atmosphere ---------- */
html[data-theme=dark] body{
  background:
    radial-gradient(1100px 620px at 12% -12%,rgba(59,91,255,.20),transparent 62%),
    radial-gradient(900px 560px at 100% 4%,rgba(168,85,247,.15),transparent 62%),
    radial-gradient(900px 700px at 55% 115%,rgba(34,211,238,.09),transparent 60%),
    #11141b;
  background-attachment:fixed;
}
html[data-theme=light] body{
  background:
    radial-gradient(1100px 620px at 12% -12%,rgba(57,120,237,.10),transparent 62%),
    radial-gradient(900px 560px at 100% 4%,rgba(168,85,247,.07),transparent 62%),
    var(--bg);
  background-attachment:fixed;
}
html[data-theme=dark] .topbar{background:rgba(22,25,33,.72);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3)}
html[data-theme=light] .topbar{background:rgba(255,255,255,.78);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3)}

/* ---------- headline + search ---------- */
html .search-zone h1{
  background:linear-gradient(100deg,var(--text) 0%,var(--text) 38%,#7aa2ff 62%,#c084fc 82%,#f0abfc 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
}
html .search-form{
  border-color:color-mix(in srgb,var(--blue) 28%,var(--line));
  box-shadow:0 0 0 1px color-mix(in srgb,var(--blue) 10%,transparent),0 18px 48px -22px rgba(76,110,245,.55);
}
html[data-theme=dark] .search-form{background:rgba(34,38,48,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
html .search-form:focus-within{
  border-color:var(--blue);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 18%,transparent),0 22px 56px -20px rgba(76,110,245,.7);
}
html .search-form button{
  background:linear-gradient(135deg,#4f7dff,#8b5cf6);font-weight:600;border-radius:9px;
  box-shadow:0 8px 20px -8px rgba(99,102,241,.75);transition:transform .2s,box-shadow .2s,filter .2s;
}
html .search-form button:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 12px 26px -8px rgba(99,102,241,.85)}

/* ---------- category shortcuts: coloured icon chips ---------- */
html .shortcut{transition:background .2s,transform .2s}
html .shortcut svg{box-sizing:content-box;padding:6px;border-radius:9px;color:var(--c,#6d8cff);background:color-mix(in srgb,var(--c,#6d8cff) 15%,transparent);opacity:1}
html .shortcut:hover svg{background:var(--c,#6d8cff);color:#fff}
html .shortcut:nth-child(1){--c:#7c8cff}html .shortcut:nth-child(2){--c:#f59e0b}html .shortcut:nth-child(3){--c:#ec4899}
html .shortcut:nth-child(4){--c:#10b981}html .shortcut:nth-child(5){--c:#3b82f6}html .shortcut:nth-child(6){--c:#8b5cf6}
html .shortcut:nth-child(7){--c:#ef4444}html .shortcut:nth-child(8){--c:#06b6d4}html .shortcut:nth-child(9){--c:#a16207}
html .shortcut:nth-child(10){--c:#0ea5e9}html .shortcut:nth-child(11){--c:#f97316}html .shortcut:nth-child(12){--c:#d946ef}

/* ---------- YS ecosystem: same vivid cards as the opening ---------- */
html .eco-card{
  position:relative;overflow:hidden;isolation:isolate;border:0;border-radius:14px;color:#fff;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),0 16px 36px -20px var(--glow);
  transition:transform .25s,box-shadow .25s;
}
html .eco-card::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.9;
  -webkit-mask-image:linear-gradient(100deg,transparent 20%,#000 80%);mask-image:linear-gradient(100deg,transparent 20%,#000 80%)}
html .eco-card::after{content:"";position:absolute;top:-30%;bottom:-30%;left:0;width:35%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.2),transparent);transform:translateX(-200%) skewX(-12deg);animation:ysh-sheen 8s ease-in-out infinite}
html .eco-card:nth-child(2)::after{animation-delay:-2s}html .eco-card:nth-child(3)::after{animation-delay:-4s}html .eco-card:nth-child(4)::after{animation-delay:-6s}
@keyframes ysh-sheen{0%,65%{transform:translateX(-200%) skewX(-12deg)}100%{transform:translateX(420%) skewX(-12deg)}}
html .eco-card:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),0 22px 44px -18px var(--glow)}
html .eco-card strong{color:#fff}
html .eco-card p{color:rgba(255,255,255,.72)}
html .eco-card>svg{color:#fff;opacity:.85;box-sizing:content-box;padding:6px;border-radius:50%;background:rgba(255,255,255,.14)}
html .eco-card .eco-icon{color:#fff!important;background:rgba(255,255,255,.16)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);backdrop-filter:blur(4px)}
html .eco-card:nth-child(1){--glow:#3b82f6;background:radial-gradient(90% 140% at 0% 0%,rgba(34,211,238,.65),transparent 55%),radial-gradient(80% 140% at 100% 30%,#3b5bff,transparent 65%),linear-gradient(135deg,#10226a,#0a1440)}
html .eco-card:nth-child(1)::before{background:repeating-linear-gradient(0deg,rgba(255,255,255,.08) 0 1px,transparent 1px 10px)}
html .eco-card:nth-child(2){--glow:#d946ef;background:radial-gradient(80% 160% at 100% 0%,rgba(217,70,239,.85),transparent 60%),radial-gradient(70% 140% at 0% 100%,rgba(244,63,94,.5),transparent 60%),linear-gradient(135deg,#3a0f4f,#1a0824)}
html .eco-card:nth-child(2)::before{background:repeating-linear-gradient(90deg,rgba(255,255,255,.22) 0 7px,transparent 7px 15px) 0 6px/100% 4px no-repeat,repeating-linear-gradient(90deg,rgba(255,255,255,.22) 0 7px,transparent 7px 15px) 0 calc(100% - 6px)/100% 4px no-repeat}
html .eco-card:nth-child(3){--glow:#14b8a6;background:radial-gradient(80% 160% at 100% 0%,rgba(20,184,166,.85),transparent 60%),radial-gradient(70% 140% at 0% 100%,rgba(34,211,238,.45),transparent 60%),linear-gradient(135deg,#0a3b36,#04201d)}
html .eco-card:nth-child(3)::before{background:repeating-linear-gradient(0deg,rgba(255,255,255,.07) 0 2px,transparent 2px 5px)}
html .eco-card:nth-child(4){--glow:#ec4899;background:radial-gradient(70% 160% at 90% 0%,rgba(236,72,153,.8),transparent 60%),radial-gradient(70% 160% at 30% 100%,rgba(168,85,247,.75),transparent 60%),linear-gradient(135deg,#25103f,#2a0a24)}
html .eco-card:nth-child(4)::before{background:radial-gradient(rgba(255,255,255,.25) 1px,transparent 1.6px) 0 0/14px 14px}
html .eco-grid{gap:12px;border:0;background:none}

/* ---------- topics, cards, quick links ---------- */
html .ops-topic,html .resource-card,html .quick-link,html .sponsor-card{transition:transform .2s,border-color .2s,box-shadow .2s}
html .ops-topic:hover,html .resource-card:hover{
  transform:translateY(-2px);border-color:color-mix(in srgb,var(--blue) 55%,var(--line));
  box-shadow:0 14px 32px -18px rgba(76,110,245,.6);
}
/* Topic icon chip: the icon column is widened to fit the chip, and the chip aligns with the title. */
html .ops-topic{grid-template-columns:36px 1fr auto}
html .ops-topic>svg{box-sizing:border-box;width:34px;height:34px;padding:8px;border-radius:10px;align-self:center;
  background:color-mix(in srgb,currentColor 14%,transparent)}
@media(max-width:520px){
  html .ops-topic{grid-template-columns:30px 1fr;gap:2px 10px}
  html .ops-topic>svg{width:30px;height:30px;padding:7px;border-radius:9px;align-self:start;margin-top:-4px}
}
html .resource-card .site-icon{box-shadow:0 4px 12px -6px rgba(0,0,0,.4)}
html .section-head h2,html .ops-heading h2{letter-spacing:-.3px}

@media(max-width:700px){
  html[data-theme] body{background-attachment:scroll}
  html[data-theme=dark] .search-form{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--panel)}
  html .eco-grid{gap:10px}
  html .eco-card{border-radius:12px}
  html .shortcut svg{width:14px;height:14px;padding:4px;border-radius:7px}
  html .shortcut{gap:6px}
  html .shortcut span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
}
@media(max-width:420px){
  html .shortcut svg{padding:0;background:none;width:15px;height:15px}
  html .shortcut:hover svg{background:none;color:var(--c)}
}
@media(prefers-reduced-motion:reduce){
  html .eco-card::after{animation:none;display:none}
  html .ops-topic:hover,html .resource-card:hover,html .eco-card:hover,html .search-form button:hover{transform:none}
}
@media(forced-colors:active){
  html .search-zone h1{-webkit-text-fill-color:currentColor;background:none}
  html .eco-card{background:Canvas;color:CanvasText}
}

/* Claude UI pass 2026-11-02 */
/* The sidebar already carries 首页/生态/最新/收藏 on desktop; the duplicate top links are dropped there (they were already hidden below 980px). */
@media (min-width:981px){.toplinks{display:none}}
/* With the sidebar open, six category tiles per row wrapped their labels ("AI导/航"); four per row until there is room. */
@media (min-width:981px) and (max-width:1250px){.discovery-shortcuts{grid-template-columns:repeat(4,minmax(0,1fr))}}
.shortcut span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.shortcut small{flex:none}
/* 常用导航 now follows the category grid directly. */
.discovery-shortcuts+.personal{margin-top:0}

/* ys-opening */
/* YS opening overlay. Shown once per browsing session above the existing homepage.
   Everything is scoped under #ys-opening so the directory styles are untouched. */
html.ys-opening-active,html.ys-opening-active body{overflow:hidden!important}
html.ys-opening-active:not(.ys-opening-mounted) body::after{content:"";position:fixed;inset:0;z-index:2147483000;background:#05060a}

#ys-opening{
  --yo-bg:#05060a;--yo-fg:#eef1ff;--yo-muted:#8a90a8;--yo-line:rgba(255,255,255,.08);
  --yo-a:#5b8cff;--yo-b:#a855f7;--yo-c:#22d3ee;--yo-d:#f472b6;
  position:fixed;inset:0;z-index:2147483001;overflow:hidden;
  background:var(--yo-bg);color:var(--yo-fg);color-scheme:dark;
  font:16px/1.5 "PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",system-ui,-apple-system,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;text-align:left;
  transition:opacity .7s cubic-bezier(.2,.9,.2,1),transform .7s cubic-bezier(.2,.9,.2,1),filter .7s;
}
#ys-opening.yo-leaving{opacity:0;transform:scale(1.06);filter:blur(10px);pointer-events:none}
#ys-opening *,#ys-opening *::before,#ys-opening *::after{box-sizing:border-box;margin:0;padding:0}
#ys-opening a,#ys-opening button{color:inherit;text-decoration:none;font:inherit;background:none;border:0;cursor:pointer}
#ys-opening :focus-visible{outline:2px solid var(--yo-c);outline-offset:4px}
#ys-opening .yo-num{font-family:"SF Pro Display","Segoe UI","Helvetica Neue",Arial,sans-serif}

/* layered background: drifting aurora, perspective floor, vignette (beneath the particle canvas) */
#ys-opening .yo-aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none;filter:hue-rotate(var(--yo-hue,0deg));transition:filter .6s linear}
#ys-opening .yo-aurora i{position:absolute;border-radius:50%;filter:blur(90px);mix-blend-mode:screen;animation:yo-drift 20s ease-in-out infinite alternate}
#ys-opening .yo-aurora i:nth-child(1){width:62vmax;height:62vmax;top:-28vmax;left:-20vmax;background:radial-gradient(circle,#2f52ff 0%,rgba(47,82,255,0) 68%);opacity:1}
#ys-opening .yo-aurora i:nth-child(2){width:56vmax;height:56vmax;bottom:-26vmax;right:-18vmax;background:radial-gradient(circle,#9b3cff 0%,rgba(155,60,255,0) 68%);opacity:.95;animation-delay:-7s}
#ys-opening .yo-aurora i:nth-child(3){width:40vmax;height:40vmax;top:30%;left:45%;background:radial-gradient(circle,#13c8e6 0%,rgba(19,200,230,0) 68%);opacity:.6;animation-delay:-13s;animation-duration:26s}
#ys-opening .yo-aurora i:nth-child(4){width:34vmax;height:34vmax;top:55%;left:-12vmax;background:radial-gradient(circle,#ec4899 0%,rgba(236,72,153,0) 68%);opacity:.55;animation-delay:-4s;animation-duration:23s}
@keyframes yo-drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(9vw,7vh) scale(1.18)}100%{transform:translate(-7vw,-5vh) scale(.92)}}
#ys-opening .yo-floor{position:absolute;left:-50%;right:-50%;bottom:-6vh;height:52vh;pointer-events:none;opacity:var(--yo-floor,1);
  background-image:linear-gradient(rgba(140,170,255,.42) 1px,transparent 1px),linear-gradient(90deg,rgba(140,170,255,.42) 1px,transparent 1px);
  background-size:64px 64px;transform:perspective(420px) rotateX(64deg);transform-origin:50% 100%;
  -webkit-mask-image:linear-gradient(transparent 0%,#000 55%);mask-image:linear-gradient(transparent 0%,#000 55%);animation:yo-floor 5s linear infinite}
@keyframes yo-floor{to{background-position:0 64px}}
#ys-opening .yo-vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 50%,rgba(5,6,10,.5) 100%)}
#ys-opening .yo-gl{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#ys-opening .yo-grain{position:absolute;inset:-50%;pointer-events:none;opacity:.06;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:yo-grain 1s steps(6) infinite}
@keyframes yo-grain{to{transform:translate(-10%,8%)}}
#ys-opening .yo-glow{position:absolute;left:50%;top:40%;width:600px;height:600px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(91,140,255,.18),transparent 60%);transform:translate(-50%,-50%)}
#ys-opening .yo-main{position:relative;z-index:2}
#ys-opening section{min-height:100vh;min-height:100svh;padding:120px 6vw;display:flex;flex-direction:column;justify-content:center;position:relative}

/* top bar */
#ys-opening .yo-nav{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 6vw;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:linear-gradient(rgba(5,6,10,.75),rgba(5,6,10,0));margin-bottom:-76px}
#ys-opening .yo-logo{font-weight:800;font-size:19px;letter-spacing:.04em;display:flex;align-items:center;gap:10px}
#ys-opening .yo-logo img{width:30px;height:30px;filter:drop-shadow(0 4px 12px rgba(230,180,60,.35))}
#ys-opening .yo-actions{display:flex;align-items:center;gap:8px}
#ys-opening .yo-skip{font-size:13px;color:var(--yo-muted);padding:10px 12px;border-radius:999px;transition:color .3s}
#ys-opening .yo-skip:hover{color:#fff}
#ys-opening .yo-btn{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:999px;border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.06);font-size:14px;font-weight:600;transition:background .3s,color .3s}
#ys-opening .yo-btn:hover{background:#fff;color:#000}
@property --yo-ang{syntax:"<angle>";initial-value:0deg;inherits:false}
#ys-opening .yo-big{position:relative;isolation:isolate;display:inline-flex;align-items:center;gap:12px;padding:20px 44px;border-radius:999px;
  background:#fff;color:#05060a;font-size:19px;font-weight:800;letter-spacing:.04em;transition:transform .3s}
#ys-opening .yo-big:hover{transform:scale(1.04)}
#ys-opening .yo-big::before{content:"";position:absolute;inset:-4px;border-radius:999px;z-index:-1;
  background:conic-gradient(from var(--yo-ang),var(--yo-a),var(--yo-b),var(--yo-d),var(--yo-c),var(--yo-a));filter:blur(16px);animation:yo-ang 4s linear infinite}
@keyframes yo-ang{to{--yo-ang:360deg}}
#ys-opening .yo-arrow{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#05060a;color:#fff;flex:none;
  box-shadow:0 4px 14px rgba(91,140,255,.35);transition:transform .3s,background .3s}
#ys-opening .yo-arrow svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
#ys-opening .yo-arrow-sm{width:24px;height:24px;background:#fff;color:#05060a;box-shadow:none;margin-right:-8px}
#ys-opening .yo-arrow-sm svg{width:14px;height:14px;stroke-width:3}
#ys-opening .yo-btn:hover .yo-arrow-sm{background:#05060a;color:#fff}
#ys-opening .yo-big{padding:16px 16px 16px 40px}
#ys-opening .yo-big:hover .yo-arrow{transform:translateX(4px)}

/* hero */
#ys-opening .yo-hero{align-items:center;text-align:center}
#ys-opening .yo-scroller{position:absolute;inset:0;z-index:2;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
#ys-opening .yo-halo{position:absolute;left:0;top:0;border-radius:50%;pointer-events:none;will-change:transform,opacity}
#ys-opening .yo-halo::before{content:"";position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(rgba(91,140,255,0),rgba(91,140,255,.6),rgba(168,85,247,.6),rgba(244,114,182,.55),rgba(34,211,238,.55),rgba(91,140,255,0));
  -webkit-mask:radial-gradient(circle closest-side,transparent 68%,#000 73%,#000 78%,transparent 84%);mask:radial-gradient(circle closest-side,transparent 68%,#000 73%,#000 78%,transparent 84%);
  filter:blur(14px);animation:yo-spin 14s linear infinite;will-change:transform}
@keyframes yo-spin{to{transform:rotate(360deg)}}
#ys-opening .yo-eyebrow{font-size:12px;letter-spacing:.4em;color:var(--yo-c);margin-bottom:28px;opacity:0;animation:yo-up 1s .3s forwards}
#ys-opening h1{font-size:clamp(46px,10vw,150px);font-weight:900;line-height:1.04;letter-spacing:-.03em}
#ys-opening h1 .yo-l{display:block;overflow:hidden;padding-bottom:.04em}
#ys-opening h1 .yo-l>span{display:inline-block;transform:translateY(110%);animation:yo-rise 1.2s cubic-bezier(.2,.9,.2,1) forwards}
#ys-opening h1 .yo-l:nth-child(2)>span{animation-delay:.15s}
/* Hang trailing full-width punctuation so each line centres on its characters. */
/* Each line ends in a full-width mark; an equal lead-in keeps the characters themselves centred. */
#ys-opening h1 .yo-l>span{white-space:nowrap;padding-left:1em}
#ys-opening .yo-grad{background:linear-gradient(100deg,var(--yo-a),var(--yo-b) 40%,var(--yo-d) 70%,var(--yo-c));background-size:200% auto;
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
#ys-opening h1 .yo-grad{animation:yo-rise 1.2s .15s cubic-bezier(.2,.9,.2,1) forwards,yo-shine 6s linear infinite}
#ys-opening .yo-shine{animation:yo-shine 6s linear infinite}
@keyframes yo-shine{to{background-position:200% center}}
@keyframes yo-rise{to{transform:none}}
@keyframes yo-up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
#ys-opening .yo-sub{margin-top:30px;font-size:clamp(15px,1.6vw,21px);color:var(--yo-muted);font-weight:300;opacity:0;animation:yo-up 1s .8s forwards}
#ys-opening .yo-search{margin:44px auto 0;width:min(640px,100%);display:flex;align-items:center;gap:12px;padding:10px 10px 10px 24px;border-radius:999px;
  background:rgba(255,255,255,.05);border:1px solid var(--yo-line);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  opacity:0;animation:yo-up 1s 1s forwards;box-shadow:0 0 0 1px rgba(91,140,255,.15),0 30px 80px -20px rgba(91,140,255,.4)}
#ys-opening .yo-ph{flex:1;min-width:0;text-align:left;color:var(--yo-muted);font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:clip}
#ys-opening .yo-ph b{color:var(--yo-fg);font-weight:500}
#ys-opening .yo-ph::after{content:"";display:inline-block;width:2px;height:1em;background:var(--yo-c);vertical-align:-2px;margin-left:2px;animation:yo-blink 1s steps(1) infinite}
@keyframes yo-blink{50%{opacity:0}}
#ys-opening .yo-kbd{font-size:12px;color:var(--yo-muted);border:1px solid var(--yo-line);border-radius:6px;padding:3px 8px;white-space:nowrap}
#ys-opening .yo-go{background:linear-gradient(135deg,var(--yo-a),var(--yo-b));padding:12px 24px;border-radius:999px;font-weight:600;font-size:14px;white-space:nowrap}
#ys-opening .yo-hero .yo-big{margin-top:40px;opacity:0;animation:yo-up 1s 1.2s forwards}
#ys-opening .yo-scroll{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.3em;color:var(--yo-muted);display:flex;flex-direction:column;align-items:center;gap:10px}
#ys-opening .yo-scroll i{width:1px;height:54px;background:linear-gradient(var(--yo-c),transparent);animation:yo-drop 2s infinite}
@keyframes yo-drop{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* shared section heading */
#ys-opening .yo-label{font-size:12px;letter-spacing:.35em;color:var(--yo-c);margin-bottom:20px}
#ys-opening h2{font-size:clamp(34px,6vw,88px);font-weight:900;line-height:1.08;letter-spacing:-.02em;max-width:14em}

/* stats */
#ys-opening .yo-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--yo-line);margin-top:72px;border:1px solid var(--yo-line);border-radius:24px;overflow:hidden}
#ys-opening .yo-stat{background:rgba(5,6,10,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:44px 34px}
#ys-opening .yo-stat .yo-n{font-size:clamp(54px,8vw,120px);font-weight:700;line-height:1;letter-spacing:-.04em;
  background:linear-gradient(180deg,#fff,#6d7395);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
#ys-opening .yo-stat .yo-t{margin-top:14px;color:var(--yo-muted);font-size:15px}

/* categories */
#ys-opening .yo-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:60px;perspective:1200px}
#ys-opening .yo-cat{position:relative;padding:26px;border-radius:20px;background:rgba(255,255,255,.03);border:1px solid var(--yo-line);overflow:hidden;
  transform-style:preserve-3d;transition:transform .25s ease-out,border-color .3s,opacity 1.2s cubic-bezier(.2,.9,.2,1);min-height:168px;
  display:flex;flex-direction:column;justify-content:space-between;text-align:left}
#ys-opening .yo-cat::before{content:"";position:absolute;inset:0;background:radial-gradient(400px circle at var(--mx,50%) var(--my,50%),rgba(168,85,247,.25),transparent 40%);opacity:0;transition:opacity .3s}
#ys-opening .yo-cat:hover::before{opacity:1}
#ys-opening .yo-cat:hover{border-color:rgba(168,85,247,.5)}
#ys-opening .yo-cat .yo-ic{font-size:28px;transform:translateZ(40px)}
#ys-opening .yo-cat .yo-nm{font-size:20px;font-weight:600;transform:translateZ(30px)}
#ys-opening .yo-cat .yo-ct{font-size:13px;color:var(--yo-muted);transform:translateZ(20px)}
#ys-opening .yo-bar{height:3px;border-radius:3px;background:var(--yo-line);margin-top:10px;overflow:hidden}
#ys-opening .yo-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--yo-a),var(--yo-d));transition:width 1.6s cubic-bezier(.2,.9,.2,1)}

/* marquee */
#ys-opening .yo-marq{min-height:auto;padding:90px 0;overflow:hidden;gap:10px}
#ys-opening .yo-row{will-change:transform;display:flex;gap:48px;white-space:nowrap;width:max-content;animation:yo-mq 40s linear infinite}
#ys-opening .yo-row.yo-r{animation-direction:reverse;animation-duration:50s}
#ys-opening .yo-row span{font-size:clamp(46px,8vw,110px);font-weight:900;letter-spacing:-.02em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.25);transition:color .3s}
#ys-opening .yo-row span:hover{color:#fff}
#ys-opening .yo-row span.yo-f{color:#fff;-webkit-text-stroke:0}
#ys-opening .yo-row span.yo-g{background:linear-gradient(90deg,var(--yo-c),var(--yo-b));-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:0}
@keyframes yo-mq{to{transform:translateX(-50%)}}

/* ecosystem */
#ys-opening .yo-eco{display:grid;grid-template-columns:1.4fr 1fr 1fr;grid-template-rows:240px 240px;gap:16px;margin-top:60px}
#ys-opening .yo-e{border-radius:28px;padding:32px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;
  border:1px solid var(--yo-line);text-align:left;transition:transform .5s cubic-bezier(.2,.9,.2,1),opacity 1.2s cubic-bezier(.2,.9,.2,1)}
#ys-opening .yo-e:hover{transform:translateY(-6px) scale(1.01)}
#ys-opening .yo-e::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(transparent 40%,rgba(0,0,0,.45))}
#ys-opening .yo-e>*{position:relative;z-index:1}
#ys-opening .yo-e>.yo-orb{opacity:.55}
#ys-opening .yo-e .yo-orb{position:absolute;z-index:0;border-radius:50%;filter:blur(40px);animation:yo-float 8s ease-in-out infinite}
@keyframes yo-float{50%{transform:translate(30px,-20px) scale(1.15)}}
#ys-opening .yo-e h3{font-size:32px;font-weight:900}
#ys-opening .yo-e p{color:rgba(255,255,255,.7);margin-top:6px}
#ys-opening .yo-e .yo-tag{position:absolute;top:28px;left:32px;font-size:12px;letter-spacing:.2em;padding:6px 12px;border:1px solid rgba(255,255,255,.2);border-radius:999px}
#ys-opening .yo-e{isolation:isolate;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),0 24px 60px -28px var(--glow,#3b5bff)}
#ys-opening .yo-e::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;z-index:2;pointer-events:none;
  background:linear-gradient(140deg,rgba(255,255,255,.45),rgba(255,255,255,0) 35%,rgba(255,255,255,0) 65%,var(--glow,#3b5bff));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
#ys-opening .yo-e .yo-pat{position:absolute;inset:0;z-index:0;pointer-events:none;-webkit-mask-image:linear-gradient(100deg,transparent 15%,#000 70%);mask-image:linear-gradient(100deg,transparent 15%,#000 70%)}
#ys-opening .yo-e .yo-mark{position:absolute;z-index:0;right:-4%;bottom:-8%;width:46%;max-width:220px;aspect-ratio:1;height:auto;fill:none;stroke:#fff;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;
  opacity:.16;transform:rotate(-10deg);animation:yo-mark 9s ease-in-out infinite;filter:drop-shadow(0 0 18px var(--glow,#3b5bff))}
@keyframes yo-mark{50%{transform:rotate(-4deg) translateY(-10px)}}
#ys-opening .yo-e .yo-sheen{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;border-radius:inherit}
#ys-opening .yo-e .yo-sheen::after{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:40%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);transform:translateX(-160%) skewX(-12deg);animation:yo-sheen 7s ease-in-out infinite}
#ys-opening .yo-e2 .yo-sheen::after{animation-delay:-1.6s}#ys-opening .yo-e3 .yo-sheen::after{animation-delay:-3.2s}#ys-opening .yo-e4 .yo-sheen::after{animation-delay:-4.8s}
@keyframes yo-sheen{0%,62%{transform:translateX(-160%) skewX(-12deg)}100%{transform:translateX(360%) skewX(-12deg)}}
#ys-opening .yo-e:hover .yo-mark{opacity:.3}

#ys-opening .yo-e1{grid-row:span 2;--glow:#3b82f6;
  background:radial-gradient(120% 80% at 10% 0%,rgba(34,211,238,.55),transparent 55%),radial-gradient(90% 70% at 100% 20%,rgba(59,91,255,.75),transparent 60%),
  radial-gradient(80% 60% at 70% 110%,rgba(124,58,237,.6),transparent 60%),linear-gradient(160deg,#0b1a4a,#050a22)}
#ys-opening .yo-e1 .yo-pat{background:repeating-linear-gradient(0deg,rgba(255,255,255,.07) 0 1px,transparent 1px 16px),repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0 1px,transparent 1px 64px)}
#ys-opening .yo-e2{--glow:#d946ef;
  background:radial-gradient(90% 90% at 100% 0%,rgba(217,70,239,.75),transparent 58%),radial-gradient(70% 70% at 0% 100%,rgba(244,63,94,.45),transparent 60%),
  radial-gradient(60% 60% at 40% 40%,rgba(124,58,237,.35),transparent 70%),linear-gradient(160deg,#2a0b3a,#0f0616)}
#ys-opening .yo-e2 .yo-pat{background:repeating-linear-gradient(90deg,rgba(255,255,255,.22) 0 9px,transparent 9px 20px) 0 12px/100% 7px no-repeat,
  repeating-linear-gradient(90deg,rgba(255,255,255,.22) 0 9px,transparent 9px 20px) 0 calc(100% - 12px)/100% 7px no-repeat}
#ys-opening .yo-e3{--glow:#14b8a6;
  background:radial-gradient(90% 90% at 100% 0%,rgba(20,184,166,.75),transparent 58%),radial-gradient(70% 70% at 0% 100%,rgba(34,211,238,.4),transparent 60%),
  radial-gradient(50% 50% at 30% 30%,rgba(132,204,22,.22),transparent 70%),linear-gradient(160deg,#06302c,#03110f)}
#ys-opening .yo-e3 .yo-pat{background:repeating-linear-gradient(0deg,rgba(255,255,255,.06) 0 2px,transparent 2px 5px)}
#ys-opening .yo-e4{grid-column:span 2;--glow:#ec4899;
  background:radial-gradient(70% 120% at 85% 0%,rgba(236,72,153,.7),transparent 60%),radial-gradient(60% 120% at 45% 100%,rgba(168,85,247,.7),transparent 60%),
  radial-gradient(40% 80% at 0% 50%,rgba(59,91,255,.45),transparent 70%),linear-gradient(120deg,#160a2a,#24071e)}
#ys-opening .yo-e4 .yo-pat{background:radial-gradient(rgba(255,255,255,.22) 1px,transparent 1.6px) 0 0/18px 18px}
#ys-opening .yo-e4 .yo-mark{width:30%;bottom:-20%}

/* topics */
#ys-opening .yo-topics{display:grid;grid-template-columns:repeat(4,1fr);margin-top:60px;border-top:1px solid var(--yo-line)}
#ys-opening .yo-tp{padding:34px 8px;border-bottom:1px solid var(--yo-line);display:flex;align-items:baseline;gap:22px;transition:background .4s,opacity 1.2s cubic-bezier(.2,.9,.2,1),transform 1.2s cubic-bezier(.2,.9,.2,1)}
#ys-opening .yo-tp{width:100%;text-align:left;cursor:pointer;flex-wrap:wrap;color:inherit}
#ys-opening .yo-tp-copy{display:block;flex:1;min-width:0}
#ys-opening .yo-tp:not(:nth-child(4n+1)){padding-left:24px;border-left:1px solid var(--yo-line)}
#ys-opening .yo-tp:focus-visible{outline-offset:-2px}
#ys-opening .yo-tp .yo-no{color:var(--yo-muted);font-size:14px}
#ys-opening .yo-tp h4{font-size:19px;font-weight:600;transition:transform .4s}
#ys-opening .yo-tp p{color:var(--yo-muted);font-size:14px;margin-top:6px}
#ys-opening .yo-tp .yo-k{margin-left:auto;font-size:13px;color:var(--yo-c);white-space:nowrap}
#ys-opening .yo-tp:hover{background:linear-gradient(90deg,rgba(91,140,255,.08),transparent)}
#ys-opening .yo-tp:hover h4{transform:translateX(8px)}

/* final call */
#ys-opening .yo-cta{align-items:center;text-align:center}
#ys-opening .yo-cta h2{max-width:none;font-size:clamp(46px,11vw,180px)}
#ys-opening .yo-uptime{margin:30px 0 46px;color:var(--yo-muted);font-size:15px;letter-spacing:.05em}
#ys-opening .yo-uptime b{color:var(--yo-fg);font-weight:400}
#ys-opening .yo-foot{position:relative;z-index:2;padding:34px 6vw;border-top:1px solid var(--yo-line);display:flex;justify-content:space-between;color:var(--yo-muted);font-size:13px;gap:16px;flex-wrap:wrap}

/* mobile sticky entry */
#ys-opening .yo-dock{display:none}

/* reveal */
#ys-opening .yo-rv{opacity:0;transform:translateY(60px);transition:opacity 1.2s cubic-bezier(.2,.9,.2,1),transform 1.2s cubic-bezier(.2,.9,.2,1)}
#ys-opening .yo-rv.yo-in{opacity:1;transform:none}
#ys-opening .yo-d1{transition-delay:.1s}#ys-opening .yo-d2{transition-delay:.2s}#ys-opening .yo-d3{transition-delay:.3s}

@media(max-width:900px){
  #ys-opening .yo-cats{grid-template-columns:repeat(2,1fr)}
  #ys-opening .yo-eco{grid-template-columns:1fr;grid-template-rows:none}
  #ys-opening .yo-e{min-height:210px}
  #ys-opening .yo-e1,#ys-opening .yo-e4{grid-row:auto;grid-column:auto}
  #ys-opening .yo-topics{grid-template-columns:1fr}
  #ys-opening .yo-tp:nth-child(n){padding-left:8px;border-left:0}
  #ys-opening .yo-stats{grid-template-columns:1fr}
}
@media(max-width:600px){
  #ys-opening section{min-height:auto;padding:84px 16px 48px}
  #ys-opening .yo-hero{min-height:100vh;min-height:100svh;padding:96px 18px 150px}
  #ys-opening .yo-nav{padding:12px 16px;margin-bottom:-60px}
  #ys-opening .yo-nav .yo-btn{display:none}
  #ys-opening .yo-logo{font-size:17px}
  #ys-opening .yo-logo img{width:26px;height:26px}
  #ys-opening .yo-skip{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);padding:7px 14px;font-size:12px;color:#c9cee0}
  #ys-opening .yo-eyebrow{font-size:10px;letter-spacing:.24em;margin-bottom:20px}
  #ys-opening h1{font-size:12.2vw;text-shadow:0 6px 30px rgba(5,6,10,.6)}
  #ys-opening .yo-dash{display:none}
  #ys-opening .yo-sub-l{display:block}
  #ys-opening .yo-sub{font-size:15px;line-height:1.7;max-width:19em;margin:22px auto 0;color:#b4b9cc;text-shadow:0 1px 12px #05060a,0 0 2px #05060a}
  #ys-opening .yo-search{margin-top:34px;padding:7px 7px 7px 18px;background:rgba(10,12,20,.72)}
  #ys-opening .yo-ph{font-size:14px}
  #ys-opening .yo-kbd{display:none}
  #ys-opening .yo-go{padding:10px 18px;font-size:13px}
  #ys-opening .yo-hero .yo-big,#ys-opening .yo-scroll{display:none}
  #ys-opening .yo-label{font-size:11px;letter-spacing:.28em;margin-bottom:14px}
  #ys-opening h2{font-size:9.4vw;line-height:1.18}
  #ys-opening .yo-stats{grid-template-columns:repeat(3,1fr);margin-top:32px;border-radius:18px}
  #ys-opening .yo-stat{padding:22px 10px;text-align:center}
  #ys-opening .yo-stat .yo-n{font-size:9.6vw}
  #ys-opening .yo-stat .yo-t{font-size:11.5px;margin-top:8px;line-height:1.4}
  #ys-opening .yo-cats{gap:10px;margin-top:32px;perspective:none}
  #ys-opening .yo-cat{padding:16px;min-height:118px;border-radius:16px;background:rgba(14,16,26,.78);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
  #ys-opening .yo-cat .yo-ic{font-size:24px}
  #ys-opening .yo-cat .yo-nm{font-size:16px}
  #ys-opening .yo-cat .yo-ct{font-size:12px}
  #ys-opening .yo-marq{padding:44px 0;gap:4px}
  #ys-opening .yo-row{gap:24px}
  #ys-opening .yo-row span{font-size:12vw}
  #ys-opening .yo-eco{grid-template-columns:1fr 1fr;grid-template-rows:none;gap:10px;margin-top:32px}
  #ys-opening .yo-e{min-height:150px;padding:18px;border-radius:20px}
  #ys-opening .yo-e1,#ys-opening .yo-e4{grid-column:span 2;grid-row:auto}
  #ys-opening .yo-e1{min-height:190px}
  #ys-opening .yo-e4{min-height:120px}
  #ys-opening .yo-e h3{font-size:22px}
  #ys-opening .yo-e .yo-mark{width:44%;right:-6%;bottom:-10%}
  #ys-opening .yo-e4 .yo-mark{width:30%;bottom:-30%}
  #ys-opening .yo-e2 .yo-pat{background-position:0 8px,0 calc(100% - 8px);background-size:100% 5px}
  #ys-opening .yo-e p{font-size:13px;margin-top:2px}
  #ys-opening .yo-e .yo-tag{top:16px;left:18px;font-size:10px;padding:4px 10px}
  #ys-opening .yo-topics{margin-top:28px;background:rgba(5,6,10,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
  #ys-opening .yo-tp{padding:18px 6px;gap:14px}
  #ys-opening .yo-tp h4{font-size:17px}
  #ys-opening .yo-tp p{font-size:13px;margin-top:2px}
  #ys-opening .yo-cta{padding:90px 16px 70px}
  #ys-opening .yo-cta h2{font-size:15vw}
  #ys-opening .yo-uptime{margin:22px 0 32px;font-size:13px}
  #ys-opening .yo-big{padding:13px 13px 13px 28px;font-size:17px}
  #ys-opening .yo-foot{padding:24px 16px calc(28px + env(safe-area-inset-bottom));font-size:12px}
  #ys-opening .yo-dock{display:flex;position:absolute;left:0;right:0;bottom:0;z-index:6;justify-content:center;
    padding:28px 16px calc(14px + env(safe-area-inset-bottom));background:linear-gradient(rgba(5,6,10,0),rgba(5,6,10,.92) 55%);
    transition:opacity .4s,transform .4s}
  #ys-opening .yo-dock .yo-big{width:100%;justify-content:center}
  #ys-opening .yo-dock .yo-big::before{inset:-2px;filter:blur(10px);opacity:.8}
  #ys-opening .yo-aurora i{filter:blur(60px)}
  #ys-opening .yo-aurora i:nth-child(1){width:110vw;height:110vw;top:-30vw;left:-40vw}
  #ys-opening .yo-aurora i:nth-child(2){width:100vw;height:100vw;bottom:-20vw;right:-40vw}
  #ys-opening .yo-aurora i:nth-child(3){width:80vw;height:80vw;top:38%;left:30%}
  #ys-opening .yo-aurora i:nth-child(4){width:70vw;height:70vw;top:60%;left:-30vw}
  #ys-opening .yo-floor{height:38vh;bottom:9vh;background-size:40px 40px;animation:none}
  #ys-opening .yo-aurora i{animation:none}
  #ys-opening .yo-aurora{transition:none}
  /* performance on phones: no live blur/blend/backdrop over the animated canvas */
  #ys-opening .yo-aurora{filter:none}
  #ys-opening .yo-aurora i{filter:none;mix-blend-mode:normal}
  #ys-opening .yo-aurora i:nth-child(1){opacity:.7}
  #ys-opening .yo-aurora i:nth-child(2){opacity:.62}
  #ys-opening .yo-aurora i:nth-child(3),#ys-opening .yo-aurora i:nth-child(4){opacity:.4}
  #ys-opening .yo-aurora i{background-size:100% 100%}
  #ys-opening .yo-grain,#ys-opening .yo-glow{display:none}
  #ys-opening .yo-halo::before{filter:none}
  #ys-opening *{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  #ys-opening .yo-nav{background:linear-gradient(rgba(5,6,10,.92),rgba(5,6,10,0))}
  #ys-opening .yo-search{background:rgba(12,14,24,.9)}
  #ys-opening .yo-stat{background:rgba(8,10,18,.9)}
  #ys-opening .yo-cat{background:rgba(14,16,26,.9)}
  #ys-opening .yo-topics{background:rgba(5,6,10,.82)}
  #ys-opening .yo-big::before{animation:none;filter:blur(8px)}
  #ys-opening .yo-e .yo-orb{animation:none}
  #ys-opening .yo-e .yo-mark{animation:none;filter:none}
  #ys-opening .yo-dock.yo-dock-hide{opacity:0;transform:translateY(24px);pointer-events:none}
}
@media(prefers-reduced-motion:reduce){
  #ys-opening,#ys-opening *,#ys-opening *::before,#ys-opening *::after{animation:none!important;transition:none!important}
  #ys-opening .yo-rv,#ys-opening .yo-eyebrow,#ys-opening .yo-sub,#ys-opening .yo-search,#ys-opening .yo-hero .yo-big{opacity:1;transform:none}
  #ys-opening h1 .yo-l>span{transform:none}
  #ys-opening .yo-row{flex-wrap:wrap;width:auto;padding:0 16px}
}

/* ys-contact */
/* Customer-service entry for the static homepage (mirrors components/navigation/contact-service.tsx).
   It is docked as the first item of the existing .float-tools column, so the existing column gap
   keeps it clear of the theme / back-to-top buttons at every width. Selectors are prefixed with
   .ys-contact so the generic ".float-tools button/svg" rules do not resize its contents. */
.ys-contact{position:fixed;right:14px;bottom:120px;z-index:13}
.ys-contact.ys-contact-docked{position:relative;right:auto;bottom:auto;z-index:auto;display:flex;justify-content:flex-end}
.float-tools.ys-has-contact{align-items:flex-end;z-index:14}
.ys-contact .ys-contact-fab{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:auto;height:40px;padding:0 15px;border:0;border-radius:999px;background:var(--blue,#3978ed);color:#fff;font:600 14px/1 inherit;white-space:nowrap;box-shadow:0 6px 18px #2450a033;cursor:pointer}
.ys-contact .ys-contact-fab svg{width:18px;height:18px}
.ys-contact .ys-contact-panel{position:absolute;right:0;bottom:calc(100% + 10px);width:min(310px,calc(100vw - 28px));display:grid;gap:8px;padding:14px;border:1px solid var(--line,#e9ecf1);border-radius:14px;background:var(--panel,#fff);color:var(--text,#303846);box-shadow:0 12px 32px #1d2b4a2e;text-align:left}
.ys-contact .ys-contact-panel[hidden]{display:none}
.ys-contact .ys-contact-head{display:flex;align-items:center;justify-content:space-between;font-size:15px}
.ys-contact .ys-contact-head button{display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:8px;background:transparent;box-shadow:none;color:var(--sub,#7a8495);font-size:18px;cursor:pointer}
.ys-contact .ys-contact-item{display:flex;align-items:center;gap:9px;width:100%;height:auto;min-height:46px;padding:0 12px;border:1px solid var(--line,#e9ecf1);border-radius:10px;background:var(--hover,#f7f9fc);box-shadow:none;color:var(--text,#303846);font:inherit;font-size:14px;text-align:left;text-decoration:none;cursor:pointer}
.ys-contact .ys-contact-item span{flex:1;min-width:0}
.ys-contact .ys-contact-item em{color:var(--blue,#3978ed);font-size:12px;font-style:normal}
.ys-contact .ys-contact-item svg{width:18px;height:18px;flex:none}
.ys-contact .ys-contact-tg svg{color:#229ed9}
.ys-contact .ys-contact-panel small{color:var(--sub,#7a8495);font-size:12px}
@media(max-width:520px){
  .ys-contact .ys-contact-fab{width:40px;padding:0}
  .ys-contact .ys-contact-fab span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
}
.ys-preview-replay{bottom:176px!important}
@media print{.ys-contact{display:none}}

/* ys-redesign */
/* YS导航 visual redesign (Claude, 2026-11-04). Appearance only; loaded after every other stylesheet.
   Direction: the homepage carries the opening's identity — a deep-space hero with the search inside it,
   colour-coded category tiles, rounder cards with more air, and a footer that closes the page in the same palette. */

:root{
  --rd-radius:16px;--rd-radius-sm:12px;
  --rd-ink:#0b1026;--rd-violet:#8b5cf6;--rd-azure:#4f7dff;--rd-cyan:#22d3ee;--rd-pink:#ec4899;
  --rd-card-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px -14px rgba(31,45,90,.18);
  --rd-card-shadow-hover:0 2px 4px rgba(16,24,40,.05),0 18px 40px -16px rgba(60,80,200,.35);
}
html[data-theme] body{--bg:#f3f4fa;--panel:#fff;--line:#e6e8f2;--text:#1d2333;--sub:#6b7489;--blue:#4b63f0;--soft:#eef0ff;--hover:#f5f6fd}
html[data-theme=dark] body{--bg:#0d1020;--panel:#161a2e;--line:#262b45;--text:#e8eaf6;--sub:#9aa1bf;--blue:#9aa8ff;--soft:#232a4d;--hover:#1d2240;
  --rd-card-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 30px -18px #000;--rd-card-shadow-hover:0 0 0 1px rgba(154,168,255,.35),0 18px 40px -16px #000}

/* ---------- page ---------- */
html[data-theme] body{background:radial-gradient(1200px 500px at 70% -200px,rgba(139,92,246,.10),transparent 70%),var(--bg);background-attachment:scroll}
html[data-theme] body .main{padding-top:20px}
html[data-theme] body .topbar{background:color-mix(in srgb,var(--bg) 82%,transparent);border-bottom-color:transparent;box-shadow:0 1px 0 var(--line)}

/* ---------- sidebar ---------- */
html[data-theme] body .sidebar{background:var(--panel);border-right:1px solid var(--line)}
html[data-theme] body .side-nav button{border-radius:10px;color:var(--sub);font-weight:500}
html[data-theme] body .side-nav button.active{background:linear-gradient(135deg,var(--rd-azure),var(--rd-violet));color:#fff;box-shadow:0 8px 18px -10px rgba(99,102,241,.9)}
html[data-theme] body .side-nav button.active svg{color:#fff}
html[data-theme] body .side-nav button:not(.active):hover{background:var(--hover);color:var(--text)}
html[data-theme] body .side-label{text-transform:none;letter-spacing:.5px;font-weight:600;color:color-mix(in srgb,var(--sub) 80%,transparent)}

/* ---------- hero: the search lives inside the brand's deep-space band ---------- */
html[data-theme] body .search-zone{
  position:relative;isolation:isolate;overflow:hidden;color:#fff;
  margin:0 0 22px;padding:58px 24px 34px;border-radius:24px;
  background:
    radial-gradient(600px 300px at 12% 0%,rgba(79,125,255,.55),transparent 70%),
    radial-gradient(520px 320px at 92% 10%,rgba(168,85,247,.55),transparent 70%),
    radial-gradient(700px 260px at 50% 120%,rgba(34,211,238,.28),transparent 70%),
    linear-gradient(160deg,#121a4a 0%,#0b1026 55%,#160b2e 100%);
  box-shadow:0 30px 60px -36px rgba(40,30,120,.75);
}
html[data-theme] body .search-zone::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.55;
  background:radial-gradient(rgba(255,255,255,.5) 1px,transparent 1.4px) 0 0/34px 34px,radial-gradient(rgba(255,255,255,.28) 1px,transparent 1.4px) 17px 17px/34px 34px;
  -webkit-mask-image:radial-gradient(70% 90% at 50% 30%,#000,transparent);mask-image:radial-gradient(70% 90% at 50% 30%,#000,transparent)}
html[data-theme] body .search-zone::after{content:"";position:absolute;z-index:-1;pointer-events:none;width:520px;height:520px;left:50%;top:-300px;transform:translateX(-50%);
  border-radius:50%;border:1px solid rgba(255,255,255,.12);box-shadow:0 0 0 70px rgba(255,255,255,.025),0 0 0 140px rgba(255,255,255,.02)}
html[data-theme] body .search-zone h1{
  font-size:44px;line-height:1.15;font-weight:800;letter-spacing:-1.5px;margin:0 0 10px;
  background:linear-gradient(100deg,#fff 0%,#fff 45%,#a5b4ff 65%,#d8b4fe 85%,#f9a8d4 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
html[data-theme] body .search-zone>p{color:rgba(255,255,255,.72);font-size:15px;margin:0 0 24px}
html[data-theme] body .search-context{gap:6px;margin-bottom:14px;padding:4px;border-radius:999px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
html[data-theme] body .search-context button{padding:6px 15px;border:0;border-radius:999px;color:rgba(255,255,255,.72);font-size:13px}
html[data-theme] body .search-context button:hover{color:#fff}
html[data-theme] body .search-context button.active{background:#fff;color:var(--rd-ink);font-weight:600}
html[data-theme] body .search-form{width:min(760px,100%);min-height:62px;padding:7px 7px 7px 22px;border-radius:18px;border:0;background:#fff;
  box-shadow:0 0 0 6px rgba(255,255,255,.1),0 24px 50px -20px rgba(0,0,0,.6)}
html[data-theme] body .search-form:focus-within{box-shadow:0 0 0 6px rgba(165,180,255,.35),0 24px 50px -20px rgba(0,0,0,.6)}
html[data-theme] body .search-form input{color:#1d2333;font-size:15px}
html[data-theme] body .search-form input::placeholder{color:#8a92a8}
html[data-theme] body .search-form>svg{color:#8a92a8}
html[data-theme] body .search-form .refine-shortcut{color:#8a92a8;border-color:#e3e6ef}
html[data-theme] body .search-form>button:not(.refine-clear){min-height:48px;padding:0 30px;border-radius:13px;font-size:14px;font-weight:700;
  background:linear-gradient(135deg,var(--rd-azure),var(--rd-violet) 60%,var(--rd-pink));box-shadow:0 10px 22px -10px rgba(139,92,246,.9)}
html[data-theme] body .engine-row{margin-top:16px;color:rgba(255,255,255,.6)}
html[data-theme] body .engine-row button{color:rgba(255,255,255,.6)}
html[data-theme] body .engine-row button:hover,html[data-theme] body .engine-row button.active{color:#fff}
html[data-theme] body .engine-row button.active{font-weight:600}
html[data-theme] body .engine-row i{background:rgba(255,255,255,.2)}
html[data-theme] body .engine-row #catalog-summary{padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.1);color:rgba(255,255,255,.85)}

/* ---------- category tiles: one colour per category, name over count ---------- */
html[data-theme] body .discovery-shortcuts{gap:12px;background:none;border:0;border-radius:0;overflow:visible;margin-bottom:22px}
html[data-theme] body .shortcut{
  display:grid;grid-template-columns:44px minmax(0,1fr);grid-template-rows:auto auto;column-gap:12px;align-items:center;
  padding:14px;border-radius:var(--rd-radius);background:var(--panel);border:1px solid var(--line);box-shadow:var(--rd-card-shadow);
  transition:transform .2s,box-shadow .2s,border-color .2s}
html[data-theme] body .shortcut svg{grid-row:1/3;box-sizing:border-box;width:44px;height:44px;padding:11px;border-radius:13px;
  color:#fff;background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 60%,#1d1b4b));box-shadow:0 8px 16px -8px var(--c);opacity:1}
html[data-theme] body .shortcut span{font-size:14px;font-weight:650;color:var(--text);align-self:end}
html[data-theme] body .shortcut small{margin:0;font-size:12px;color:var(--sub);align-self:start}
html[data-theme] body .shortcut small::after{content:" 个资源"}
html[data-theme] body .shortcut:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--c) 45%,var(--line));box-shadow:0 18px 32px -18px var(--c);background:var(--panel)}
html[data-theme] body .shortcut:hover svg{background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 60%,#1d1b4b));color:#fff}
html[data-theme] body .shortcut[aria-pressed=true]{border-color:var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 22%,transparent)}

/* ---------- shared card language ---------- */
html[data-theme] body .personal,
html[data-theme] body .latest-box,
html[data-theme] body .ops-maintenance-strip,
html[data-theme] body .sponsor-section{border-radius:var(--rd-radius);border:1px solid var(--line);background:var(--panel);box-shadow:var(--rd-card-shadow)}

/* 常用导航: links become tappable chips */
html[data-theme] body .personal{padding:18px 20px 16px}
html[data-theme] body .personal .tabs{gap:4px;padding:3px;border-radius:12px;background:var(--hover)}
html[data-theme] body .personal .tabs button{padding:6px 14px;border-radius:9px;font-size:13px;color:var(--sub)}
html[data-theme] body .personal .tabs button.active{background:var(--panel);color:var(--text);font-weight:650;box-shadow:0 1px 3px rgba(16,24,40,.12)}
html[data-theme] body .personal .tabs button.active::after,html[data-theme] body .recommend-head .tabs button.active::after{display:none}
html[data-theme] body .quick-grid{gap:10px}
html[data-theme] body .quick-link{gap:9px;padding:9px 11px;border-radius:12px;background:var(--hover);font-size:13px;font-weight:500;transition:background .15s,transform .15s}
html[data-theme] body .quick-link:hover{background:var(--soft);color:var(--blue);transform:translateY(-1px)}
html[data-theme] body .quick-link .site-icon{width:26px;height:26px;border-radius:8px;background:var(--panel)}

/* section headings: bigger, with a gradient accent bar */
html[data-theme] body .section-head h2,
html[data-theme] body .ops-heading h2{font-size:20px;font-weight:750;letter-spacing:-.4px;gap:10px}
html[data-theme] body .section-head h2>svg{display:none}
html[data-theme] body .section-head h2::before,
html[data-theme] body .ops-heading h2::before{content:"";display:inline-block;width:5px;height:20px;border-radius:3px;margin-right:10px;vertical-align:-3px;
  background:linear-gradient(180deg,var(--rd-azure),var(--rd-violet) 55%,var(--rd-pink))}
html[data-theme] body .recommend-head h2::before{margin-right:0}
html[data-theme] body .section-head>button,html[data-theme] body .section-head>a,html[data-theme] body .ops-heading>button{
  padding:6px 12px;border-radius:999px;background:var(--panel);border:1px solid var(--line);color:var(--sub);font-size:12px}
html[data-theme] body .section-head>button:hover,html[data-theme] body .ops-heading>button:hover{color:var(--blue);border-color:var(--blue)}

/* YS ecosystem: taller vivid cards */
html[data-theme] body .eco-grid{gap:14px;padding:0;border:0;background:none}
html[data-theme] body .eco-grid .eco-card{min-height:104px;padding:20px;border-radius:20px}
html[data-theme] body .eco-grid .eco-card:not(:last-child){border-right:0}
html[data-theme] body .eco-card strong{font-size:17px}
html[data-theme] body .eco-card .eco-icon{width:46px;height:46px;border-radius:14px;font-size:13px}

/* 按用途找工具: tool cards instead of a ruled list */
html[data-theme] body .ops-topic-grid{gap:12px}
html[data-theme] body .ops-topic{padding:16px;border:1px solid var(--line);border-radius:var(--rd-radius);background:var(--panel);box-shadow:var(--rd-card-shadow)}
html[data-theme] body .ops-topic:hover,html[data-theme] body .ops-topic[aria-pressed=true]{transform:translateY(-2px);border-color:color-mix(in srgb,var(--blue) 45%,var(--line));box-shadow:var(--rd-card-shadow-hover);background:var(--panel)}
html[data-theme] body .ops-topic>svg{color:var(--blue)!important;background:var(--soft)}
html[data-theme] body .ops-topic-count{padding:2px 8px;border-radius:999px;background:var(--hover)}

/* resource cards */
html[data-theme] body .recommend-grid,html[data-theme] body .group-grid{gap:12px}
html[data-theme] body .resource-card{border-radius:14px;padding:16px 14px;min-height:86px;border-color:var(--line);box-shadow:var(--rd-card-shadow)}
html[data-theme] body .resource-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--blue) 45%,var(--line));box-shadow:var(--rd-card-shadow-hover)}
html[data-theme] body .resource-card .site-icon{width:38px;height:38px;border-radius:11px;box-shadow:none;background:var(--soft)}
html[data-theme] body .resource-copy a{font-size:13px;font-weight:650}
html[data-theme] body .resource-copy p{font-size:11px}

/* tabs and pills */
html[data-theme] body .recommend-head .tabs button,html[data-theme] body .catalog-tabs button{border-radius:999px}
html[data-theme] body .recommend-head .tabs{gap:4px}
html[data-theme] body .recommend-head .tabs button{padding:5px 12px;font-size:12px}
html[data-theme] body .recommend-head .tabs button.active{background:var(--rd-ink);color:#fff}
html[data-theme=dark] body .recommend-head .tabs button.active{background:#fff;color:var(--rd-ink)}
html[data-theme] body .catalog-tabs button{padding:6px 14px;font-size:12px}
html[data-theme] body .catalog-tabs button.active{background:var(--rd-ink);border-color:var(--rd-ink);color:#fff}
html[data-theme=dark] body .catalog-tabs button.active{background:#fff;border-color:#fff;color:var(--rd-ink)}
html[data-theme] body .catalog-head{border-bottom:0}
html[data-theme] body .group{padding:18px;border-radius:20px;background:color-mix(in srgb,var(--panel) 55%,transparent);border:1px solid var(--line)}
html[data-theme] body .group-title h3{font-size:16px;font-weight:700}
html[data-theme] body .group-title svg{box-sizing:content-box;padding:6px;border-radius:9px;background:var(--soft)}

/* footer closes the page in the hero's palette */
html[data-theme] body .footer{border:0;border-radius:24px;padding:30px 30px 24px;color:rgba(255,255,255,.66);
  background:radial-gradient(500px 220px at 0% 0%,rgba(79,125,255,.35),transparent 70%),radial-gradient(500px 240px at 100% 100%,rgba(168,85,247,.35),transparent 70%),linear-gradient(160deg,#121a4a,#0b1026 60%,#160b2e)}
html[data-theme] body .footer-head strong{color:#fff;font-size:16px}
html[data-theme] body .footer a,html[data-theme] body .footer button{color:rgba(255,255,255,.75)}
html[data-theme] body .footer a:hover,html[data-theme] body .footer button:hover{color:#fff}
html[data-theme] body .footer-bottom{border-top-color:rgba(255,255,255,.12)}
html[data-theme] body .footer .uptime{color:#fff}
html[data-theme] body .footer .uptime strong{color:#c4b5fd}
html[data-theme] body .footer .sync-note{color:rgba(255,255,255,.5)}

html[data-theme] body .float-tools button{border-radius:12px}

/* ---------- responsive ---------- */
@media(max-width:1250px){
  html[data-theme] body .search-zone h1{font-size:38px}
}
@media(max-width:760px){
  html[data-theme] body .main{padding-top:14px}
  html[data-theme] body .search-zone{padding:38px 16px 24px;border-radius:20px;margin-bottom:16px}
  html[data-theme] body .search-zone h1{font-size:30px;letter-spacing:-1px}
  html[data-theme] body .search-zone>p{font-size:13px;margin-bottom:18px}
  html[data-theme] body .search-context{max-width:100%;overflow-x:auto;scrollbar-width:none}
  html[data-theme] body .search-context::-webkit-scrollbar{display:none}
  html[data-theme] body .search-context button{padding:5px 11px;font-size:12px;flex:none}
  html[data-theme] body .search-form{min-height:54px;padding:5px 5px 5px 14px;border-radius:15px}
  html[data-theme] body .search-form>button:not(.refine-clear){min-height:44px;padding:0 18px}
  html[data-theme] body .engine-row{flex-wrap:wrap;justify-content:center;row-gap:8px}
  html[data-theme] body .section-head h2,html[data-theme] body .ops-heading h2{font-size:18px}
  html[data-theme] body .group{padding:14px;border-radius:16px}
  html[data-theme] body .footer{border-radius:20px;padding:24px 18px 20px}
}
@media(max-width:520px){
  /* three compact columns: icon over name over count, so the twelve tiles take four rows, not six */
  html[data-theme] body .discovery-shortcuts{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  html[data-theme] body .shortcut{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;justify-items:center;text-align:center;row-gap:2px;padding:12px 6px 10px;border-radius:14px}
  html[data-theme] body .shortcut svg{grid-row:auto;margin-bottom:6px}
  html[data-theme] body .shortcut span,html[data-theme] body .shortcut small{align-self:auto;max-width:100%}
  html[data-theme] body .shortcut small::after{content:" 个"}
  html[data-theme] body .ops-topic-count{justify-self:start}
  html[data-theme] body .eco-grid .eco-card strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html[data-theme] body .shortcut svg{width:36px;height:36px;padding:9px;border-radius:11px;background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 60%,#1d1b4b));color:#fff}
  html[data-theme] body .shortcut:hover svg{background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 60%,#1d1b4b));color:#fff}
  html[data-theme] body .shortcut span{font-size:13px}
  html[data-theme] body .shortcut small{font-size:11px}
  html[data-theme] body .personal{padding:14px 12px}
  html[data-theme] body .personal-head{flex-wrap:wrap}
  html[data-theme] body .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  html[data-theme] body .eco-grid .eco-card{min-height:86px;padding:14px;border-radius:16px}
  html[data-theme] body .eco-card strong{font-size:14px}
  html[data-theme] body .eco-card .eco-icon{width:38px;height:38px;border-radius:12px;font-size:11px}
  html[data-theme] body .ops-topic-grid{grid-template-columns:1fr 1fr;gap:9px}
  html[data-theme] body .ops-topic{padding:12px}
  html[data-theme] body .resource-card{padding:13px 10px;min-height:78px}
  html[data-theme] body .resource-card .site-icon{width:32px;height:32px;border-radius:9px}
}
@media(prefers-reduced-motion:reduce){
  html[data-theme] body .shortcut:hover,html[data-theme] body .ops-topic:hover,html[data-theme] body .resource-card:hover,html[data-theme] body .quick-link:hover{transform:none}
}
@media(forced-colors:active){
  html[data-theme] body .search-zone,html[data-theme] body .footer{background:Canvas;color:CanvasText}
  html[data-theme] body .search-zone h1{-webkit-text-fill-color:currentColor;background:none}
}

/* ---------- 3D depth in the hero (layers injected by ys-hero3d.js) ---------- */
html[data-theme] body .search-zone::before{display:none}
.rd-hero-deco{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;border-radius:inherit}
.rd-aurora i{position:absolute;border-radius:50%;filter:blur(70px);mix-blend-mode:screen;opacity:.75;animation:rd-drift 18s ease-in-out infinite alternate}
.rd-aurora i:nth-child(1){width:520px;height:520px;left:-160px;top:-260px;background:radial-gradient(circle,#2f52ff,transparent 68%)}
.rd-aurora i:nth-child(2){width:480px;height:480px;right:-140px;top:-200px;background:radial-gradient(circle,#9b3cff,transparent 68%);animation-delay:-6s}
.rd-aurora i:nth-child(3){width:420px;height:420px;left:38%;bottom:-300px;background:radial-gradient(circle,#13c8e6,transparent 68%);opacity:.5;animation-delay:-11s;animation-duration:24s}
@keyframes rd-drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(60px,40px) scale(1.15)}100%{transform:translate(-50px,-30px) scale(.92)}}
.rd-floor{position:absolute;left:-50%;right:-50%;bottom:-40px;height:62%;
  background-image:linear-gradient(rgba(150,175,255,.6) 1px,transparent 1px),linear-gradient(90deg,rgba(150,175,255,.6) 1px,transparent 1px);background-size:56px 56px;
  transform:perspective(380px) rotateX(64deg);transform-origin:50% 100%;
  -webkit-mask-image:linear-gradient(transparent,#000 45%);mask-image:linear-gradient(transparent,#000 45%);animation:rd-floor 4s linear infinite}
@keyframes rd-floor{to{background-position:0 56px}}
.rd-stars{position:absolute;inset:0;width:100%;height:100%}
/* the headline floats a little against the pointer, so the hero reads as layered space */
html[data-theme] body .search-zone h1,html[data-theme] body .search-zone>p{transition:transform .4s ease-out;
  transform:translate3d(calc(var(--rd-px,0) * -14px),calc(var(--rd-py,0) * -8px),0)}
html[data-theme] body .search-zone h1{filter:drop-shadow(0 8px 30px rgba(120,110,255,.45))}

/* ---------- 3D tilt on tiles: a light spot follows the pointer ---------- */
html[data-theme] body .shortcut,html[data-theme] body .eco-card{transform-style:preserve-3d;will-change:transform;transition:transform .18s ease-out,box-shadow .2s,border-color .2s}
html[data-theme] body .shortcut{position:relative;overflow:hidden}
html[data-theme] body .shortcut::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .2s;
  background:radial-gradient(160px circle at var(--rd-mx,50%) var(--rd-my,50%),color-mix(in srgb,var(--c) 18%,transparent),transparent 70%)}
html[data-theme] body .shortcut:hover::after{opacity:1}
html[data-theme] body .shortcut svg{transform:translateZ(18px)}

/* ---------- YS 生态 at the very top: a compact strip of the four vivid cards ---------- */
html[data-theme] body .eco-top{margin-bottom:16px}
html[data-theme] body .eco-top .section-head{margin-bottom:10px}
html[data-theme] body .eco-top .section-head h2{font-size:16px}
html[data-theme] body .eco-top .section-head h2::before{height:16px;width:4px}
html[data-theme] body .eco-top .eco-grid .eco-card{min-height:78px;padding:14px 16px;border-radius:16px}
html[data-theme] body .eco-top .eco-card strong{font-size:15px}
html[data-theme] body .eco-top .eco-card .eco-icon{width:40px;height:40px;border-radius:12px}
@media(max-width:520px){
  html[data-theme] body .eco-top .eco-grid .eco-card{min-height:66px;padding:11px 12px}
  html[data-theme] body .eco-top .eco-card .eco-icon{width:34px;height:34px}
  html[data-theme] body .eco-top .eco-card>svg{display:none}
}
@media(prefers-reduced-motion:reduce){
  .rd-aurora i,.rd-floor{animation:none}
  html[data-theme] body .search-zone h1,html[data-theme] body .search-zone>p{transform:none}
}

/* ys-home-layout */
/* YS导航 homepage layout (Claude, 2026-11-05) — see ys-home-layout.js. Loaded after ys-redesign.css.
   Goal: search, everyday tools, categories and the visitor's own links all on the first screen. */

/* ---------- YS 生态: a slim strip at the very top ---------- */
/* Keep seed data usable offline, without briefly advertising its old counts as live. */
html.ys-catalog-loading #catalog-summary,
html.ys-catalog-loading #resource-total,
html.ys-catalog-loading #shortcuts small,
html.ys-catalog-loading #side-categories small,
html.ys-catalog-loading .zone-more,
html.ys-catalog-loading #ys-opening [data-yo-live],
html.ys-catalog-loading #ys-opening .yo-ct{visibility:hidden}
html[data-theme] body .eco-top{margin-bottom:12px}
html[data-theme] body .eco-top .section-head{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
html[data-theme] body .eco-top .eco-grid{gap:10px}
html[data-theme] body .eco-top .eco-grid .eco-card{min-height:58px;padding:9px 14px;border-radius:13px;gap:10px}
html[data-theme] body .eco-top .eco-card strong{font-size:14px;margin:0;line-height:1.3}
html[data-theme] body .eco-top .eco-card p{font-size:11px;line-height:1.3}
html[data-theme] body .eco-top .eco-card .eco-icon{width:36px;height:36px;border-radius:10px;font-size:11px}
html[data-theme] body .eco-top .eco-card>svg{width:11px;height:11px;padding:5px}

/* ---------- compact hero ---------- */
html[data-theme] body .main{padding-top:14px}
html[data-theme] body .search-zone{margin-bottom:12px;padding:22px 20px 16px;border-radius:18px}
html[data-theme] body .search-zone::after{display:none}
html[data-theme] body .search-zone h1{font-size:26px;letter-spacing:-.6px;margin:0 0 10px;line-height:1.2}
html[data-theme] body .search-zone>p{display:none}
html[data-theme] body .search-context{margin-bottom:10px;padding:3px}
html[data-theme] body .search-context button{padding:4px 13px;font-size:12px}
html[data-theme] body .search-form{min-height:52px;padding:5px 5px 5px 18px;border-radius:14px;box-shadow:0 0 0 4px rgba(255,255,255,.1),0 18px 40px -20px rgba(0,0,0,.6)}
html[data-theme] body .search-form:focus-within{box-shadow:0 0 0 4px rgba(165,180,255,.35),0 18px 40px -20px rgba(0,0,0,.6)}
html[data-theme] body .search-form>button:not(.refine-clear){min-height:42px;padding:0 26px;border-radius:10px}
html[data-theme] body .engine-row{margin-top:9px}

/* everyday tools under the search box */
.daily-tools{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-top:11px;max-width:100%}
.daily-tools button{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:500;color:#fff;
  background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);transition:background .15s}
.daily-tools button svg{width:14px;height:14px}
.daily-tools button:hover,.daily-tools button[aria-expanded=true]{background:rgba(255,255,255,.24)}
.daily-panel{position:fixed;z-index:40;display:grid;gap:2px;min-width:150px;padding:6px;border-radius:12px;background:var(--panel);border:1px solid var(--line);box-shadow:0 18px 40px -14px rgba(20,24,60,.45)}
.daily-panel[hidden]{display:none}
.daily-panel a{padding:8px 11px;border-radius:8px;font-size:13px;color:var(--text)}
.daily-panel a:hover{background:var(--soft);color:var(--blue)}

/* ---------- category tiles: one line each ---------- */
html[data-theme] body .discovery-shortcuts{gap:8px;margin-bottom:12px}
html[data-theme] body .shortcut{grid-template-columns:32px minmax(0,1fr) auto;grid-template-rows:auto;column-gap:10px;padding:8px 12px 8px 9px;border-radius:12px}
html[data-theme] body .shortcut svg{grid-row:auto;width:32px;height:32px;padding:7px;border-radius:9px}
html[data-theme] body .shortcut span{font-size:13px;align-self:center}
html[data-theme] body .shortcut small{font-size:11px;align-self:center}
html[data-theme] body .shortcut small::after{content:""}

/* ---------- my links ---------- */
html[data-theme] body .personal{padding:10px 14px 8px;margin-bottom:18px;border-radius:14px}
html[data-theme] body .personal-head{margin-bottom:8px}
html[data-theme] body .personal .tabs button{padding:3px 12px;font-size:12px}
html[data-theme] body .personal-note{font-size:11px}
html[data-theme] body .quick-grid{gap:7px}
html[data-theme] body .quick-link{padding:6px 9px;border-radius:10px;font-size:12px}
html[data-theme] body .quick-link .site-icon{width:22px;height:22px;border-radius:6px}
html[data-theme] body .ops-personal-tools{margin-top:7px;padding-top:5px;min-height:0}

/* ---------- zones ---------- */
#catalog.is-home .catalog-tabs,#catalog.is-home .ops-toolbar,#catalog.is-home .ops-active-topic,#catalog.is-home .result-line:empty,#catalog.is-home .section-head>[data-all]{display:none}
html[data-theme] body #catalog.is-home .catalog-head{margin-bottom:10px;padding-bottom:0}
html[data-theme] body #catalog.is-home .groups{gap:12px}
html[data-theme] body .zone{padding:12px 14px 14px;border-radius:16px;background:var(--panel)}
.zone-head{display:flex;align-items:center;gap:14px;margin-bottom:10px;min-width:0}
.zone-head h3{display:flex;align-items:center;gap:8px;flex:none;margin:0;font-size:15px;font-weight:750}
.zone-head h3 svg{box-sizing:content-box;width:15px;height:15px;padding:5px;border-radius:8px;color:var(--blue);background:var(--soft)}
.zone-tabs{display:flex;gap:2px;min-width:0;overflow-x:auto;scrollbar-width:none}
.zone-tabs::-webkit-scrollbar{display:none}
.zone-tabs button{flex:none;padding:4px 11px;border-radius:999px;font-size:13px;color:var(--sub)}
.zone-tabs button:hover{color:var(--text);background:var(--hover)}
.zone-tabs button[aria-selected=true]{color:#fff;font-weight:600;background:var(--rd-ink)}
html[data-theme=dark] .zone-tabs button[aria-selected=true]{color:var(--rd-ink);background:#fff}
.zone-more{flex:none;margin-left:auto;padding:4px 2px;font-size:12px;color:var(--sub)}
.zone-more:hover{color:var(--blue)}
html[data-theme] body .zone-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
html[data-theme] body .zone .resource-card{display:flex;flex-direction:row;align-items:center;min-height:60px;padding:9px 11px;gap:10px;border-radius:11px;border-color:transparent;background:var(--hover);box-shadow:none}
html[data-theme] body .zone .resource-card:hover{background:var(--panel);border-color:color-mix(in srgb,var(--blue) 45%,var(--line));box-shadow:var(--rd-card-shadow-hover)}
html[data-theme] body .zone .resource-card .site-icon{width:32px;height:32px;border-radius:9px;background:var(--panel)}
html[data-theme] body .zone .resource-copy{padding-right:12px}
html[data-theme] body .zone .resource-copy a{font-size:13px}
html[data-theme] body .zone .resource-copy p{margin-top:1px;font-size:11px;line-height:1.4}
.zone .ops-card-meta,.zone .ops-card-detail{display:none!important}
@media(hover:hover){.zone .resource-card .save{opacity:0;transition:opacity .15s}.zone .resource-card:hover .save,.zone .resource-card .save:focus-visible,.zone .resource-card .save.saved{opacity:1}}

/* ---------- responsive ---------- */
@media(max-width:1250px){
  html[data-theme] body .zone-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  html[data-theme] body .search-zone h1{font-size:24px}
}
@media(max-width:980px){
  html[data-theme] body .zone-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  html[data-theme] body .main{padding-top:10px}
  html[data-theme] body .search-zone{padding:16px 12px 13px;border-radius:16px;margin-bottom:10px}
  html[data-theme] body .search-zone h1{font-size:20px;margin-bottom:8px;letter-spacing:-.3px}
  html[data-theme] body .search-context{margin-bottom:8px}
  html[data-theme] body .search-form{min-height:48px;padding:4px 4px 4px 12px;border-radius:12px}
  html[data-theme] body .search-form>button:not(.refine-clear){min-height:40px;padding:0 15px}
  .daily-tools{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;width:100%;margin-top:10px;padding-bottom:1px}
  .daily-tools::-webkit-scrollbar{display:none}
  .daily-tools button{flex:none}
  /* YS 生态 stays one swipeable row instead of a 2x2 block */
  html[data-theme] body .eco-top{margin-bottom:10px}
  html[data-theme] body .eco-top .eco-grid{display:flex;overflow-x:auto;scrollbar-width:none;gap:8px;margin:0 -16px;padding:0 16px;scroll-padding:0 16px;scroll-snap-type:x proximity}
  html[data-theme] body .eco-top .eco-grid::-webkit-scrollbar{display:none}
  html[data-theme] body .eco-top .eco-grid .eco-card{flex:0 0 148px;min-height:52px;padding:8px 10px;scroll-snap-align:start}
  html[data-theme] body .eco-top .eco-card>svg{display:none}
  html[data-theme] body .eco-top .eco-card strong{white-space:nowrap}
  html[data-theme] body .eco-top .eco-card p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .zone-head{flex-wrap:wrap;gap:6px 10px}
  .zone-more{order:2}
  .zone-tabs{order:3;width:100%}
}
@media(max-width:520px){
  html[data-theme] body .engine-row{margin-top:8px;gap:12px}
  /* categories: four compact tiles a row */
  html[data-theme] body .discovery-shortcuts{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-bottom:10px}
  html[data-theme] body .shortcut{grid-template-columns:minmax(0,1fr);justify-items:center;row-gap:3px;padding:8px 2px 7px;border-radius:12px}
  html[data-theme] body .shortcut svg{width:32px;height:32px;padding:7px;margin:0;border-radius:9px}
  html[data-theme] body .shortcut span{font-size:12px;font-weight:600}
  html[data-theme] body .shortcut small{display:none}
  /* my links: four across, icon over name */
  html[data-theme] body .personal{padding:9px 10px 7px;margin-bottom:14px}
  html[data-theme] body .personal-note{display:none}
  html[data-theme] body .personal .tabs{max-width:100%;overflow-x:auto}
  html[data-theme] body .personal .tabs button{flex:none;padding:3px 10px}
  html[data-theme] body .quick-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
  html[data-theme] body .quick-link{flex-direction:column;gap:3px;padding:6px 1px;background:none;font-size:11px}
  html[data-theme] body .quick-link>span:last-child{max-width:100%}
  html[data-theme] body .zone{padding:10px 10px 11px}
  html[data-theme] body .zone-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  html[data-theme] body .zone .resource-card{display:flex;flex-flow:row nowrap;align-items:center;min-height:54px;padding:8px;gap:8px}
  html[data-theme] body .zone .resource-copy{flex:1 1 0;width:auto;min-width:0;padding-right:0;grid-column:auto}
  html[data-theme] body .zone .resource-card .site-icon{flex:none;margin:0}
  html[data-theme] body .zone .resource-card .site-icon{width:28px;height:28px}
  html[data-theme] body .zone .resource-copy a{font-size:12px}
  html[data-theme] body .zone .resource-copy p{font-size:10px}
}