* { box-sizing: border-box; }
:root { font-family: Arial, Helvetica, sans-serif; color: #252a34; background: #f8f9fb; font-synthesis: none; -webkit-font-smoothing: antialiased; }
body { margin: 0; min-width: 280px; }
main { max-width: 920px; margin: 0 auto; padding: 58px 26px 24px; }
header { text-align: center; margin-bottom: 34px; }
.logo { width: 175px; height: 65px; overflow: hidden; margin: 0 auto 22px; }
.logo img { display: block; width: 175px; height: 175px; max-width: none; margin-top: -59px; mix-blend-mode: multiply; }
h1 { margin: 0 0 10px; font-size: 23px; line-height: 1.3; letter-spacing: -.5px; font-weight: 600; }
header p { margin: 0; font-size: 14px; line-height: 1.5; color: #747c89; }
.tools { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }
.tool { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 17px; min-height: 151px; padding: 23px 14px; background: white; border: 1px solid #e6e9ee; border-radius: 13px; color: inherit; text-decoration: none; font-size: 14px; line-height: 1.45; font-weight: 500; text-align: center; transition: border-color .18s, background .18s, transform .18s; -webkit-tap-highlight-color: transparent; }
.tool > span:last-child { max-width: 150px; }
.tool-icon { width: 46px; height: 46px; display: grid; place-items: center; background: #fff2f4; color: #df3c50; border-radius: 12px; flex-shrink: 0; }
.tool-icon svg { display: block; width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.tool:hover { background: #fffafb; border-color: #eaa3af; transform: translateY(-2px); }
.tool:focus-visible { outline: 3px solid #df3c50; outline-offset: 4px; }
.tool:active { transform: scale(.98); }
footer { margin-top: 34px; text-align: center; font-size: 11px; color: #929aa6; }
@media (max-width: 680px) {
 main { max-width: 540px; padding: 34px 20px 24px; }
 header { margin-bottom: 27px; }
 .logo { margin-bottom: 17px; }
 h1 { font-size: 21px; }
 header p { font-size: 13px; }
 .tools { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
 .tool { min-height: 133px; padding: 19px 12px; font-size: 13px; gap: 13px; }
 .tool-icon { width: 42px; height: 42px; border-radius: 11px; }
 .tool-icon svg { width: 24px; height: 24px; }
 footer { margin-top: 26px; }
}
@media (max-width: 340px) {
 main { padding-left: 14px; padding-right: 14px; }
 .tools { gap: 9px; }
 .tool { font-size: 12px; padding-left: 8px; padding-right: 8px; }
}
@media (prefers-reduced-motion: reduce) { .tool { transition: none; } }

.tool-status{display:block;margin-top:5px;font-size:11px;font-weight:400;color:#929aa6}.tool-admin{color:#747c89}.tool-disabled{opacity:.5;cursor:not-allowed}.tool-disabled:hover,.tool-disabled:active{background:white;border-color:#e6e9ee;transform:none}