/* Подписвачка — KOKI / MITKO visual adapter v1
 * CSS-only overlay for the original ChatGPT Sites app.
 * No API/DOM/evidence/business logic modifications.
 * Match the live app as of 2026-10-13. Apply AFTER its existing CSS.
 */
:root{
  --canvas:#eef2f7!important;--surface:rgba(255,255,255,.72)!important;
  --subtle:#f8f9fb!important;--ink:#121722!important;--muted:#596477!important;
  --line:rgba(20,28,42,.09)!important;--blue:#5969e8!important;
  --blue-hover:#4758d9!important;--blue-soft:rgba(89,105,232,.09)!important;
  --teal:#138762!important;--green:#138762!important;--amber:#aa741f!important;
  --navy:#121722!important;--navy-deep:#10151e!important;
  --shadow:0 18px 55px rgba(26,35,52,.07)!important;
  --ds-bg:#eef2f7!important;--ds-navy:#121722!important;--ds-blue:#5969e8!important;
  --ds-cyan:#5969e8!important;--ds-teal:#138762!important;--ds-gold:#ef675f!important;
  --ds-ink:#121722!important;--ds-muted:#596477!important;
  --ds-line:rgba(20,28,42,.09)!important;--ds-surface:rgba(255,255,255,.72)!important;
  --ds-shadow:0 18px 55px rgba(26,35,52,.07)!important;
}
html,body{background:var(--canvas)!important;color:var(--ink)!important}
body,.app-shell{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",system-ui,sans-serif!important}
.app-shell{min-height:100dvh!important;overflow-x:clip}
button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button:focus-visible,input:focus-visible,a:focus-visible,[role=button]:focus-visible{outline:2px solid var(--blue)!important;outline-offset:3px!important}
.page{background:transparent!important}
.page-intro,.mtoken-main .page-intro{
  color:var(--ink)!important;background:transparent!important;
  border:0!important;min-height:auto!important;box-shadow:none!important;
  padding:34px 4px 23px!important;border-radius:0!important;
}
.page-intro:after,.mtoken-main .page-intro:after{display:none!important}
.page-intro h1,.mtoken-main .page-intro h1,.admin-head h1,.document-head h1{
  color:var(--ink)!important;font-size:clamp(30px,3.4vw,46px)!important;
  font-weight:780!important;line-height:1.12!important;letter-spacing:-.045em!important;
}
.page-intro p,.mtoken-main .page-intro p:not(.eyebrow){
  color:var(--muted)!important;font-size:14px!important;line-height:1.6!important;
  max-width:680px!important;
}
.eyebrow,.mtoken-main .eyebrow{color:var(--blue)!important;font-size:11px!important;font-weight:820!important;letter-spacing:.14em!important}
.create-grid,.mtoken-main .create-grid{background:transparent!important;padding:0 4px 85px!important;gap:16px!important}
.upload-card,.setup-card,.admin-table-card,.sign-action,.api-operations,.api-tester,.pdf-stage,.admin-login-card,.document-head{
  border:1px solid var(--line)!important;border-radius:20px!important;
  background:var(--surface)!important;box-shadow:none!important;
}
.mtoken-main .upload-card,.mtoken-main .setup-card{
  border:1px solid var(--line)!important;box-shadow:none!important;
  border-top:1px solid var(--line)!important;border-radius:20px!important;
  padding:22px!important;
}
.section-title>span,.mtoken-main .section-title>span{
  color:var(--blue)!important;background:var(--blue-soft)!important;
  border:0!important;border-radius:12px!important;width:35px!important;height:35px!important
}
.section-title h2,.mtoken-main .section-title h2,.table-toolbar h2,.api-section-title h2{font-size:18px!important;letter-spacing:-.025em!important;color:var(--ink)!important}
.section-title p,.mtoken-main .section-title p,.table-toolbar span{color:var(--muted)!important;font-size:12px!important}
.drop-zone,.mtoken-main .drop-zone{
  background:var(--subtle)!important;border:1.5px dashed #c5ccd5!important;
  border-radius:17px!important;min-height:245px!important;box-shadow:none!important;
}
.drop-zone:hover,.drop-zone:focus-visible{border-color:var(--blue)!important}
.upload-symbol,.mtoken-file-placeholder>span{
  background:var(--blue-soft)!important;color:var(--blue)!important;border-radius:17px!important;
}
.upload-actions button,.default-document-button,.add-signer,.mtoken-main .add-signer{
  border-radius:12px!important;min-height:42px!important;box-shadow:none!important;
}
.mtoken-main .add-signer{background:var(--blue-soft)!important;color:var(--blue)!important;border-color:transparent!important}
.text-field,.sign-action input,.signer-fields input,.admin-login-card input,.api-tester textarea,
.mtoken-main .text-field{
  color:var(--ink)!important;background:var(--subtle)!important;
  border:1px solid #c5ccd5!important;border-radius:12px!important;min-height:48px!important;
  font-size:14px!important;box-shadow:none!important;
}
.text-field:focus,.sign-action input:focus,.signer-fields input:focus,.admin-login-card input:focus,
.api-tester textarea:focus{border-color:var(--blue)!important;box-shadow:0 0 0 3px var(--blue-soft)!important}
.primary-action,.mtoken-main .primary-action{
  min-height:52px!important;border:0!important;border-radius:14px!important;
  background:var(--blue)!important;color:#fff!important;
  box-shadow:0 7px 21px rgba(89,105,232,.17)!important;
  font-size:13px!important;font-weight:750!important;
}
.primary-action:hover:not(:disabled){background:var(--blue-hover)!important;transform:none!important}
.mtoken-steps span{border-radius:14px!important;background:var(--surface)!important;color:var(--muted)!important;border:1px solid var(--line)!important}
.mtoken-steps span.active{background:var(--blue-soft)!important;color:var(--blue)!important;border-color:transparent!important}
.network-console{border-radius:17px!important}
.signer-row{gap:10px!important}
.mtoken-main .remove-signer{border-radius:10px!important;height:34px!important;width:34px!important}
@media(min-width:901px){
 .topbar{
  position:fixed!important;top:0!important;left:0!important;bottom:0!important;
  width:244px!important;height:100dvh!important;min-height:100dvh!important;
  padding:20px 12px 16px!important;display:flex!important;flex-direction:column!important;
  align-items:stretch!important;gap:12px!important;
  background:var(--surface)!important;border-right:1px solid var(--line)!important;
  border-bottom:0!important;box-shadow:none!important;z-index:25!important;
 }
 .brand{display:flex!important;align-items:center!important;padding:5px 8px 20px!important;margin:0!important;border-bottom:1px solid var(--line)!important}
 .brand-mark{border-radius:14px!important;background:var(--blue)!important}
 .brand-copy strong{color:var(--ink)!important;font-size:17px!important}
 .brand-copy small{color:var(--muted)!important}
 .sidebar-toggle{display:none!important}
 .main-nav,.main-nav.open,.main-nav.collapsed{
  position:static!important;transform:none!important;opacity:1!important;visibility:visible!important;
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:4px!important;
  width:100%!important;max-width:none!important;height:auto!important;min-height:0!important;
  padding:12px 0!important;margin:0!important;background:transparent!important;
  border:0!important;box-shadow:none!important;overflow:visible!important;
 }
 .main-nav button,.main-nav.collapsed button{
  display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;
  color:var(--muted)!important;background:transparent!important;border:0!important;
  padding:12px!important;min-width:0!important;min-height:49px!important;
  text-align:left!important;border-radius:13px!important;
 }
 .main-nav button.active{background:var(--blue-soft)!important;color:var(--blue)!important}
 .main-nav button span{display:block!important}
 .main-nav button b,.main-nav.collapsed button b{display:block!important;color:inherit!important;font-size:12px!important}
 .main-nav button small,.main-nav.collapsed button small{display:none!important}
 .environment{margin-top:auto!important;display:block!important;border:1px solid var(--line)!important;border-radius:14px!important;padding:12px!important;color:var(--muted)!important;background:var(--subtle)!important}
 .debug-launcher{width:100%!important;min-height:41px!important;border-radius:12px!important}
 .page{margin-left:244px!important;margin-right:0!important;width:calc(100% - 244px)!important;max-width:none!important;padding:18px clamp(20px,3vw,44px) 85px!important}
 .mtoken-main{max-width:1250px!important}
 .mtoken-workspace{display:block!important}
}
@media(max-width:900px){
 html,body{overscroll-behavior-y:none}
 .topbar{
  position:sticky!important;top:0!important;left:auto!important;width:100%!important;
  height:60px!important;min-height:60px!important;padding:8px 15px!important;gap:9px!important;
  background:var(--surface)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  border-bottom:1px solid var(--line)!important;z-index:30!important
 }
 .topbar::before{content:"Подписвачка";position:absolute;left:16px;top:16px;color:var(--ink);font-size:16px;font-weight:760;letter-spacing:-.035em}
 .sidebar-toggle{display:none!important}
 .debug-launcher{display:none!important}
 .brand{margin:0 0 0 auto!important;min-height:42px!important}
 .brand-mark{border-radius:11px!important}
 .brand-copy strong{font-size:16px!important}.brand-copy small{display:none!important}
 .environment{display:none!important}.debug-launcher{margin-left:auto!important}
 .main-nav,.main-nav.open,.main-nav.collapsed{
  position:fixed!important;inset:auto 0 0 0!important;top:auto!important;bottom:0!important;
  height:calc(73px + env(safe-area-inset-bottom))!important;
  padding:5px 8px calc(5px + env(safe-area-inset-bottom))!important;
  width:100vw!important;max-width:none!important;min-height:0!important;
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
  align-items:center!important;gap:3px!important;transform:none!important;
  visibility:visible!important;opacity:1!important;
  background:var(--surface)!important;border:0!important;border-top:1px solid var(--line)!important;
  box-shadow:0 -8px 25px rgba(20,28,42,.05)!important;
  border-radius:0!important;z-index:40!important;
 }
 .main-nav button,.main-nav.collapsed button{
  display:grid!important;place-items:center!important;align-content:center!important;
  min-width:0!important;height:52px!important;min-height:52px!important;max-width:none!important;
  padding:5px 2px!important;gap:4px!important;border-radius:11px!important;
  border:0!important;background:transparent!important;color:var(--muted)!important;
  white-space:normal!important;
 }
 .main-nav button span,.main-nav.collapsed button span{display:block!important;font-size:20px!important}
 .main-nav button b,.main-nav.collapsed button b{display:block!important;color:inherit!important;font-size:10px!important;line-height:1.15!important;text-align:center!important;letter-spacing:-.02em!important}
 .main-nav button small,.main-nav.collapsed button small{display:none!important}
 .main-nav button.active{background:var(--blue-soft)!important;color:var(--blue)!important}
 .page{margin:0!important;padding:18px 12px calc(190px + env(safe-area-inset-bottom))!important;width:100%!important;max-width:100%!important}
 .page-intro,.mtoken-main .page-intro{padding:17px 3px 15px!important}
 .page-intro h1,.mtoken-main .page-intro h1{font-size:31px!important}
 .page-intro p,.mtoken-main .page-intro p:not(.eyebrow){font-size:12px!important}
 .mtoken-main .create-grid,.create-grid,.signing-grid,.api-layout{grid-template-columns:minmax(0,1fr)!important;gap:14px!important;padding:0 3px 60px!important}
 .mtoken-main .upload-card,.mtoken-main .setup-card{padding:17px!important;border-radius:19px!important}
 .drop-zone,.mtoken-main .drop-zone{min-height:210px!important}
 .mtoken-main .setup-card>.primary-action{
  position:fixed!important;bottom:calc(82px + env(safe-area-inset-bottom))!important;
  left:12px!important;right:12px!important;width:calc(100% - 24px)!important;
  z-index:41!important;min-height:53px!important;margin:0!important;
  box-shadow:0 7px 23px rgba(20,28,42,.18)!important
 }
 .mtoken-steps{gap:5px!important;flex-wrap:nowrap!important;overflow-x:auto!important}
 .mtoken-steps span{font-size:10px!important;padding:7px!important;white-space:nowrap!important}
}
@media(prefers-color-scheme:dark){
 :root{
  color-scheme:dark;--canvas:#0b1119!important;--surface:rgba(20,27,38,.84)!important;
  --subtle:#171e29!important;--ink:#f5f7fb!important;--muted:#bcc5d2!important;
  --line:rgba(255,255,255,.09)!important;--blue:#9198ff!important;
  --blue-hover:#7e87ef!important;--blue-soft:rgba(145,152,255,.13)!important;
  --ds-bg:#0b1119!important;--ds-surface:rgba(20,27,38,.84)!important;
  --ds-ink:#f5f7fb!important;--ds-navy:#f5f7fb!important;--ds-muted:#bcc5d2!important;
  --ds-line:rgba(255,255,255,.09)!important;--ds-blue:#9198ff!important;--ds-cyan:#9198ff!important
 }
 .drop-zone,.mtoken-main .drop-zone{border-color:#3a4654!important}
 .text-field,.sign-action input,.signer-fields input,.admin-login-card input,.api-tester textarea,.mtoken-main .text-field{
  border-color:#3a4654!important;color-scheme:dark!important
 }
}/* MITKO shell corrections for actual Signing Sites DOM; this file is appended to original-theme.css */
@media(min-width:901px){
  .app-shell{padding:0!important;width:100%!important}
  .topbar{overflow:hidden!important}
  .topbar .brand{
    position:relative!important;inset:auto!important;top:auto!important;left:auto!important;
    right:auto!important;bottom:auto!important;transform:none!important;width:100%!important;
    height:72px!important;min-height:72px!important;flex:none!important;
    margin:0!important;gap:11px!important;padding:8px 8px 18px!important;
  }
  .topbar .brand-copy{min-width:0!important;flex:1!important}
  .topbar .brand-copy strong{font-size:15px!important;overflow-wrap:anywhere!important}
  .topbar .brand-copy small{display:block!important;font-size:10px!important}
  .topbar .main-nav,.topbar .main-nav.open,.topbar .main-nav.collapsed{
    position:relative!important;inset:auto!important;top:auto!important;left:auto!important;
    margin:14px 0 0!important;align-self:stretch!important;flex:none!important;
    width:100%!important;max-height:none!important;
  }
  .topbar .main-nav button{padding:11px 12px!important;min-height:50px!important}
  .topbar .main-nav button b{font-weight:650!important;white-space:normal!important}
  .topbar .main-nav button>span{font-size:20px!important;min-width:25px!important}
  .topbar .environment{margin:auto 0 0!important;width:100%!important;font-size:10px!important}
  .topbar .debug-launcher{
    position:relative!important;inset:auto!important;left:auto!important;bottom:auto!important;
    width:100%!important;height:42px!important;margin:11px 0 0!important;transform:none!important;
    border-radius:12px!important;background:var(--subtle)!important;color:var(--muted)!important;
    border:1px solid var(--line)!important;box-shadow:none!important;z-index:auto!important;
  }
  .page,.page.mtoken-workspace{
    margin:0 0 0 244px!important;width:calc(100% - 244px)!important;
    max-width:none!important;padding:17px clamp(22px,3.1vw,48px) 90px!important;
  }
  .mtoken-main{width:100%!important;max-width:1340px!important;margin:0 auto!important}
  .mtoken-main .create-grid{grid-template-columns:minmax(0,1.09fr) minmax(0,.91fr)!important}
}
.page-intro,.mtoken-main .page-intro{
  display:flex!important;flex-direction:column!important;align-items:stretch!important;
  gap:0!important;grid-template-columns:unset!important;justify-content:flex-start!important;
  overflow:visible!important;width:100%!important;max-width:none!important;
  height:auto!important;min-height:0!important;white-space:normal!important;
}
.page-intro>div,.mtoken-main .page-intro>div{width:100%!important;max-width:960px!important;min-width:0!important;grid-column:auto!important}
.page-intro h1,.mtoken-main .page-intro h1{max-width:850px!important;overflow-wrap:normal!important}
.page-intro p:not(.eyebrow),.mtoken-main .page-intro p:not(.eyebrow){max-width:780px!important}
.mtoken-main .page-intro{margin:0 0 16px!important}
.mtoken-steps{display:flex!important;align-items:center!important;gap:9px!important;margin-top:18px!important;min-width:0!important}
.mtoken-steps span{display:inline-flex!important;align-items:center!important;gap:7px!important;white-space:nowrap!important;flex:none!important;padding:8px 12px!important}
.mtoken-steps b{color:inherit!important}
.mtoken-main .upload-card,.mtoken-main .setup-card{min-height:460px!important}
.mtoken-main .upload-card h2,.mtoken-main .setup-card h2{font-weight:730!important}
.mtoken-main .drop-zone{min-height:265px!important}
.mtoken-main .create-grid{overflow:visible!important}
.mtoken-main .signer-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
.mtoken-main .signer-row input{font-size:14px!important}
.mtoken-main .add-signer{background:var(--blue-soft)!important;color:var(--blue)!important}
.mtoken-main .primary-action:disabled{opacity:.5!important}
.mtoken-main .section-title{margin:0 0 15px!important;padding:0!important}
.mtoken-main .section-title>span{font-size:12px!important}
@media(max-width:900px){
  .app-shell{padding:0!important;width:100%!important}
  .topbar{display:flex!important;justify-content:space-between!important}
  .topbar .brand{position:relative!important;inset:auto!important;margin:0 0 0 auto!important;flex:none!important}
  .topbar .brand-copy{display:none!important}
  .topbar .brand-mark{width:36px!important;height:36px!important;border-radius:11px!important}
  .topbar::before{z-index:1!important}
  .page,.page.mtoken-workspace{
    width:100%!important;max-width:100%!important;margin:0!important;
    padding:16px 13px calc(195px + env(safe-area-inset-bottom))!important;
  }
  .page-intro,.mtoken-main .page-intro{padding:20px 2px 12px!important;gap:0!important}
  .page-intro h1,.mtoken-main .page-intro h1{font-size:31px!important;max-width:100%!important}
  .mtoken-steps{overflow-x:auto!important;white-space:nowrap!important;gap:5px!important}
  .mtoken-steps span{font-size:10px!important;padding:7px 8px!important}
  .mtoken-main .create-grid{grid-template-columns:minmax(0,1fr)!important;gap:13px!important}
  .mtoken-main .upload-card,.mtoken-main .setup-card{min-height:0!important;padding:18px!important}
  .mtoken-main .drop-zone{min-height:230px!important}
  .main-nav button>span{font-size:23px!important;line-height:1!important}
  .main-nav button b{font-size:10px!important;line-height:1.15!important}
  .main-nav button small{display:none!important}
  .mtoken-main .setup-card>.primary-action{
    position:fixed!important;z-index:50!important;min-height:54px!important;
    bottom:calc(82px + env(safe-area-inset-bottom))!important;
    left:12px!important;right:12px!important;width:calc(100vw - 24px)!important;
  }
}

/* KOKI / MITKO iconography and mobile navigation semantics */
.brand-mark{font-size:0!important;position:relative!important;flex:none!important}
.brand-mark::before{content:"";position:absolute;inset:9px;background:#fff;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.1%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m16%204%204%204-11.5%2011.5-5%201%201-5L16%204Z%20M13%207l4%204%20M3%2011c3-1%205%200%205%202%20M11%2021h10%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.1%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m16%204%204%204-11.5%2011.5-5%201%201-5L16%204Z%20M13%207l4%204%20M3%2011c3-1%205%200%205%202%20M11%2021h10%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
.brand-copy strong{font-size:0!important}
.brand-copy strong::after{content:"Подписвачка";font-size:17px!important;font-weight:790!important;letter-spacing:-.04em!important}
.brand-copy small{font-size:0!important}
.brand-copy small::after{content:"TONY'S HOLDING";font-size:10px!important;letter-spacing:.08em!important}
.main-nav button>span[aria-hidden="true"]{font-size:0!important;position:relative!important;width:24px!important;height:24px!important;min-width:24px!important;flex:none!important;display:block!important}
.main-nav button>span[aria-hidden="true"]::before{content:"";position:absolute;inset:1px;background:currentColor}
.main-nav button:nth-child(1)>span[aria-hidden="true"]::before{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.1%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m16%204%204%204-11.5%2011.5-5%201%201-5L16%204Z%20M13%207l4%204%20M3%2011c3-1%205%200%205%202%20M11%2021h10%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.1%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m16%204%204%204-11.5%2011.5-5%201%201-5L16%204Z%20M13%207l4%204%20M3%2011c3-1%205%200%205%202%20M11%2021h10%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
.main-nav button:nth-child(2)>span[aria-hidden="true"]::before{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.1%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%226%22%20y%3D%222%22%20width%3D%2212%22%20height%3D%2220%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M11%2018h2%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.1%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%226%22%20y%3D%222%22%20width%3D%2212%22%20height%3D%2220%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M11%2018h2%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
.main-nav button:nth-child(3)>span[aria-hidden="true"]::before{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.1%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%224%22%20rx%3D%221%22%2F%3E%3Cpath%20d%3D%22M5%208v12h14V8%20M10%2013h4%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.1%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%224%22%20rx%3D%221%22%2F%3E%3Cpath%20d%3D%22M5%208v12h14V8%20M10%2013h4%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
.main-nav button:nth-child(4)>span[aria-hidden="true"]::before{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.1%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m8%208-4%204%204%204%20M16%208l4%204-4%204%20M14%204l-4%2016%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.1%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m8%208-4%204%204%204%20M16%208l4%204-4%204%20M14%204l-4%2016%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
.flow-steps{display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:9px!important;list-style:none!important;margin:17px 0 0!important;padding:0!important}
.flow-steps li{display:flex!important;align-items:center!important;gap:9px!important;min-height:42px!important;border:1px solid var(--line)!important;border-radius:12px!important;padding:8px 11px!important;background:var(--surface)!important;color:var(--muted)!important;flex:0 1 auto!important}
.flow-steps li.active{color:var(--blue)!important;background:var(--blue-soft)!important;border-color:transparent!important}
.flow-steps li>b{flex:none!important;display:grid!important;place-items:center!important;width:25px!important;height:25px!important;border-radius:9px!important;color:inherit!important;background:var(--blue-soft)!important;font-size:11px!important}
.flow-steps li>span{font-size:12px!important;font-weight:660!important;line-height:1.3!important}
.flow-steps li small{display:none!important}
.drop-zone button,.upload-actions button,.default-document-button{letter-spacing:0!important;font-weight:730!important;font-size:13px!important}
.brand{color:var(--ink)!important}
@media(max-width:900px){
  .main-nav button,.main-nav.collapsed button{grid-template-rows:25px 15px!important;align-content:center!important;gap:3px!important}
  .main-nav button b,.main-nav.collapsed button b{display:none!important}
  .main-nav button::after{font-size:10px!important;font-weight:620!important;line-height:13px!important;color:inherit!important;white-space:nowrap!important}
  .main-nav button:nth-child(1)::after{content:"mToken"}
  .main-nav button:nth-child(2)::after{content:"SMS OTP"}
  .main-nav button:nth-child(3)::after{content:"Архив"}
  .main-nav button:nth-child(4)::after{content:"API"}
  .main-nav button>span[aria-hidden="true"]{height:25px!important;width:25px!important;min-width:25px!important}
  .main-nav button>span[aria-hidden="true"]::before{inset:0}
  .flow-steps{gap:6px!important;margin-top:15px!important;flex-wrap:nowrap!important;overflow-x:auto!important;padding-bottom:2px!important}
  .flow-steps li{min-width:0!important;flex:1 1 0!important;gap:5px!important;padding:7px 6px!important;min-height:45px!important;border-radius:12px!important}
  .flow-steps li>span{font-size:10px!important;white-space:nowrap!important}
  .flow-steps li>b{height:23px!important;width:23px!important;font-size:10px!important}
  .mtoken-main .setup-card>.primary-action:disabled{opacity:.76!important;background:var(--blue)!important}
}

/* Actual mobile DOM: stack nav glyph and label, never side by side. */
@media(max-width:900px){
  .main-nav button,.main-nav.collapsed button{
    display:flex!important;flex-direction:column!important;
    align-items:center!important;justify-content:center!important;
    align-content:center!important;gap:5px!important;
    text-align:center!important;
  }
  .main-nav button::after{display:block!important;flex:none!important;line-height:11px!important}
  .main-nav button>span[aria-hidden="true"]{display:block!important;flex:none!important}
}
@media(max-width:900px){
  .main-nav button::after,.main-nav button.active::after{
    position:static!important;inset:auto!important;top:auto!important;right:auto!important;
    bottom:auto!important;left:auto!important;transform:none!important;
    width:auto!important;height:auto!important;margin:0!important;padding:0!important;
  }
}
@media(prefers-color-scheme:dark){
  .drop-zone,.mtoken-main .drop-zone,.mtoken-file-placeholder{color:var(--ink)!important;background:var(--subtle)!important}
  .drop-zone strong,.mtoken-main .drop-zone strong,
  .drop-zone h2,.mtoken-file-placeholder h2,.drop-zone b{color:var(--ink)!important}
  .drop-zone p,.mtoken-main .drop-zone p,.mtoken-file-placeholder p{color:var(--muted)!important}
  .drop-zone button,.mtoken-main .drop-zone button,.upload-actions button,.default-document-button{
    color:var(--blue)!important;background:var(--surface)!important;border-color:var(--line)!important
  }
  .drop-zone button:hover,.mtoken-main .drop-zone button:hover{border-color:var(--blue)!important}
  .mtoken-main .setup-card>.primary-action:disabled{color:#fff!important;background:var(--blue)!important}
}
.drop-zone h3,.mtoken-main .drop-zone h3{
    color:var(--ink)!important;font-size:clamp(19px,2vw,23px)!important;
    line-height:1.25!important;letter-spacing:-.025em!important;font-weight:740!important
}
@media(prefers-color-scheme:dark){
  .drop-zone small,.mtoken-main .drop-zone small{color:var(--muted)!important}
}
/* Signing UI v4 — applied after existing adapter.
   Sources: KOKI frozen Design System and MITKO live styles.
   Surface: solid for document/evidence readability; no invented UI actions.
*/
:root{
  --surface:#fff!important;--subtle:#f8f9fb!important;--canvas:#eef2f7!important;
  --border:rgba(20,28,42,.09)!important;--line:rgba(20,28,42,.09)!important;
  --ds-surface:#fff!important;--ds-bg:#eef2f7!important;
  --ink:#121722!important;--ink2:#596477!important;--ink3:#6d7788!important;
  --blue:#5969e8!important;--ds-blue:#5969e8!important;--ds-cyan:#5969e8!important;
  --ds-gold:#aa741f!important;--ds-teal:#138762!important;--ds-ink:#121722!important;
  --r2:14px!important;--r3:18px!important;
}
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif!important}
.topbar,.upload-card,.setup-card,.api-head,.api-operations,.api-tester,.admin-login-card{
  background:var(--surface)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
.page-intro,.mtoken-main .page-intro{margin-bottom:12px!important}
.eyebrow,.mtoken-main .eyebrow{color:var(--blue)!important}
.page-intro p,.mtoken-main .page-intro p:not(.eyebrow),.api-head p{line-height:1.5!important}
.upload-card,.setup-card,.api-operations,.api-tester,.admin-login-card,.api-head{
  border-radius:18px!important;box-shadow:none!important;
}
.drop-zone,.mtoken-main .drop-zone{
  height:auto!important;flex:none!important;min-height:235px!important;
  border:1px dashed var(--border2)!important;background:var(--subtle)!important;
  border-radius:16px!important;padding:24px!important;gap:12px!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
}
.drop-zone h3,.mtoken-main .drop-zone h3{margin:0!important;font-size:21px!important;font-weight:720!important}
.drop-zone p,.mtoken-main .drop-zone p{font-size:12px!important;line-height:1.4!important;margin:0!important}
.drop-zone small,.mtoken-main .drop-zone small{color:var(--ink3)!important;font-size:11px!important;line-height:1.4!important}
.upload-symbol,.mtoken-main .upload-symbol{width:56px!important;height:56px!important;background:var(--blue-soft)!important;border-radius:16px!important}
.upload-actions{display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;flex-wrap:wrap!important;margin:4px 0 0!important}
.upload-actions button{min-height:44px!important;border-radius:12px!important;padding:0 13px!important;font-size:12px!important;font-weight:680!important;letter-spacing:0!important;text-transform:none!important}
.drop-zone>.visually-hidden{position:absolute!important}
.section-title{gap:12px!important}.section-title>span{font-size:12px!important}
.mtoken-main .setup-card{display:block!important}
.mtoken-main .signer-row{min-height:0!important}
.text-field,.admin-login-card input,.signer-fields input,.api-tester textarea{
  min-height:50px!important;border:1px solid var(--border2)!important;
  border-radius:13px!important;background:var(--subtle)!important;
  color:var(--ink)!important;font-size:14px!important;
}
.text-field:focus,.admin-login-card input:focus,.signer-fields input:focus,.api-tester textarea:focus{
  border-color:var(--blue)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 15%,transparent)!important;
}
.primary-action,.login-submit{border-radius:14px!important;font-size:13px!important;letter-spacing:0!important;font-weight:730!important;min-height:52px!important}
.primary-action:disabled{opacity:.68!important}
.main-nav button.active,.main-nav button.active:hover{
  background:transparent!important;color:var(--blue)!important;border-radius:0!important;box-shadow:none!important;
}
.main-nav button{min-height:48px!important;transition:color 180ms,background 180ms!important}
.main-nav button:hover:not(.active){background:var(--subtle)!important}
.api-head{border:1px solid var(--line)!important;border-radius:18px!important;padding:25px!important}
.api-head h1{font-size:clamp(30px,3vw,44px)!important;color:var(--ink)!important}
.api-operations,.api-tester{padding:20px!important}
.api-operation,.api-operation.selected{
  margin:0!important;border-left:0!important;border-right:0!important;
  border-bottom:1px solid var(--line)!important;border-top:0!important;
  border-radius:0!important;box-shadow:none!important;min-height:72px!important;
  background:transparent!important;
}
.api-operation:first-of-type{border-top:1px solid var(--line)!important}
.api-operation.selected{background:color-mix(in srgb,var(--blue) 7%,var(--surface))!important;box-shadow:inset 3px 0 0 var(--blue)!important}
.api-operation:hover{background:var(--subtle)!important}
.api-response{background:var(--subtle)!important;border:1px solid var(--line)!important;border-radius:13px!important}
.api-links a{border-radius:12px!important}
.admin-login-card h1{color:var(--ink)!important;font-size:clamp(26px,3.8vw,34px)!important;line-height:1.14!important}
.admin-login-card>p{color:var(--ink2)!important;font-size:13px!important;line-height:1.55!important}
.admin-login-card .login-seal{border-radius:14px!important;box-shadow:none!important}
.auth-tabs button{font-weight:670!important}
@media(min-width:901px){
  .main-nav button.active{box-shadow:inset 3px 0 0 var(--blue)!important;border-radius:10px!important}
  .topbar .main-nav button{min-height:49px!important}
  .mtoken-main .create-grid{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr)!important}
  .mtoken-main .upload-card,.mtoken-main .setup-card{min-height:410px!important}
  .mtoken-main .drop-zone{min-height:266px!important}
  .page,.page.mtoken-workspace{padding-top:28px!important}
  .api-layout{gap:16px!important}
}
@media(max-width:900px){
  .page,.page.mtoken-workspace{padding-top:12px!important}
  .page-intro,.mtoken-main .page-intro{padding-top:11px!important}
  .page-intro h1,.mtoken-main .page-intro h1{font-size:30px!important;letter-spacing:-.04em!important}
  .page-intro p,.mtoken-main .page-intro p:not(.eyebrow){font-size:12px!important;line-height:1.5!important}
  .main-nav button.active,.main-nav button.active:hover{
    background:transparent!important;border:0!important;color:var(--blue)!important;box-shadow:none!important;
  }
  .main-nav button.active::before{
    content:""!important;position:absolute!important;top:-5px!important;left:34%!important;width:32%!important;
    height:3px!important;border-radius:3px!important;background:var(--blue)!important;
  }
  .main-nav button{border:0!important;border-radius:0!important}
  .topbar .brand{padding:0!important;margin:0 0 0 auto!important;height:40px!important}
  .topbar .brand-mark{background:var(--blue)!important;width:38px!important;height:38px!important}
  .topbar::before{top:17px!important}
  .mtoken-main .upload-card,.mtoken-main .setup-card,
  .create-page .upload-card,.create-page .setup-card{padding:16px!important;min-height:0!important}
  .drop-zone,.mtoken-main .drop-zone{min-height:225px!important;padding:20px 12px!important}
  .mtoken-main .signer-row{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important;padding-right:37px!important}
  .mtoken-main .signer-row>.text-field{width:100%!important;min-width:0!important}
  .mtoken-main .remove-signer{top:12px!important;transform:none!important;width:33px!important;height:33px!important}
  .mtoken-main .create-grid{padding-bottom:90px!important}
  .create-page:not(.mtoken-workspace) .setup-card>.primary-action{
    position:fixed!important;z-index:45!important;left:12px!important;right:12px!important;
    width:calc(100vw - 24px)!important;bottom:calc(82px + env(safe-area-inset-bottom))!important;
    margin:0!important;min-height:54px!important;box-shadow:0 8px 24px rgba(20,28,42,.11)!important;
  }
  .create-page:not(.mtoken-workspace) .create-grid{padding-bottom:110px!important}
  .admin-login-page{padding-top:14px!important}
  .admin-login-card{padding:22px 20px!important}
  .admin-login-card h1{font-size:27px!important;line-height:1.15!important}
  .admin-login-card>p{margin-top:10px!important}
  .admin-login-card .login-seal{width:46px!important;height:46px!important}
  .auth-tabs{margin:18px 0 15px!important}
  .api-head{padding:21px!important}
  .api-layout{margin-top:14px!important;gap:12px!important;padding:0 0 110px!important}
  .api-operation,.api-operation.selected{
    padding:13px 10px!important;grid-template-columns:45px minmax(0,1fr) 19px!important;
  }
  .api-operations,.api-tester{padding:16px!important}
  .api-head .api-links{flex-wrap:wrap!important}
  .api-head h1{font-size:30px!important}
}
@media(prefers-color-scheme:dark){
  :root{
    --canvas:#0b1119!important;--surface:#171e29!important;--subtle:#121923!important;
    --border:rgba(255,255,255,.09)!important;--line:rgba(255,255,255,.09)!important;
    --border2:#3a4654!important;--ink:#f5f7fb!important;--ink2:#bcc5d2!important;
    --ink3:#95a0b0!important;--blue:#9198ff!important;--ds-blue:#9198ff!important;
    --ds-cyan:#9198ff!important;--ds-surface:#171e29!important;--ds-bg:#0b1119!important;
    --ds-ink:#f5f7fb!important;--ds-muted:#bcc5d2!important;--ds-line:rgba(255,255,255,.09)!important
  }
  .drop-zone h3,.mtoken-main .drop-zone h3{color:var(--ink)!important}
  .drop-zone small,.mtoken-main .drop-zone small{color:var(--ink3)!important}
  .api-operation.selected{background:color-mix(in srgb,var(--blue) 9%,var(--surface))!important}
  .login-seal{background:var(--blue)!important}
}
@media(prefers-reduced-motion:reduce){.main-nav button{transition:none!important}}
/* Signing Design polish v5 — precise KOKI shell parity */
@media(min-width:901px){
  .topbar .brand-copy strong{font-size:0!important;line-height:1!important;letter-spacing:0!important}
  .topbar .brand-copy strong::after{display:block!important;content:"Подписвачка"!important;font-size:17px!important;font-weight:760!important;line-height:22px!important;letter-spacing:-.035em!important;color:var(--ink)!important}
  .topbar .brand-copy small{font-size:0!important;line-height:1!important}
  .topbar .brand-copy small::after{display:block!important;content:"TONY'S HOLDING"!important;font-size:10px!important;line-height:14px!important;letter-spacing:.06em!important;color:var(--ink3)!important}
  .topbar .brand-copy{overflow:hidden!important;text-overflow:ellipsis!important}
  .topbar .brand{align-items:center!important}
}
.main-nav button::after,.main-nav button.active::after{
 background:transparent!important;border:0!important;box-shadow:none!important
}
.main-nav button>span[aria-hidden="true"]{background:transparent!important;border-radius:0!important}
.main-nav button>span[aria-hidden="true"]::before{background:var(--ink3)!important}
.main-nav button.active>span[aria-hidden="true"]::before{background:var(--blue)!important}
.primary-action:disabled{background:#65758e!important;color:#fff!important;opacity:1!important;box-shadow:none!important}
.default-document-button,.drop-zone .default-document-button{
 color:var(--ink2)!important;background:var(--surface)!important;border-color:var(--border2)!important;
}
.drop-zone button:not(.default-document-button){background:var(--surface)!important;border-color:var(--blue)!important;color:var(--blue)!important}
@media(max-width:900px){
 .main-nav button.active::after,.main-nav button::after{background:transparent!important}
 .main-nav button.active::before{top:-5px!important;height:2px!important}
 .main-nav button.active>span[aria-hidden="true"]{background:transparent!important}
 .create-page .setup-card>.primary-action{border-radius:14px!important}
}
@media(prefers-color-scheme:dark){
 .primary-action:disabled{background:#55647c!important;color:#f6f8ff!important;opacity:1!important}
 .default-document-button,.drop-zone .default-document-button{
  background:var(--surface)!important;color:var(--ink2)!important;border:1px solid var(--border2)!important
 }
 .drop-zone button:not(.default-document-button){
  background:var(--surface)!important;color:var(--blue)!important;border-color:var(--border2)!important
 }
}
/* Signing v6 finishing touches */
@media(min-width:901px){
  .app-shell>footer{padding-left:264px!important;padding-right:22px!important;box-sizing:border-box!important;width:100%!important}
}
@media(max-width:900px){
  .mtoken-main .signer-row{padding-right:46px!important}
  .mtoken-main .remove-signer{right:0!important}
  .app-shell>footer{padding-bottom:calc(74px + env(safe-area-inset-bottom))!important;min-height:0!important}
}
.mtoken-main .remove-signer:disabled{
  border:1px solid var(--line)!important;background:transparent!important;
  color:var(--ink3)!important;opacity:.45!important;box-shadow:none!important;
}
.mtoken-main .setup-card>.primary-action:disabled,
.create-page:not(.mtoken-workspace) .setup-card>.primary-action:disabled{
 background:#65758e!important;color:#fff!important;opacity:1!important;box-shadow:none!important;
}
@media(prefers-color-scheme:dark){
 .mtoken-main .setup-card>.primary-action:disabled,
 .create-page:not(.mtoken-workspace) .setup-card>.primary-action:disabled{
  background:#55647c!important;color:#f6f8ff!important;opacity:1!important;box-shadow:none!important
 }
}
/* Signing v7 — KOKI-style status shell and iPhone stability
 * No changes to signing, MAC, OTP, API, PDF or evidence.
 */
:root{
  --signing-top-safe:env(safe-area-inset-top,0px);
  --signing-bottom-safe:env(safe-area-inset-bottom,0px);
}
html{
  width:100%!important;
  height:100%!important;
  -webkit-text-size-adjust:100%!important;
  text-size-adjust:100%!important;
  overscroll-behavior-x:none!important;
}
body{
  min-width:0!important;
  width:100%!important;
  overflow-x:clip!important;
  -webkit-text-size-adjust:100%!important;
  touch-action:pan-x pan-y!important;
}
button,a,[role="button"]{touch-action:manipulation!important}
input,textarea,select,
.text-field,.sign-action input,.signer-fields input,
.admin-login-card input,.api-tester textarea,.mtoken-main .text-field,
.mac-output-input,.signer-row input,[type="tel"],[type="email"],[type="password"]{
  font-size:16px!important;
  -webkit-text-size-adjust:100%!important;
}
/* Preserve a safe scrollable viewport for the standalone signing outcome.
   It is a separate application state, not part of app navigation flow. */
.invite-page{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:100dvh!important;
  min-height:0!important;
  z-index:260!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  padding:calc(18px + var(--signing-top-safe)) 16px calc(18px + var(--signing-bottom-safe))!important;
  background:color-mix(in srgb,var(--canvas) 91%,#d4dce7 9%)!important;
}
.invite-card,.invite-card.error{
  width:min(100%,460px)!important;
  min-width:0!important;
  min-height:0!important;
  max-height:none!important;
  flex:0 0 auto!important;
  padding:clamp(20px,4vh,28px) 22px 24px!important;
  margin:auto!important;
  color:var(--ink)!important;
  background:var(--surface)!important;
  border:1px solid var(--line)!important;
  box-shadow:0 18px 48px rgba(20,28,42,.1)!important;
  border-radius:22px!important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif!important;
  line-height:1.45!important;
  text-align:center!important;
}
.invite-card .invite-mark{
  width:58px!important;
  height:58px!important;
  margin:0 auto 14px!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  background:#168765!important;
  color:#fff!important;
  font-size:30px!important;
  font-family:system-ui,sans-serif!important;
  font-weight:650!important;
  box-shadow:none!important;
}
.invite-card.error .invite-mark{background:#b83c49!important}
.invite-card .invite-spinner{
  width:44px!important;
  height:44px!important;
  border:3px solid var(--line)!important;
  border-top-color:var(--blue)!important;
  margin:6px auto 17px!important;
  box-shadow:none!important;
  animation:invite-spin 850ms linear infinite!important;
}
.invite-card .eyebrow{
  display:block!important;
  margin:0 0 10px!important;
  color:var(--blue)!important;
  font-size:10px!important;
  line-height:1.4!important;
  letter-spacing:.08em!important;
  font-weight:770!important;
  text-transform:uppercase!important;
}
.invite-card h1{
  margin:0 auto!important;
  padding:0!important;
  max-width:390px!important;
  color:var(--ink)!important;
  font-family:inherit!important;
  font-size:clamp(23px,5.5vw,30px)!important;
  font-weight:790!important;
  line-height:1.18!important;
  letter-spacing:-.04em!important;
  text-wrap:balance!important;
  overflow-wrap:break-word!important;
  text-shadow:none!important;
}
.invite-card>p:not(.eyebrow){
  margin:11px auto 0!important;
  max-width:395px!important;
  color:var(--ink2)!important;
  font-size:14px!important;
  line-height:1.5!important;
  overflow-wrap:anywhere!important;
}
.invite-card .invite-final{
  margin:17px 0 0!important;
  border:0!important;
  border-radius:13px!important;
  padding:11px 12px!important;
  background:#e3f5ed!important;
  color:#096e51!important;
  font-size:12px!important;
  line-height:1.45!important;
  font-weight:720!important;
  box-shadow:none!important;
}
.invite-card>small{
  display:block!important;
  margin:16px auto 0!important;
  color:var(--ink3)!important;
  font-size:12px!important;
  font-weight:400!important;
  line-height:1.45!important;
  max-width:350px!important;
}
.invite-card .invite-actions{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:8px!important;
  width:100%!important;
  margin:21px 0 0!important;
  align-items:stretch!important;
}
.invite-card .invite-actions>.primary-action{
  grid-column:1/-1!important;
  width:100%!important;
  min-height:50px!important;
  margin:0!important;
  border:0!important;
  border-radius:13px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:11px 14px!important;
  background:var(--blue)!important;
  color:#fff!important;
  text-align:center!important;
  font-size:14px!important;
  font-weight:740!important;
  line-height:1.3!important;
  text-decoration:none!important;
  box-shadow:none!important;
}
.invite-card .invite-actions>.secondary-action{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-height:42px!important;
  margin:0!important;
  padding:10px 7px!important;
  color:var(--ink2)!important;
  background:var(--subtle)!important;
  border:1px solid var(--line)!important;
  border-radius:12px!important;
  font-size:11px!important;
  line-height:1.2!important;
  text-decoration:none!important;
  font-weight:650!important;
  letter-spacing:0!important;
  white-space:normal!important;
  box-shadow:none!important;
}
.invite-card .invite-actions a:focus-visible{
  outline:2px solid var(--blue)!important;
  outline-offset:2px!important;
}
/* Treat transient notifications like KOKI status loaders, never bottom sheets.
   Move them away from the navigation and sticky primary button. */
.app-shell .toast,.toast{
  position:fixed!important;
  z-index:190!important;
  top:calc(70px + var(--signing-top-safe))!important;
  right:16px!important;
  bottom:auto!important;
  left:auto!important;
  width:min(420px,calc(100vw - 32px))!important;
  min-width:0!important;
  max-width:calc(100vw - 32px)!important;
  margin:0!important;
  padding:13px 42px 13px 14px!important;
  color:var(--ink)!important;
  background:var(--surface)!important;
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  font-size:13px!important;
  line-height:1.45!important;
  box-shadow:0 10px 26px rgba(15,25,40,.12)!important;
  backdrop-filter:none!important;
  overflow-wrap:anywhere!important;
}
.toast>span{
  width:25px!important;
  height:25px!important;
  color:#fff!important;
  background:var(--blue)!important;
  border-radius:50%!important;
  font-family:inherit!important;
}
.toast button{color:var(--ink2)!important}
.delivery-panel{
  position:fixed!important;
  z-index:185!important;
  top:calc(76px + var(--signing-top-safe))!important;
  bottom:auto!important;
  right:16px!important;
  left:auto!important;
  width:min(420px,calc(100vw - 32px))!important;
  max-width:calc(100vw - 32px)!important;
  max-height:min(40dvh,280px)!important;
  overflow:auto!important;
  margin:0!important;
  background:var(--surface)!important;
  color:var(--ink)!important;
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  box-shadow:0 10px 26px rgba(15,25,40,.12)!important;
  font-size:12px!important;
  line-height:1.45!important;
}
.history-loading{
  position:fixed!important;
  z-index:210!important;
  top:calc(77px + var(--signing-top-safe))!important;
  bottom:auto!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  width:max-content!important;
  max-width:calc(100vw - 32px)!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  color:var(--ink)!important;
  background:var(--surface)!important;
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  padding:13px 16px!important;
  font-size:13px!important;
  font-weight:650!important;
  box-shadow:0 10px 26px rgba(15,25,40,.12)!important;
}
.history-loading::before{
  content:""!important;
  display:block!important;
  flex:none!important;
  width:18px!important;height:18px!important;
  border:2px solid var(--line)!important;
  border-top-color:var(--blue)!important;
  border-radius:50%!important;
  animation:invite-spin 850ms linear infinite!important;
}
/* The native modal is above notifications, without touching the fixed dock. */
.history-overlay{
  position:fixed!important;inset:0!important;
  z-index:240!important;
  padding:calc(15px + var(--signing-top-safe)) 15px calc(15px + var(--signing-bottom-safe))!important;
  background:rgba(10,18,28,.57)!important;
}
.history-modal{
  background:var(--surface)!important;
  border:1px solid var(--line)!important;
  color:var(--ink)!important;
  border-radius:18px!important;
  max-height:calc(100dvh - 36px - var(--signing-top-safe) - var(--signing-bottom-safe))!important;
  box-shadow:0 15px 55px rgba(0,0,0,.17)!important;
}
.history-modal-head h2{color:var(--ink)!important}
.main-nav,.main-nav.open,.main-nav.collapsed{
  isolation:isolate!important;
  contain:layout style!important;
}
@media(max-width:900px){
  .main-nav,.main-nav.open,.main-nav.collapsed{
    position:fixed!important;
    left:0!important;right:0!important;bottom:0!important;top:auto!important;
    width:100%!important;
    min-height:0!important;
    height:calc(73px + var(--signing-bottom-safe))!important;
    z-index:100!important;
    background:var(--surface)!important;
    border-top:1px solid var(--line)!important;
    padding-bottom:calc(5px + var(--signing-bottom-safe))!important;
    transform:none!important;
    overflow:hidden!important;
    contain:layout style!important;
    box-shadow:none!important;
  }
  .app-shell .page,.page.mtoken-workspace,.page,.api-page{
    scroll-padding-bottom:calc(150px + var(--signing-bottom-safe))!important;
  }
  .mtoken-main .setup-card>.primary-action,
  .create-page:not(.mtoken-workspace) .setup-card>.primary-action{
    position:fixed!important;
    bottom:calc(82px + var(--signing-bottom-safe))!important;
    z-index:110!important;
  }
  .toast{
    top:calc(72px + var(--signing-top-safe))!important;
    right:12px!important;left:12px!important;
    width:auto!important;max-width:none!important;
    padding:12px 40px 12px 13px!important;
  }
  .delivery-panel{
    top:calc(80px + var(--signing-top-safe))!important;
    right:12px!important;left:12px!important;width:auto!important;
    max-width:none!important;
    max-height:min(32dvh,200px)!important;
  }
  .history-loading{
    top:calc(76px + var(--signing-top-safe))!important;
    width:max-content!important;
    max-width:calc(100vw - 24px)!important;
  }
  .invite-page{
    padding:calc(14px + var(--signing-top-safe)) 14px calc(14px + var(--signing-bottom-safe))!important;
  }
  .invite-card,.invite-card.error{
    width:100%!important;
    padding:21px 18px 21px!important;
    border-radius:19px!important;
  }
  .invite-card h1{font-size:clamp(22px,6.4vw,28px)!important}
  .invite-card>p:not(.eyebrow){font-size:13px!important}
  .invite-card .invite-final{font-size:12px!important}
}
@media(max-width:360px){
  .invite-card .invite-actions{grid-template-columns:1fr!important}
  .invite-card .invite-actions>.primary-action{grid-column:1!important}
  .invite-card .invite-mark{width:50px!important;height:50px!important;margin-bottom:12px!important}
  .invite-card>small{margin-top:12px!important}
  .invite-card .invite-actions{margin-top:15px!important}
}
@media(prefers-color-scheme:dark){
  .invite-page{background:rgba(8,13,20,.93)!important}
  .invite-card,.invite-card.error{
    background:var(--surface)!important;
    border-color:var(--line)!important;
    color:var(--ink)!important;
    box-shadow:0 15px 54px rgba(0,0,0,.2)!important;
  }
  .invite-card h1{color:var(--ink)!important}
  .invite-card>p:not(.eyebrow){color:var(--ink2)!important}
  .invite-card>small{color:var(--ink3)!important}
  .invite-card .invite-final{background:#173d34!important;color:#9be7cb!important}
  .invite-card .invite-actions>.secondary-action{background:var(--subtle)!important;border-color:var(--line)!important;color:var(--ink2)!important}
}
@media(prefers-reduced-motion:reduce){
  .history-loading::before,.invite-card .invite-spinner{animation-duration:1.4s!important}
}

/* iOS focus zoom regression fix: all visible fields >= 16px, including
 * nested signer rows and OTP/code fields with stronger original selectors. */
html body .app-shell .page input:not([type="hidden"]),
html body .app-shell .page textarea,
html body .app-shell .page select,
html body .app-shell .mtoken-main .signer-row input,
html body .app-shell .signer-fields input,
html body .app-shell .admin-login-card input,
html body .app-shell .api-tester textarea,
html body .app-shell .mac-output-input,
html body .app-shell .text-field,
html body .app-shell .sign-action input,
html body input:not([type="hidden"]),
html body textarea,
html body select{
  font-size:16px!important;
  line-height:1.4!important;
}
/* Signing v8 — central loader separated from toast and navigation.
 * Same visual behavior as KOKI's blocking processing status.
 */
body:has(> .history-loading)::before,
body:has(.app-shell .history-loading)::before{
  content:""!important;
  position:fixed!important;
  inset:0!important;
  z-index:205!important;
  background:rgba(10,18,30,.36)!important;
  backdrop-filter:blur(3px)!important;
  -webkit-backdrop-filter:blur(3px)!important;
  pointer-events:auto!important;
  touch-action:none!important;
}
.history-loading{
  position:fixed!important;
  z-index:215!important;
  top:50%!important;
  bottom:auto!important;
  left:50%!important;
  right:auto!important;
  transform:translate(-50%,-50%)!important;
  min-width:0!important;
  width:max-content!important;
  max-width:calc(100vw - 40px)!important;
  min-height:64px!important;
  margin:0!important;
  padding:16px 19px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  font-size:14px!important;
  font-weight:710!important;
  text-align:center!important;
  line-height:1.35!important;
  color:var(--ink)!important;
  background:var(--surface)!important;
  border:1px solid var(--line)!important;
  border-radius:17px!important;
  box-shadow:0 22px 65px rgba(8,18,30,.19)!important;
}
.history-loading::before{
  width:22px!important;
  height:22px!important;
  border-width:3px!important;
}
body:has(.toast) .delivery-panel{
  top:calc(144px + var(--signing-top-safe))!important;
}
@media(max-width:900px){
  .history-loading{
    top:50%!important;bottom:auto!important;left:50%!important;right:auto!important;
    transform:translate(-50%,-50%)!important;
    max-width:calc(100vw - 28px)!important;
    min-height:62px!important;
    padding:14px 16px!important;
  }
}
@media(prefers-color-scheme:dark){
  body:has(> .history-loading)::before,
  body:has(.app-shell .history-loading)::before{background:rgba(0,0,0,.6)!important}
}