@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;600;700;800&display=swap');
:root{--bg:#f8f8f5;--paper:#fff;--ink:#262c29;--muted:#83877f;--line:#e9ebe4;--orange:#e96139;--sidebar:226px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans','Noto Sans SC',sans-serif;font-size:14px;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #e9613970;outline-offset:4px}button{border:0;background:none}button svg{flex-shrink:0}button,a{touch-action:manipulation}[hidden]{display:none!important}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:#fff;border-right:1px solid var(--line);padding:33px 20px 20px;display:flex;flex-direction:column;z-index:30}.brand{display:flex;gap:11px;align-items:center;padding-left:7px}.brand>span{font-weight:800;font-size:22px;letter-spacing:-1px}.brand small{display:block;font-size:10px;font-weight:500;letter-spacing:3px;margin-top:2px;color:#92948c}.side-label{font-size:10px;letter-spacing:1.5px;color:#9a9e95;margin:43px 13px 14px}.nav-item{width:100%;display:flex;align-items:center;gap:12px;padding:12px 13px;border-radius:7px;text-align:left;font-size:12px;transition:background .15s;margin-bottom:4px;color:#696e65}.nav-item:hover{background:#f7f7f2}.nav-item.active{background:#fff0e9;color:var(--orange);font-weight:600}.nav-item svg{width:17px;height:17px}.nav-dot{margin-left:auto;width:5px;height:5px;background:var(--orange);border-radius:50%}.count{margin-left:auto;color:#a4a79f;font-size:10px}.category-label{display:flex;justify-content:space-between;margin-top:28px}.sidebar-bottom{margin-top:auto;padding:26px 12px 2px;color:#757c6e}.little-globe{font-size:35px;color:#8e9e80;line-height:1;margin-bottom:15px}.sidebar-bottom b{font-size:11px;font-weight:500}.sidebar-bottom p{font-size:10px;line-height:1.9;color:#969c8e}.sidebar-bottom button{padding:15px 0 0;border-top:1px solid var(--line);font-size:10px;width:100%;text-align:left;margin-top:12px}.sidebar-bottom button span{float:right}.page{margin-left:var(--sidebar)}.topbar{height:77px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 44px;background:#ffffff70}.breadcrumb{font-size:11px;color:#969b91;display:flex;gap:14px}.breadcrumb b{font-weight:500;color:#53594f}.header-right{display:flex;gap:25px;align-items:center;font-size:11px}.curated{color:#858c7e;display:flex;align-items:center;gap:7px}.curated i{width:5px;height:5px;border-radius:50%;background:#879f70}.header-save{display:flex;align-items:center;gap:7px;border-left:1px solid var(--line);padding-left:23px;font-size:11px}.header-save svg{width:15px}main{max-width:1450px;margin:auto;padding:0 44px}.hero{display:flex;position:relative;min-height:331px;align-items:center;justify-content:space-between;padding:41px 5px 33px;overflow:hidden}.hero-copy{position:relative;z-index:2}.eyebrow{font-size:9px;font-weight:600;letter-spacing:2px;display:flex;align-items:center;gap:8px;color:#7f8877}.eyebrow>span{width:5px;height:5px;background:var(--orange);border-radius:100%}h1{font-size:46px;line-height:1.43;letter-spacing:-1.6px;font-weight:700;margin:19px 0 14px;position:relative}h1>span{color:var(--orange)}h1 svg{position:absolute;width:160px;height:16px;left:5px;bottom:-10px;fill:none;stroke:#efaa87;stroke-width:2.5}.hero-copy>p{font-size:12px;line-height:2;color:#858b80;margin:19px 0}.hero-meta{display:flex;gap:15px;align-items:center;color:#999e93;font-size:10px}.hero-meta b{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600;color:#5b6554;margin-right:3px}.hero-meta i{height:9px;width:1px;background:#dedfd6}.hero-art{width:390px;height:285px;position:relative;flex-shrink:0;margin-right:15px;background:radial-gradient(ellipse,#eeeedd60,transparent 68%)}.orbit{position:absolute;border:1px solid #e4e7dc;border-radius:50%;left:45px;top:35px;width:310px;height:205px;transform:rotate(-26deg)}.orbit-two{transform:rotate(28deg);width:290px;left:55px;border-style:dashed}.floating-tile{position:absolute;background:#fff;border:1px solid #e7e8e0;border-radius:18px;box-shadow:0 12px 20px #494d2a08;display:flex;align-items:center;justify-content:center}.tile-one{width:85px;height:85px;left:35px;top:97px;transform:rotate(-13deg);color:#4b8977;font-size:60px}.tile-two{width:100px;height:110px;left:161px;top:25px;transform:rotate(12deg);font-family:Georgia,serif;font-size:66px;flex-direction:column;line-height:1.1}.tile-two span,.tile-four span{font-family:'DM Sans',sans-serif;font-size:7px;letter-spacing:2px;color:#94988e}.tile-three{width:75px;height:83px;right:3px;top:121px;transform:rotate(14deg);display:grid;grid-template-columns:19px 19px;grid-template-rows:19px 19px 19px;align-content:center;justify-content:center;gap:0}.tile-three i{width:19px;height:19px;background:#f27860;border-radius:11px 0 0 11px}.tile-three i:nth-child(2){background:#ef9a89;border-radius:0 11px 11px 0}.tile-three i:nth-child(3){background:#ad8add}.tile-three i:nth-child(4){background:#66b8d0;border-radius:50%}.tile-three i:nth-child(5){background:#7ebc91;border-radius:11px 0 11px 11px}.tile-four{width:83px;height:83px;left:163px;bottom:9px;transform:rotate(-9deg);background:#eee9dc;color:#71654f;font-size:35px;font-family:Georgia,serif;flex-direction:column;gap:5px}.tile-five{width:47px;height:47px;right:23px;top:45px;border-radius:11px;transform:rotate(17deg);font-size:26px;color:#a69a84;background:#f3f0e6}.art-plus{position:absolute;top:28px;left:60px;color:#b4c0a4;font-size:28px}.art-spark{position:absolute;right:40px;bottom:18px;font-size:30px;color:#e3a071}.art-caption{position:absolute;bottom:6px;left:-6px;transform:rotate(-6deg);font-size:7px;letter-spacing:1px;color:#89937b}.art-caption span{color:var(--orange);font-size:15px;margin-right:5px}.search-zone{margin:8px 0 28px}.search-box{display:flex;align-items:center;gap:15px;background:#fff;border:1px solid #dfe3d6;border-radius:11px;padding:7px 8px 7px 20px;box-shadow:0 4px 16px #3b4d2804}.search-box>span{display:flex;color:#929b88}.search-box input{min-width:0;flex:1;border:0;outline:0;background:none;padding:11px 0;font-size:12px;color:var(--ink)}.search-box:focus-within{border-color:#df9c7f;box-shadow:0 0 0 3px #e961390c}.search-box input::placeholder{color:#a0a496}.search-box kbd{color:#acafa5;border:1px solid #eceee5;border-radius:4px;padding:2px 7px;background:#f9faf6;font-size:11px}.search-box>button{background:var(--orange);color:#fff;padding:12px 19px;border-radius:7px;font-size:11px}.search-box>button:hover{background:#d84f2c}.search-box>button span{margin-left:18px}.search-hints{display:flex;align-items:center;gap:14px;padding:13px 2px 0;font-size:10px;color:#a2a79a}.search-hints button{color:#78816f;font-size:10px;padding:2px 0}.search-hints button:hover{color:var(--orange)}.collections{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:43px}.collection{display:flex;justify-content:space-between;align-items:center;text-align:left;padding:22px 20px;border-radius:10px;overflow:hidden;border:1px solid #00000003;transition:transform .2s;min-height:132px}.collection:hover{transform:translateY(-3px)}.lavender{background:#eeedf6}.peach{background:#f7eee5}.green{background:#ebf0e4}.collection small{font-size:8px;letter-spacing:1.4px;opacity:.53}.collection h2{font-size:17px;font-weight:600;letter-spacing:.2px;margin:10px 0 8px}.collection p{font-size:9px;margin:0;color:#85847f}.collection p span{margin-left:7px}.collection-art{font-size:70px;color:#a59bbf;margin-left:10px;line-height:1;transform:rotate(14deg);font-family:Georgia,serif}.paper-art{font-size:63px;color:#c1a98b;transform:rotate(-15deg)}.green .collection-art{color:#8da078}.section-heading{display:flex;justify-content:space-between;gap:12px;align-items:center}.muted{font-size:8px;letter-spacing:1.8px;color:#9ca38f}.section-heading h2{font-size:22px;letter-spacing:-.5px;margin:10px 0 0;font-weight:600}.section-heading h2>span{font-size:10px;font-weight:400;color:#969e8c;letter-spacing:0;margin-left:12px;white-space:nowrap}.view-controls{display:flex;align-items:center;gap:9px;font-size:10px;color:#9da391}.sort-label{display:flex;align-items:center;gap:8px;white-space:nowrap}select{background:white;border:1px solid #e4e7dc;border-radius:5px;padding:7px;color:#68725e;font-size:10px;cursor:pointer}.reset{color:var(--orange);font-size:11px}.filter-row{display:flex;gap:6px;padding:22px 0 23px;flex-wrap:wrap;border-bottom:1px solid var(--line)}.filter{font-size:10px;color:#848d7b;padding:8px 12px;border-radius:6px;white-space:nowrap}.filter:hover{background:#eeefe8}.filter.active{background:#303c2b;color:white}.category-section{margin:25px 0 34px}.category-heading{display:flex;gap:10px;align-items:center;margin-bottom:17px}.category-symbol{display:flex;color:#6c785f}.category-symbol svg{width:17px;height:17px}.category-heading h3{font-size:15px;margin:0;font-weight:600;white-space:nowrap}.category-heading h3 span{font-size:10px;color:#a6ac9b;font-weight:400;margin-left:10px}.category-heading p{font-size:10px;color:#9ca28f;margin:0 0 0 4px}.category-en{margin-left:auto;font-size:8px;letter-spacing:1px;color:#b2b7a9}.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.tool-card{background:#fff;border:1px solid #e8ebe1;border-radius:10px;padding:20px 19px 15px;display:flex;flex-direction:column;min-height:190px;transition:transform .18s,border-color .18s,box-shadow .18s}.tool-card:hover{transform:translateY(-3px);border-color:#d6dccc;box-shadow:0 8px 22px #52613b08}.card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:5px}.tool-identity{display:flex;gap:12px;align-items:center;min-width:0}.tool-logo{width:39px;height:39px;background:var(--brand);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px;letter-spacing:-1px;font-weight:600;flex-shrink:0}.tool-identity h3{font-size:14px;font-weight:600;letter-spacing:-.1px;margin:0 0 4px}.tool-identity small{font-size:9px;color:#a8ac9f}.save-button{color:#c1c8b7;padding:2px;display:flex;min-width:28px;min-height:30px;justify-content:center;align-items:center}.save-button svg{width:18px;height:18px}.save-button:hover,.save-button.saved{color:var(--orange)}.save-button.saved svg{fill:#fce4d8}.tool-card>p{font-size:11px;line-height:1.95;color:#868e7e;margin:16px 0 20px;flex:1}.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:5px}.tags{display:flex;gap:5px;flex-wrap:wrap}.tags button{background:#f4f5f0;color:#929b86;padding:3px 6px;border-radius:4px;font-size:8px}.tags button:hover{color:var(--orange)}.visit{font-size:9px;color:#869379;white-space:nowrap}.visit span{font-size:14px;margin-left:3px}.visit:hover{color:var(--orange)}.closing{margin:45px 0 35px;padding:24px 28px;border-radius:10px;background:#eff1e9;display:flex;align-items:center;gap:22px}.closing>span{font-size:40px;color:#839570}.closing h2{font-size:15px;font-weight:500;margin:0 0 7px}.closing p{font-size:10px;color:#8b967f;margin:0}.closing button{margin-left:auto;border:1px solid #d2dac8;border-radius:6px;font-size:10px;padding:10px 13px;color:#758667;white-space:nowrap}.closing button span{margin-left:8px}footer{border-top:1px solid var(--line);padding:25px 44px;display:flex;justify-content:space-between;align-items:center;gap:15px;color:#a2a899;font-size:8px}.footer-brand{font-size:14px;font-weight:700;color:#59654e}.footer-brand span{font-size:9px;font-weight:400;margin-left:7px}footer b{color:var(--orange);font-size:13px;margin-left:5px}.mobile-only{display:none}.empty{text-align:center;padding:75px 20px;color:#8c957f}.empty>svg{width:34px;height:34px;color:#b2bca6}.empty h3{font-size:19px;font-weight:500;color:#56624a}.empty p{font-size:12px}.empty button{margin-top:17px;background:var(--orange);border-radius:6px;color:white;padding:11px 18px}.directory{scroll-margin-top:20px}.search-zone:first-child{margin-top:30px}body:has(.hero[hidden]) .search-zone{margin-top:32px}dialog{border:1px solid var(--line);border-radius:15px;padding:40px;max-width:520px;width:calc(100% - 32px);color:var(--ink);box-shadow:0 25px 80px #0002}dialog::backdrop{background:#25302066;backdrop-filter:blur(3px)}dialog p{font-size:13px;line-height:2;color:#7f8775}#close-about{position:absolute;right:15px;top:10px;font-size:26px}.toast{position:fixed;bottom:25px;left:calc(50% + 80px);transform:translate(-50%,20px);background:#303c2b;color:white;padding:12px 23px;border-radius:8px;box-shadow:0 7px 25px #0002;z-index:80;opacity:0;pointer-events:none;transition:.2s;font-size:12px}.toast.visible{opacity:1;transform:translate(-50%,0)}.skip{position:fixed;top:-60px;left:20px;z-index:100;background:white;padding:15px}.skip:focus{top:10px}
@media(min-width:1500px){:root{--sidebar:248px}main{padding:0 60px}.hero{min-height:360px}.hero-art{margin-right:60px}.tool-card{min-height:205px}.tool-card>p{font-size:12px}}
@media(max-width:1150px){:root{--sidebar:205px}main{padding:0 28px}.topbar{padding:0 28px}.hero-art{width:310px;transform:scale(.85);transform-origin:right center;margin-left:-45px;margin-right:0}.hero h1{font-size:39px}.collection{padding:18px 14px}.collection-art{font-size:49px}.collection h2{font-size:15px}.collection p{font-size:8px}.category-en{display:none}.tool-card{padding:16px 13px}.tool-logo{width:33px;height:33px;font-size:17px}.tool-identity{gap:9px}.tool-identity h3{font-size:12px}.visit{font-size:8px}.tags button{font-size:7px}.filter{padding:7px 8px}}
@media(max-width:950px){.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-art{opacity:.7;width:230px;margin-left:-90px;transform:scale(.7)}.hero-copy>p{font-size:11px}.hero h1{font-size:37px}.collections{gap:10px}.collection-art{display:none}.collection small{font-size:7px}.category-heading p{display:none}.closing{padding:20px 17px;gap:12px}.closing h2{font-size:12px}.closing p{font-size:9px}footer{padding:23px 28px;flex-wrap:wrap}footer>span:last-child{display:none}}
@media(max-width:700px){:root{--sidebar:0px}.sidebar{width:230px;transform:translateX(-100%);transition:transform .2s;top:62px;box-shadow:12px 10px 30px #0001;padding-top:22px}.sidebar.open{transform:translateX(0)}.sidebar-bottom{display:none}.brand{margin-bottom:0}.side-label{margin-top:24px}.page{margin:0}.topbar{height:62px;padding:0 20px;gap:12px;position:relative;z-index:40;background:#fff}.mobile-only{display:flex;padding:0}.breadcrumb{margin-right:auto}.curated{display:none}.header-save{border:0;padding:0;font-size:10px}.header-right{gap:0}main{padding:0 20px}.hero{min-height:300px;padding:30px 0;overflow:hidden}.hero h1{font-size:37px}.hero .eyebrow{font-size:7px;letter-spacing:1.4px}.hero-art{position:absolute;right:-45px;top:10px;opacity:.35;transform:scale(.65);width:280px}.hero-copy{width:100%}.hero-copy>p{font-size:11px;color:#78816e}.hero-meta{font-size:9px;gap:10px}.search-box{padding-left:12px;gap:9px}.search-box input{font-size:11px}.search-box kbd{display:none}.search-box>button{padding:12px;font-size:10px;white-space:nowrap}.search-box>button span{display:none}.search-hints{gap:11px;flex-wrap:wrap;font-size:9px}.search-hints button{font-size:9px}.collections{grid-template-columns:1fr;gap:10px;margin-bottom:32px}.collection{min-height:92px;padding:15px 20px}.collection-art{display:block;font-size:50px}.collection h2{margin:5px 0;font-size:16px}.collection p{font-size:10px}.collection small{font-size:8px}.section-heading{align-items:flex-end}.section-heading h2{font-size:18px;line-height:1.6}.section-heading h2>span{font-size:9px;margin-left:8px}.sort-label{font-size:0;gap:0}.sort-label select{font-size:9px}.view-controls{flex-direction:column;align-items:flex-end}.filter-row{flex-wrap:nowrap;overflow:auto;margin-right:-20px;padding-right:20px;scrollbar-width:none;padding-top:18px;padding-bottom:16px}.filter{padding:8px 11px}.category-heading h3{font-size:14px}.tool-grid{gap:11px}.tool-card{padding:15px 12px;min-height:203px}.tool-logo{width:30px;height:30px;border-radius:8px;font-size:14px}.tool-identity{gap:8px;align-items:flex-start}.tool-identity h3{font-size:11px;word-break:break-word}.tool-identity small{font-size:7px;overflow-wrap:anywhere}.tool-card>p{font-size:10px;margin:13px 0 16px;line-height:1.9}.card-bottom{flex-wrap:wrap;gap:8px}.tags button{font-size:8px}.visit{font-size:9px;margin-left:auto}.save-button{min-width:19px;padding:0}.save-button svg{width:13px}.closing{flex-wrap:wrap}.closing button{margin-left:50px}.closing>span{font-size:30px}.closing h2{font-size:12px}.closing p{font-size:9px}footer{padding:22px 20px;gap:12px}footer>span{width:100%;font-size:8px}.toast{left:50%;max-width:90%;white-space:nowrap}}
@media(max-width:370px){.tool-grid{grid-template-columns:1fr}.tool-card{min-height:170px}.tool-identity h3{font-size:14px}.hero h1{font-size:33px}.hero-meta{gap:7px}.search-box input{font-size:10px}.section-heading h2>span{display:block;margin-left:0}.closing h2{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Readability pass: keep secondary information comfortably legible. */
:root{--sidebar:248px;--muted:#697166}
body{font-size:17px}
.brand small{font-size:13px;color:#747a71}
.side-label{font-size:13px;color:#747c70}
.nav-item{font-size:15px;line-height:1.35;padding-top:13px;padding-bottom:13px;color:#545c52}
.count{font-size:13px;color:#7e867a}
.sidebar-bottom b{font-size:14px}
.sidebar-bottom p{font-size:13px;line-height:1.75;color:#70796c}
.sidebar-bottom button{font-size:13px}
.breadcrumb,.header-right,.header-save{font-size:14px}
.breadcrumb,.curated{color:#697166}
.eyebrow{font-size:12px;color:#697365}
.hero-copy>p{font-size:16px;line-height:1.85;color:#60695e}
.hero-meta{font-size:13px;color:#6d756a}
.hero-meta b{font-size:16px}
.tile-two span,.tile-four span,.art-caption{font-size:10px}
.search-box input{font-size:16px}
.search-box kbd,.search-box>button{font-size:14px}
.search-hints,.search-hints button{font-size:13px;color:#687263}
.collection small{font-size:11px;opacity:.7}
.collection h2{font-size:22px}
.collection p{font-size:14px;color:#656b64}
.muted{font-size:11px;color:#727b6e}
.section-heading h2{font-size:27px}
.section-heading h2>span{font-size:13px;color:#747c70}
.view-controls,select,.reset{font-size:13px}
.filter{font-size:13px;color:#667060;padding:9px 13px}
.category-heading h3{font-size:19px}
.category-heading h3 span{font-size:13px;color:#747d70}
.category-heading p{font-size:14px;color:#6c7568}
.category-en{font-size:11px;color:#7a8276}
.tool-card{min-height:245px;padding:22px 21px 18px}
.tool-identity h3{font-size:18px}
.tool-identity small{font-size:12px;color:#737b70}
.tool-card>p{font-size:15px;line-height:1.75;color:#626b5f}
.tags button{font-size:12px;color:#6e7869;padding:5px 8px}
.visit{font-size:13px;color:#64725c}
.closing h2{font-size:19px}
.closing p,.closing button{font-size:13px;color:#64705e}
footer{font-size:12px;color:#747d70}
.footer-brand{font-size:17px}
.footer-brand span{font-size:12px}
.empty p,.toast{font-size:15px}

@media(max-width:1150px){
  :root{--sidebar:225px}
  .tool-identity h3{font-size:16px}
  .tool-card>p{font-size:14px}
  .tags button{font-size:11px}
  .visit{font-size:12px}
  .collection h2{font-size:19px}
  .collection p{font-size:13px}
}
@media(max-width:700px){
  :root{--sidebar:0px}
  .header-save{font-size:13px}
  .hero .eyebrow{font-size:10px}
  .hero-copy>p{font-size:15px;line-height:1.75}
  .hero-meta{font-size:12px}
  .search-box input{font-size:14px}
  .search-box>button{font-size:13px}
  .search-hints,.search-hints button{font-size:12px}
  .collection small{font-size:10px}
  .collection h2{font-size:19px}
  .collection p{font-size:13px}
  .section-heading h2{font-size:22px}
  .section-heading h2>span{font-size:12px}
  .sort-label select{font-size:12px}
  .filter{font-size:13px}
  .category-heading h3{font-size:18px}
  .tool-grid{grid-template-columns:1fr}
  .tool-card{min-height:200px;padding:20px 18px}
  .tool-logo{width:38px;height:38px;font-size:17px}
  .tool-identity h3{font-size:17px}
  .tool-identity small{font-size:12px}
  .tool-card>p{font-size:15px;line-height:1.75}
  .tags button{font-size:12px}
  .visit{font-size:13px}
  .closing h2{font-size:17px}
  .closing p,.closing button{font-size:13px}
  footer,footer>span{font-size:12px}
}