/* Scoped tool styles (home.css); every rule is limited to .tools-page so it never touches the site chrome. */
.tools-page .home-hero{text-align:center;
    padding:64px 20px 30px;}
.tools-page .home-hero h1{font-size:46px;
    font-weight:700;
    color:var(--ink);
    margin-bottom:14px;
    line-height:1.12;}
.tools-page .home-hero h1 span{background:var(--primary);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;}
.tools-page .home-hero p{max-width:620px;
    margin:0 auto;
    color:var(--slate-dark);
    font-size:18px;
    line-height:1.6;}
.tools-page .home-layout{max-width:1200px;
    margin:0 auto;
    padding:20px 20px 70px;
    display:flex;
    gap:32px;
    align-items:flex-start;}
.tools-page .home-main{flex:1; min-width:0;}
.tools-page .home-sidebar{width:300px;
    flex:0 0 300px;
    position:sticky;
    top:24px;
    display:flex;
    flex-direction:column;
    gap:24px;}
.tools-page .tool-group{background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    overflow:hidden;
    margin-bottom:28px;
    box-shadow:var(--shadow-sm);}
.tools-page .tool-group-head{background:var(--primary);
    color:#fff;
    padding:16px 24px;
    display:flex;
    align-items:center;
    gap:11px;}
.tools-page .tool-group-head h2{font-size:19px;
    font-weight:600;
    margin:0;
    display:flex;
    align-items:center;
    gap:8px;}
.tools-page .tool-group-head .group-emoji{display:flex; align-items:center; justify-content:center; width:24px; height:24px;}
.tools-page .tool-group-head .group-emoji svg{width:22px; height:22px; stroke-width:2;}
.tools-page .tool-cards{display:grid;
    grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
    gap:20px;
    padding:24px;}
.tools-page .tool-card{display:flex;
    flex-direction:column;
    align-items:flex-start;
    text-align:left;
    gap:10px;
    background:var(--panel);
    border:1px solid var(--line);
    border-radius:14px;
    padding:20px;
    text-decoration:none;
    transition:transform .2s,box-shadow .2s,border-color .2s,background .2s;}
.tools-page .tool-card:hover{transform:translateY(-4px);
    background:#fff;
    box-shadow:0 14px 28px rgba(91,90,196,.16);
    border-color:var(--primary-border);}
.tools-page .tool-card-icon{width:58px;
    height:58px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:15px;
    background:var(--primary-light);
    color:var(--primary);}
.tools-page .tool-card-icon svg{width:28px;
    height:28px;
    stroke-width:1.5;}
.tools-page .tool-card-title{font-size:16px;
    font-weight:700;
    color:var(--ink);
    line-height:1.3;}
.tools-page .tool-card-desc{font-size:13.5px;
    color:var(--slate);
    line-height:1.45;}
.tools-page .tool-card-cta{font-size:13px;
    font-weight:700;
    color:var(--primary);
    margin-top:auto;}
.tools-page .ad-box{background:var(--panel-2);
    border:1px dashed var(--line-strong);
    border-radius:16px;
    min-height:250px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:var(--slate-light);
    font-size:13px;
    font-weight:600;
    letter-spacing:.06em;
    text-transform:uppercase;
    padding:16px;}
.tools-page .ad-box.ad-tall{min-height:360px;}
.tools-page .sidebar-card{background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    overflow:hidden;
    box-shadow:var(--shadow-sm);}
.tools-page .sidebar-card h3{margin:0;
    padding:15px 20px;
    font-size:15px;
    font-weight:700;
    color:#fff;
    background:var(--primary);
    display:flex;
    align-items:center;
    gap:8px;}
.tools-page .popular-list{list-style:none;
    margin:0;
    padding:6px 0;}
.tools-page .popular-list li a{display:flex;
    align-items:center;
    gap:10px;
    padding:11px 20px;
    text-decoration:none;
    color:var(--ink-2);
    font-size:14.5px;
    font-weight:500;
    transition:background .18s,color .18s;}
.tools-page .popular-list li a:hover{background:var(--primary-light);
    color:var(--primary);}
.tools-page .popular-list .rank{color:var(--slate-light);
    font-weight:700;
    font-size:13px;
    min-width:16px;}
@media(max-width:900px){.tools-page .home-layout{flex-direction:column;}
.tools-page .home-sidebar{width:100%; flex:none; position:static;}
}
@media(max-width:600px){.tools-page .home-hero h1{font-size:34px;}
.tools-page .tool-cards{grid-template-columns: 1fr;}
}
.tools-page .tool-group{padding:0 0 4px;}