dialog { width: min(500px, calc(100vw - 28px)); max-height: calc(100vh - 30px); padding: 0; overflow: auto; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); color: var(--ink); box-shadow: var(--shadow); }
dialog::backdrop { background: rgba(10, 8, 22, .58); backdrop-filter: blur(4px); }
dialog[open] { animation: dialog-enter .24s cubic-bezier(.2,.8,.2,1) both; }
dialog[open]::backdrop { animation: backdrop-enter .2s ease both; }
.modal { position: relative; padding: 34px; }
.modal .close { position: absolute; top: 14px; right: 14px; width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); color: var(--muted); font-size: 19px; cursor: pointer; }
.modal h2 { margin: 10px 0 8px; font: 800 29px/1.12 Manrope, sans-serif; letter-spacing: -.04em; }
.modal > p { color: var(--muted); font-size: 13px; line-height: 1.6; }
.modal label { margin-top: 17px; display: grid; gap: 7px; font-size: 12px; font-weight: 700; }
.modal input, .modal select, .modal textarea { width: 100%; min-height: 46px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 11px; outline: 0; background: var(--surface-2); color: var(--ink); }
.modal input:focus, .modal select:focus, .modal textarea:focus { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(123, 66, 255, .11); }
.button { min-height: 47px; padding: 0 17px; border-radius: 11px; font-weight: 700; cursor: pointer; }
.button-primary { width: 100%; margin-top: 20px; border: 0; background: linear-gradient(105deg, var(--purple-2), var(--purple), var(--blue)); color: #fff; }
.button-ghost { width: 100%; margin-top: 10px; border: 1px solid var(--line); background: var(--surface); }
.form-error { min-height: 18px; margin-bottom: 0 !important; color: var(--red) !important; }
.address-composer { display: grid; grid-template-columns: 1fr minmax(150px, auto); gap: 7px; }
.password-hint { margin: 7px 0 0; font-size: 10px !important; }
.success-icon { width: 52px; height: 52px; margin-bottom: 13px; display: grid; place-items: center; border-radius: 50%; background: #e6fbf3; color: var(--green); font-size: 24px; font-weight: 800; }
.credential-box { margin: 18px 0; padding: 15px; display: grid; gap: 5px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-2); }
.credential-box span { margin-top: 7px; color: var(--faint); font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.credential-box strong { overflow-wrap: anywhere; }
.toast { position: fixed; z-index: 100; right: 24px; bottom: 24px; max-width: min(360px, calc(100vw - 30px)); padding: 12px 16px; translate: 0 20px; opacity: 0; border: 1px solid rgba(255,255,255,.12); border-radius: 11px; background: #171522; color: #fff; box-shadow: var(--shadow); font-size: 13px; pointer-events: none; transition: .2s; }
.toast.show { translate: 0; opacity: 1; }
@keyframes dialog-enter { from { opacity: 0; translate: 0 12px; scale: .975; } }
@keyframes backdrop-enter { from { opacity: 0; } }

.site-footer { max-width: 1160px; margin: auto; padding: 55px 22px 28px; display: grid; grid-template-columns: 1.5fr repeat(4, 1fr); gap: 40px 30px; border-top: 1px solid var(--line); }
.footer-brand p { max-width: 310px; margin: 18px 0 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.site-footer nav { display: grid; align-content: start; gap: 10px; }
.site-footer nav h3 { margin: 2px 0 7px; font: 700 12px Manrope, sans-serif; }
.site-footer nav a { color: var(--muted); font-size: 11px; text-decoration: none; }
.site-footer nav a:hover { color: var(--purple); }
.footer-bottom { grid-column: 1 / -1; padding-top: 24px; display: flex; justify-content: space-between; border-top: 1px solid var(--line); color: var(--faint); font-size: 10px; }
.footer-bottom a { text-decoration: none; }

@media (max-width: 880px) {
  .site-footer { grid-template-columns: 2fr repeat(2, 1fr); }
  .footer-brand { grid-row: span 2; }
}
@media (max-width: 560px) {
  .modal { padding: 29px 20px 23px; }
  .address-composer { grid-template-columns: 1fr; }
  .site-footer { padding-right: 14px; padding-left: 14px; grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; grid-row: auto; }
  .toast { right: 15px; bottom: 15px; }
}

.blog-card-art{position:relative;overflow:hidden}.blog-card-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:scale .35s cubic-bezier(.2,.8,.2,1)}.blog-card:hover .blog-card-art img{scale:1.035}.blog-card-art>span{position:relative;z-index:1;box-shadow:0 8px 25px rgba(29,18,63,.12)}.article-cover{width:calc(100% + 84px);max-height:440px;margin:-42px -42px 34px;display:block;object-fit:cover;border-radius:20px 20px 0 0}.article-tags{margin:14px 0 0;display:flex;flex-wrap:wrap;gap:6px}.article-tags span{padding:4px 8px;border:1px solid var(--line);border-radius:99px;background:var(--surface-2);color:var(--purple);font-size:9px;font-weight:700}.article-tags-large{margin:-13px 0 25px}.article-tags-large span{padding:6px 10px}.blog-card footer{margin-top:17px}@media(max-width:560px){.article-cover{width:calc(100% + 38px);margin:-25px -19px 26px;border-radius:18px 18px 0 0}}