.workbench{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(30px,6vw,88px);margin-top:clamp(36px,5vw,72px)}
.module{min-width:0;color:var(--ink);padding:0}
.module h2{font-size:clamp(24px,2.5vw,36px);line-height:1.1;font-weight:650;letter-spacing:-.065em;margin:0 0 20px}
.chat{background:transparent;border:0;border-radius:0;overflow:hidden;color:#213441}
.chat-head{display:flex;align-items:center;gap:10px;padding:0;background:transparent;color:var(--ink)}
.chat-head img{width:36px;height:36px;border-radius:50%}
.chat-head small{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.messages{display:flex;flex-direction:column;align-items:flex-start;padding:16px 0 0;gap:8px}
.bubble{margin:0;border-radius:12px 12px 12px 3px;background:var(--switch);color:var(--ink);padding:9px 12px;font-size:14px;line-height:1.4;white-space:pre-line}
.bubble.outgoing{align-self:flex-end;border-radius:12px 12px 3px 12px;background:var(--tint);color:var(--on-tint)}
.examples{display:flex;gap:8px;flex-wrap:wrap;padding:13px 0 0}.examples button{background:var(--switch);color:var(--ink);font:600 13px Inter,sans-serif;border:0;border-radius:8px;padding:9px 17px}.examples button[aria-pressed=true]{background:var(--tint);color:var(--on-tint)}
.telegram-link{display:inline-flex;gap:7px;align-items:center;font-size:13px;margin-top:17px;font-weight:640}.telegram-link img{width:16px}[data-theme=dark] .telegram-link img{filter:invert(1)}
.postal{display:flex;flex-direction:column;overflow:hidden;isolation:isolate;position:relative}
.postal-head{position:relative;display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:19px;margin-bottom:20px;border:0}
.postal-head>div{z-index:1}.postal-head small{display:block;color:var(--muted);font:500 13px Roboto,sans-serif;margin-bottom:6px}
.postal h2{margin:0}
#lookup label{display:block;font-size:13px;font-weight:600;margin-bottom:8px}
.input-line{display:flex;flex-wrap:wrap;gap:8px}
.input-line input{width:0;flex:1 1 120px;min-width:0;background:var(--switch);color:var(--ink);border:0;border-radius:10px;padding:13px;font:500 16px Inter,sans-serif;font-variant-numeric:tabular-nums}
.input-line button{padding:12px 17px;background:var(--primary);color:var(--on-primary);border-radius:10px;border:0;font-size:14px}
#result{white-space:pre-line;line-height:1.55;font-size:14px}#result:not(:empty){margin-top:14px;border-left:3px solid #568fe2;padding-left:12px}#cep[aria-invalid=true]{border-color:#be4640}
@media(prefers-reduced-motion:no-preference){
 .module.entered,.bubble.pop{animation:lift .45s var(--ease) backwards}.postal.entered{animation-delay:.08s}
 
 @keyframes lift{from{opacity:0;transform:translateY(12px)}}@keyframes pin-drop{from{opacity:0;transform:translateY(-15px) scale(.9)}}
 .examples button,.input-line button{transition:transform .18s,box-shadow .18s}.examples button:active,.input-line button:active{transform:scale(.96)}
 @media(hover:hover){.input-line button:hover{box-shadow:0 4px 12px #104d9d38}}
}
@media(max-width:760px){.workbench{grid-template-columns:1fr;gap:38px;margin-top:36px}.module h2{font-size:26px}.postal-head{margin-bottom:16px}}

.postal-icon{width:42px;height:42px;background:var(--tint);border-radius:11px;padding:10px}
.examples button,.search-button{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.glyph,.search-button img{width:16px;height:16px}
.search-button img{filter:brightness(0) var(--button-icon)}
.postal-icon{background:var(--switch)}
[data-theme=dark] .postal-icon{filter:invert(1);background:#dadbdc}
.postal-head small{font-size:12px;letter-spacing:.08em}
#result.success{border-left:0;background:var(--switch);border-radius:10px;padding:15px 18px}
#result.success strong,#result.success span,#result.success small{display:block}
#result.success strong{font-size:18px;letter-spacing:-.035em}
#result.success small{color:var(--muted);font-size:12px;margin-top:6px}
#reply.typing{font-style:italic;color:var(--muted)}
@media(prefers-reduced-motion:no-preference){
 #lookup.loading .search-button img{animation:searching 1s ease-in-out infinite}
 #reply.typing{animation:breathe .75s ease-in-out infinite alternate}
 #result.success strong,#result.success span,#result.success small{animation:lift .42s var(--ease) backwards}
 #result.success span{animation-delay:.06s}#result.success small{animation-delay:.12s}
 .bubble.outgoing.pop{animation:send-in .3s var(--ease)}
 @keyframes send-in{from{opacity:0;transform:translate(12px,6px) scale(.97)}}
 @keyframes searching{50%{transform:translate(2px,-2px) rotate(-16deg)}}
 @keyframes breathe{to{opacity:.65}}
}

[data-theme=dark] .examples .glyph{filter:brightness(0) invert(1)}
.postal{overflow:visible}.chat{overflow:visible}

.search-button:disabled{cursor:default}
.search-button[data-state="waiting"]{background:var(--tint);color:var(--on-tint);cursor:progress}
.search-button[data-state="done"]{background:var(--success);color:var(--on-success)}
.search-button[data-state="done"] img,.search-button[data-state="waiting"] img{display:none}
.search-button[data-state="done"]::before,.search-button[data-state="waiting"]::before,.outgoing::after{
  content:"";width:17px;height:17px;background:currentColor;mask:center/contain no-repeat url("assets/icons/check-check.svg")
}
.search-button[data-state="waiting"]::before{mask-image:url("assets/icons/loader-circle.svg")}
.outgoing::after{display:inline-block;vertical-align:middle;margin-left:8px;color:var(--on-tint)}
@media(prefers-reduced-motion:no-preference){
  .search-button[data-state="waiting"]::before{animation:lookup-spin .85s linear infinite}
  .search-button[data-state="done"]::before,.bubble.pop.outgoing::after{animation:receipt-in .4s cubic-bezier(.2,.8,.3,1.3) backwards}
  @keyframes lookup-spin{to{transform:rotate(1turn)}}
  @keyframes receipt-in{from{opacity:0;transform:scale(.55) translateY(2px)}}
}