body.toolbox-site { color: var(--tb-ink); background: var(--tb-rice); }

/* Navigation belongs to the dark visual stage without depending on any tool. */
.toolbox-navbar { color: rgba(255,253,247,.84); }
.toolbox-navbar.is-scrolled, .toolbox-navbar.is-open { border-bottom-color: rgba(232,218,180,.14); background: rgba(8,18,30,.82); }
.toolbox-brand-mark { color: #17202b; background: linear-gradient(145deg, #f1d697, #bd8b3f); box-shadow: 0 7px 24px rgba(201,155,76,.2); }
.toolbox-brand small, .toolbox-desktop-nav a, .toolbox-login-link, .toolbox-nav-admin, .toolbox-desktop-logout button { color: rgba(255,253,247,.58); }
.toolbox-desktop-nav a:hover, .toolbox-desktop-nav a.active { color: #fff9e9; background: rgba(255,255,255,.08); }
.toolbox-user-chip { border-color: rgba(255,255,255,.13); background: rgba(255,255,255,.07); }
.toolbox-user-chip span { color: #15202c; background: #dbb568; }
.toolbox-user-chip b { color: #fff9e9; }
.toolbox-menu-button { background: rgba(255,255,255,.09); }
.toolbox-menu-button span { border-color: #fff7e5; }
.toolbox-mobile-nav { color: var(--tb-ink); background: rgba(249,246,238,.98); border-color: rgba(42,52,48,.12); }
.toolbox-site .toolbox-button-gold { color: #17202b; background: linear-gradient(135deg, #f2d995, #c99b4c); box-shadow: 0 12px 35px rgba(199,149,66,.2); }
.toolbox-site .toolbox-button-ghost { color: #f8f1df; border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.055); backdrop-filter: blur(12px); }
.toolbox-site .toolbox-button-light { color: #141b20; }
.toolbox-navbar .toolbox-button-dark { color: #17202b; background: linear-gradient(135deg, #efd28d, #c7984a); }

/* Immersive but compact first screen. */
.toolbox-hero {
  position: relative;
  min-height: 700px;
  padding: calc(var(--tb-nav-height) + 34px) 0 88px;
  display: grid;
  align-items: center;
  overflow: hidden;
  color: #f8f1df;
  background: var(--tb-night);
  isolation: isolate;
}
.hero-mesh { position: absolute; inset: 0; z-index: -5; background: radial-gradient(circle at 75% 28%, rgba(68,120,117,.52), transparent 34%), radial-gradient(circle at 28% 78%, rgba(126,57,67,.31), transparent 35%), radial-gradient(circle at 52% 110%, rgba(179,129,61,.2), transparent 42%), linear-gradient(125deg, #08111f 5%, #14263a 45%, #231a30 100%); }
.hero-mesh::after { content: ""; position: absolute; inset: 0; opacity: .28; background: repeating-linear-gradient(105deg, transparent 0 72px, rgba(224,196,133,.025) 73px 74px); }
.hero-grain { position: absolute; inset: 0; z-index: -1; opacity: .12; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; }
.hero-ink { position: absolute; z-index: -3; width: 44vw; aspect-ratio: 1.35; border-radius: 44% 56% 58% 42% / 48% 35% 65% 52%; opacity: .32; filter: blur(46px); will-change: transform, opacity; }
.hero-ink-one { left: -11%; top: 18%; background: #1e5155; animation: ink-drift-one 24s ease-in-out infinite alternate; }
.hero-ink-two { right: 1%; bottom: -28%; background: #6f3445; animation: ink-drift-two 29s ease-in-out infinite alternate; }
.toolbox-hero-inner { width: min(var(--tb-max), calc(100% - 48px)); margin: auto; display: grid; grid-template-columns: .82fr 1.18fr; align-items: center; gap: clamp(24px, 4.5vw, 70px); }
.toolbox-hero-copy { position: relative; z-index: 3; max-width: 530px; transform: translate3d(0, var(--hero-scroll-y, 0), 0); opacity: var(--hero-scroll-opacity, 1); }
.hero-kicker { display: inline-flex; align-items: center; gap: 10px; color: #dbc078; font-size: 10px; font-weight: 760; letter-spacing: .16em; }
.hero-kicker i { width: 28px; border-top: 1px solid currentColor; }
.toolbox-hero h1 { margin: 19px 0 18px; color: #fffaf0; font-size: clamp(50px, 5.4vw, 66px); font-weight: 720; line-height: 1.02; letter-spacing: -.055em; }
.toolbox-hero h1 em { color: #e0b761; font-style: normal; text-shadow: 0 0 38px rgba(224,183,97,.12); }
.toolbox-hero-copy > p { max-width: 480px; margin: 0; color: rgba(245,239,222,.66); font-size: 17px; line-height: 1.78; }
.hero-actions { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 10px; }
.hero-note { margin-top: 19px; display: flex; align-items: center; gap: 9px; color: rgba(245,239,222,.47); font-size: 10px; letter-spacing: .05em; }
.hero-note span { width: 6px; height: 6px; border-radius: 50%; background: #d6b366; box-shadow: 0 0 0 5px rgba(214,179,102,.08); }
.hero-scroll-cue { position: absolute; left: 50%; bottom: 42px; z-index: 4; width: 26px; height: 42px; display: grid; place-items: start center; border: 1px solid rgba(255,255,255,.16); border-radius: 99px; }
.hero-scroll-cue span { width: 3px; height: 7px; margin-top: 8px; border-radius: 4px; background: #d9b86d; animation: scroll-cue 2.4s ease-in-out infinite; }

/* Layered SVG artwork: halo, ink mountains, flying figure, ribbons and clouds. */
.hero-artwork { position: relative; min-width: 0; height: 510px; transform: translate3d(0, var(--hero-art-scroll-y, 0), 0); opacity: var(--hero-art-scroll-opacity, 1); }
.art-halo { position: absolute; left: 50%; top: 47%; width: min(430px, 65%); aspect-ratio: 1; border: 1px solid rgba(229,194,112,.24); border-radius: 50%; transform: translate3d(calc(-50% + var(--layer-x, 0px)), calc(-50% + var(--layer-y, 0px)), 0); box-shadow: 0 0 85px rgba(211,168,83,.11), inset 0 0 60px rgba(89,144,136,.08); }
.art-halo::before, .art-halo::after { content: ""; position: absolute; border-radius: inherit; }
.art-halo::before { inset: 10%; border: 1px solid rgba(226,188,104,.17); }
.art-halo::after { inset: 24%; background: radial-gradient(circle, rgba(218,178,91,.16), transparent 67%); }
.art-halo i, .art-halo b { position: absolute; inset: -7%; border-radius: inherit; border: 1px dashed rgba(150,192,178,.13); animation: halo-turn 34s linear infinite; }
.art-halo b { inset: 17%; border-color: rgba(230,193,111,.15); animation-duration: 25s; animation-direction: reverse; }
.art-scene { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.art-scene [data-parallax-depth] { transform: translate3d(var(--layer-x, 0px), var(--layer-y, 0px), 0); will-change: transform; }
.art-stars { fill: #edc973; }
.art-stars circle { transform-box: fill-box; transform-origin: center; animation: star-breathe 5s ease-in-out infinite alternate; }
.art-stars circle:nth-child(3n) { animation-delay: -2s; }.art-stars circle:nth-child(2n) { animation-duration: 7s; }
.art-cloud { fill: rgba(128,178,165,.14); stroke: rgba(173,205,192,.24); stroke-width: 1; }
.art-cloud-front { fill: rgba(220,210,174,.18); stroke: rgba(231,211,159,.25); }
.art-mountains path:first-child { fill: rgba(20,51,61,.72); }.art-mountains path:last-child { fill: rgba(46,74,77,.43); }
.art-ribbon { fill: none; stroke: url(#ribbonJade); stroke-width: 9; stroke-linecap: round; opacity: .47; }
.art-ribbon path { stroke-dasharray: 12 8; animation: ribbon-flow 16s linear infinite; }
.art-feitian { transform: translate3d(var(--layer-x, 0px), var(--layer-y, 0px), 0); transform-box: fill-box; transform-origin: center; animation: feitian-float 9s ease-in-out infinite; }
.art-figure-glow { fill: rgba(219,174,85,.14); filter: url(#softGlow); }
.art-head-halo { fill: none; stroke: rgba(239,204,126,.5); stroke-width: 2; stroke-dasharray: 3 7; }
.art-hair { fill: #282334; }.art-head { fill: #ddb874; }.art-body, .art-skirt { fill: url(#figureFill); }
.art-sleeve { fill: none; stroke: #d9aa62; stroke-width: 28; stroke-linecap: round; opacity: .94; }
.art-arm { fill: none; stroke: #edcb8b; stroke-width: 7; stroke-linecap: round; }
.art-ribbon-front { fill: none; stroke: url(#ribbonGold); stroke-width: 13; stroke-linecap: round; opacity: .9; transform-box: fill-box; transform-origin: center; animation: ribbon-sway 13s ease-in-out infinite alternate; }
.art-ribbon-front.secondary { stroke: url(#ribbonJade); stroke-width: 9; opacity: .72; animation-duration: 17s; animation-direction: alternate-reverse; }
.art-caption { position: absolute; right: 7%; bottom: 5%; color: rgba(237,207,141,.44); font-size: 9px; letter-spacing: .22em; writing-mode: vertical-rl; }

/* The first tool row peeks into the opening screen. */
.toolbox-tools-section { position: relative; z-index: 5; width: min(calc(var(--tb-max) + 52px), calc(100% - 28px)); margin-top: -48px; padding: 58px 26px 78px; border-radius: 28px 28px 0 0; background: linear-gradient(180deg, rgba(248,245,237,.98), var(--tb-rice) 72%); box-shadow: 0 -22px 70px rgba(2,12,22,.16); }
.toolbox-section-heading { display: grid; grid-template-columns: 1fr .72fr; align-items: end; gap: 48px; }
.section-kicker { color: #9a6b31; font-size: 10px; font-weight: 800; letter-spacing: .17em; }
.toolbox-section-heading h2, .about-statement h2 { margin: 9px 0 0; font-size: clamp(36px, 4.2vw, 54px); line-height: 1.07; letter-spacing: -.05em; }
.toolbox-section-heading > p { max-width: 450px; margin: 0 0 5px; color: var(--tb-muted); font-size: 14px; line-height: 1.75; }
.category-grid { margin-top: 30px; }
.category-card { position: relative; min-height: 152px; padding: 25px 28px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 22px; overflow: hidden; color: #f8f2e5; border: 1px solid rgba(239,207,137,.18); border-radius: 22px; background: radial-gradient(circle at 82% 15%, rgba(209,119,151,.26), transparent 30%), radial-gradient(circle at 16% 120%, rgba(81,165,155,.27), transparent 38%), linear-gradient(125deg, #15162a, #27203b 58%, #16333b); box-shadow: 0 17px 44px rgba(30,31,43,.12); isolation: isolate; transition: transform .35s var(--tb-ease), border-color .35s ease; }
.category-card::after { content: ""; position: absolute; right: 11%; top: -105%; z-index: -1; width: 290px; height: 290px; border: 1px dashed rgba(238,203,126,.18); border-radius: 50%; }
.category-card:hover { transform: translateY(-5px); border-color: rgba(239,207,137,.38); }
.category-card-visual { position: relative; width: 82px; height: 82px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.14); border-radius: 27px; background: rgba(255,255,255,.07); }
.category-card-visual i { position: absolute; inset: 13px; border: 1px solid rgba(219,184,102,.38); border-radius: 50%; animation: category-orbit 9s linear infinite; }
.category-card-visual i::after { content: ""; position: absolute; left: 50%; top: -3px; width: 6px; height: 6px; border-radius: 50%; background: #e2be6e; }
.category-card-visual b { color: #ead49b; font-size: 36px; font-weight: 400; }
.category-card-copy small, .category-card-copy strong, .category-card-copy em { display: block; }
.category-card-copy small { color: #d4af63; font-size: 8px; font-weight: 800; letter-spacing: .18em; }
.category-card-copy strong { margin-top: 5px; font-size: 28px; letter-spacing: -.04em; }
.category-card-copy em { margin-top: 3px; color: rgba(248,242,229,.6); font-size: 12px; font-style: normal; }
.category-card-arrow { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; background: rgba(255,255,255,.06); }
.category-grid + .tool-grid { margin-top: 14px; }
.tool-grid { margin-top: 34px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.tool-card { --tool-accent: var(--tb-stone-green); position: relative; min-height: 220px; padding: 20px; display: flex; flex-direction: column; overflow: hidden; color: var(--tb-ink); border: 1px solid rgba(48,68,64,.12); border-radius: var(--tb-radius-md); background: linear-gradient(145deg, rgba(255,253,247,.82), rgba(239,235,224,.58)); box-shadow: 0 12px 34px rgba(45,46,41,.035); backdrop-filter: blur(12px); isolation: isolate; transition: transform .34s var(--tb-ease), border-color .34s ease, box-shadow .34s ease; }
.tool-card-aura { position: absolute; z-index: -1; right: -50px; top: -62px; width: 155px; height: 155px; border-radius: 48% 52% 62% 38%; opacity: .12; background: radial-gradient(circle, var(--tool-accent), transparent 68%); transform: translate3d(0,0,0); transition: transform .5s var(--tb-ease), opacity .35s ease; }
.tool-card::after { content: ""; position: absolute; right: 18px; bottom: 18px; z-index: -1; width: 42px; height: 42px; border: 1px solid color-mix(in srgb, var(--tool-accent) 28%, transparent); border-radius: 50%; opacity: .28; }
.tool-card:hover { transform: translateY(-5px); border-color: color-mix(in srgb, var(--tool-accent) 42%, transparent); box-shadow: 0 18px 42px rgba(35,45,42,.09); }
.tool-card:hover .tool-card-aura { opacity: .22; transform: translate3d(-10px,9px,0) scale(1.08); }
.tool-card-disabled { cursor: default; }.tool-card-disabled:hover { transform: translateY(-3px); }
.tool-card-stone-green { --tool-accent: #557c6f; }.tool-card-cinnabar { --tool-accent: #a44f3f; }.tool-card-amber { --tool-accent: #ba8539; }.tool-card-indigo { --tool-accent: #495d81; }.tool-card-stone-blue { --tool-accent: #3f747a; }.tool-card-pindou { --tool-accent: #9d4f68; }.tool-card-sand { --tool-accent: #a98658; }.tool-card-jade { --tool-accent: #478675; }.tool-card-night { --tool-accent: #202d45; }
.tool-card-top, .tool-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.tool-card-icon { width: 43px; height: 43px; display: grid; place-items: center; color: var(--tool-accent); border: 1px solid color-mix(in srgb, var(--tool-accent) 18%, transparent); border-radius: 14px; background: color-mix(in srgb, var(--tool-accent) 8%, rgba(255,255,255,.65)); transition: transform .35s var(--tb-ease); }
.tool-card:hover .tool-card-icon { transform: scale(1.045); }.tool-card-icon svg { width: 23px; height: 23px; }
.tool-status { padding: 5px 7px; color: #7c7a72; border: 1px solid rgba(64,68,62,.08); border-radius: 999px; background: rgba(255,255,255,.42); font-size: 8px; font-weight: 760; letter-spacing: .04em; }
.tool-status-available { color: #73521e; border-color: rgba(186,133,57,.2); background: rgba(220,188,121,.17); }
.tool-card-copy { margin-top: auto; }.tool-card-copy p { margin: 0 0 5px; color: var(--tool-accent); font-size: 8px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.tool-card-copy h3 { margin: 0; font-size: 24px; letter-spacing: -.035em; }.tool-card-copy > span { margin-top: 6px; display: -webkit-box; overflow: hidden; color: #74756f; font-size: 11px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.tool-card-footer { margin-top: 16px; padding-top: 11px; color: #77776f; border-top: 1px solid rgba(36,47,44,.08); font-size: 9px; font-weight: 680; }.tool-card-footer i { font-size: 14px; font-style: normal; }
.toolbox-section-action { margin-top: 24px; text-align: right; }.toolbox-section-action a { display: inline-flex; align-items: center; gap: 8px; color: #76552d; font-size: 12px; font-weight: 750; }

.toolbox-about-section { padding: 82px 0; border-top: 1px solid var(--tb-line); }
.about-statement { max-width: 820px; }.about-grid { margin-top: 48px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.about-grid article { position: relative; padding: 19px 18px 4px 0; border-top: 1px solid rgba(45,58,54,.16); }.about-grid article > span { color: #a1763e; font-size: 9px; font-weight: 800; }
.about-grid h3 { margin: 25px 0 7px; font-size: 19px; letter-spacing: -.02em; }.about-grid p { margin: 0; color: var(--tb-muted); font-size: 12px; line-height: 1.75; }
.toolbox-closing { position: relative; width: min(var(--tb-max), calc(100% - 48px)); margin: 6px auto 76px; padding: 72px 42px; overflow: hidden; color: #f8f1df; text-align: center; border: 1px solid rgba(225,193,118,.16); border-radius: var(--tb-radius-lg); background: radial-gradient(circle at 50% 120%, rgba(151,95,61,.3), transparent 45%), radial-gradient(circle at 80% 10%, rgba(54,111,111,.24), transparent 36%), #0c1523; isolation: isolate; }
.closing-orbit { position: absolute; left: 50%; top: -140px; z-index: -1; width: 370px; height: 370px; border: 1px solid rgba(221,184,99,.13); border-radius: 50%; transform: translateX(-50%); box-shadow: 0 0 70px rgba(201,155,76,.07); }.closing-orbit::after { content: ""; position: absolute; inset: 45px; border: 1px dashed rgba(105,161,151,.12); border-radius: inherit; }
.toolbox-closing .section-kicker { color: #d6b363; }.toolbox-closing h2 { margin: 10px 0 8px; font-size: clamp(34px, 4.4vw, 54px); line-height: 1.08; letter-spacing: -.05em; }.toolbox-closing p { margin: 0 0 23px; color: rgba(248,241,223,.58); font-size: 13px; }

/* Shared catalog page uses the same visual world without duplicating the Hero. */
.tools-page-main { min-height: 100vh; padding-top: var(--tb-nav-height); background: var(--tb-rice); }
.tools-page-hero { width: 100%; margin: calc(-1 * var(--tb-nav-height)) 0 0; padding: calc(var(--tb-nav-height) + 72px) max(24px, calc((100vw - var(--tb-max)) / 2)) 94px; color: #f8f1df; background: radial-gradient(circle at 78% 20%, rgba(67,117,114,.45), transparent 31%), radial-gradient(circle at 23% 100%, rgba(142,74,66,.28), transparent 36%), #0b1423; }
.tools-page-hero .section-kicker { color: #d6b363; }.tools-page-hero h1 { max-width: 760px; margin: 12px 0 16px; font-size: clamp(45px, 5.2vw, 62px); line-height: 1.04; letter-spacing: -.055em; }.tools-page-hero p { max-width: 560px; margin: 0; color: rgba(248,241,223,.62); font-size: 15px; line-height: 1.75; }
.tools-catalog { position: relative; margin-top: -38px; padding: 38px 25px 88px; border-radius: 26px 26px 0 0; background: var(--tb-rice); }.tools-catalog-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; }.tools-catalog-heading h2 { margin: 0; font-size: 29px; letter-spacing: -.04em; }.tools-catalog-heading span { color: var(--tb-muted); font-size: 11px; }.tool-grid-catalog { margin-top: 24px; }

.toolbox-footer { width: 100%; margin: 0; padding: 48px max(24px, calc((100vw - var(--tb-max)) / 2)) 36px; color: rgba(245,239,222,.53); border-top: 1px solid rgba(226,194,116,.13); background: #09121e; }.toolbox-footer-brand { color: #f8f1df; }.toolbox-footer nav a:hover { color: #e0bd71; }

@keyframes ink-drift-one { to { transform: translate3d(38px,-18px,0) scale(1.08); opacity: .24; } }
@keyframes ink-drift-two { to { transform: translate3d(-34px,-12px,0) scale(.94); opacity: .38; } }
@keyframes halo-turn { to { transform: rotate(360deg); } }
@keyframes feitian-float { 50% { transform: translate3d(var(--layer-x, 0px), calc(var(--layer-y, 0px) - 9px), 0) rotate(.65deg); } }
@keyframes ribbon-sway { to { transform: translate3d(7px,-3px,0) rotate(.5deg); } }
@keyframes ribbon-flow { to { stroke-dashoffset: -80; } }
@keyframes star-breathe { to { opacity: .25; transform: scale(.7); } }
@keyframes scroll-cue { 0%,100% { opacity: .25; transform: translateY(0); } 50% { opacity: 1; transform: translateY(16px); } }
@keyframes category-orbit { to { transform: rotate(360deg); } }

@media (max-width: 1100px) { .tool-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 820px) {
  .toolbox-hero { min-height: 690px; padding: calc(var(--tb-nav-height) + 24px) 0 66px; align-items: start; }
  .toolbox-hero-inner { width: calc(100% - 28px); grid-template-columns: 1fr; gap: 8px; }
  .toolbox-hero-copy { max-width: 480px; padding-top: 24px; }
  .toolbox-hero h1 { margin: 14px 0; font-size: clamp(42px, 12vw, 50px); }.toolbox-hero-copy > p { max-width: 390px; font-size: 14px; line-height: 1.7; }
  .hero-actions { margin-top: 20px; }.hero-note { margin-top: 14px; }
  .hero-artwork { position: absolute; right: -18%; bottom: 8px; width: 82%; height: 350px; opacity: .72; pointer-events: none; }
  .art-caption, .hero-scroll-cue { display: none; }.hero-ink { width: 90vw; filter: blur(30px); animation: none; }.hero-ink-one { left: -38%; }.hero-ink-two { right: -35%; }
  .toolbox-tools-section { width: calc(100% - 20px); margin-top: -38px; padding: 42px 12px 60px; border-radius: 22px 22px 0 0; }
  .toolbox-section-heading { grid-template-columns: 1fr; gap: 12px; }.toolbox-section-heading h2, .about-statement h2 { font-size: 35px; }.toolbox-section-heading > p { font-size: 12px; }
  .category-grid { margin-top: 22px; }.category-card { min-height: 130px; padding: 18px; grid-template-columns: auto 1fr; gap: 14px; }.category-card-visual { width: 58px; height: 58px; border-radius: 19px; }.category-card-visual b { font-size: 28px; }.category-card-copy strong { font-size: 22px; }.category-card-copy em { font-size: 10px; line-height: 1.5; }.category-card-arrow { display: none; }
  .tool-grid { margin-top: 25px; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }.tool-card { min-height: 185px; padding: 15px; backdrop-filter: blur(7px); }.tool-card-copy h3 { font-size: 20px; }.tool-card-copy > span { font-size: 10px; }.tool-card-icon { width: 38px; height: 38px; border-radius: 12px; }.tool-card-icon svg { width: 20px; height: 20px; }.tool-status { max-width: 70px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .tool-card:hover, .tool-card-disabled:hover { transform: none; }.tool-card:hover .tool-card-icon { transform: none; }
  .toolbox-about-section { width: calc(100% - 28px); padding: 65px 0; }.about-grid { margin-top: 34px; grid-template-columns: 1fr; gap: 24px; }.about-grid h3 { margin-top: 17px; }
  .toolbox-closing { width: calc(100% - 28px); margin-bottom: 58px; padding: 58px 20px; }.toolbox-closing h2 { font-size: 34px; }
  .tools-page-hero { padding: calc(var(--tb-nav-height) + 54px) 14px 78px; }.tools-page-hero h1 { font-size: 43px; }.tools-page-hero p { font-size: 13px; }.tools-catalog { width: calc(100% - 20px); padding: 30px 12px 68px; }.tools-catalog-heading { align-items: start; flex-direction: column; gap: 6px; }
}
@media (max-width: 359px) { .tool-grid { grid-template-columns: 1fr; }.hero-artwork { width: 94%; right: -30%; } }