:root{--ds-page:#fff;--ds-ink:#251f21;--ds-ink-2:#585254;--ds-hairline:#eae9ea;--ds-teal:#407c6c;--ds-red:#b3402e;--ds-raised:#f4efec}
body{font-family:Arial,sans-serif;font-size:14px;line-height:1.7}
.bureau{max-width:1040px;margin:auto;padding:24px}
h1{font-family:Georgia,serif;font-size:28px;font-weight:400;line-height:1.3;margin:0 0 24px}
h2{font-family:Georgia,serif;font-size:21px;font-weight:400;margin:0 0 24px}
.request{margin-top:32px}
.action{font:inherit;min-height:44px;padding:10px 18px;border-radius:4px;border:1px solid var(--ds-hairline);cursor:pointer}
.primary{background:var(--ds-ink);color:white;border-color:var(--ds-ink)}
.secondary{background:white;color:var(--ds-ink)}
.caption{font-size:12px;color:var(--ds-ink-2);margin:32px 0}
footer{color:var(--ds-ink-2);margin-top:32px;padding-bottom:12px}
.bureau button{min-height:44px}
.bureau button:hover{text-decoration:underline;text-underline-offset:4px}
[hidden]{display:none!important}
@media(min-width:768px){.bureau{padding:36px}h1{font-size:36px}}
html,body{margin:0;min-height:100%}
body{background:var(--ds-page)}
*{box-sizing:border-box}
.bureau{text-align:right;color:var(--ds-ink);overflow-wrap:anywhere}
.masthead{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-bottom:1px solid var(--ds-hairline);padding-bottom:14px;color:var(--ds-ink-2);font-size:12px}
.draft{font-weight:600}
.hero{display:grid;gap:18px;align-items:center;padding:24px 0}
.tagline{font-weight:600;margin:12px 0 0}
.clerk{margin:0;display:flex;align-items:center;gap:16px}
.clerk img{width:112px;height:130px;object-fit:cover;border-radius:12px}
.clerk figcaption{font-size:12px;color:var(--ds-ink-2)}
.queue{display:flex;align-items:center;justify-content:space-between;gap:12px;border-block:1px solid var(--ds-hairline);padding:12px 0;margin-bottom:26px;font-size:13px}
.queue-button,.faq-button{font:inherit;color:var(--ds-ink);background:none;border:none;cursor:pointer;min-height:44px;text-align:right;padding:8px 0}
.queue-button{text-decoration:underline;text-underline-offset:4px}
fieldset{border:0;padding:0;margin:0 0 22px;min-width:0}
legend{font-size:14px;font-weight:600;margin-bottom:10px}
.choices{display:flex;flex-wrap:wrap;gap:8px}
.choice{font:inherit;font-size:14px;min-height:44px;padding:9px 13px;border:1px solid var(--ds-hairline);border-radius:4px;color:var(--ds-ink);background:var(--ds-page);cursor:pointer}
.choice.selected{border-color:var(--ds-teal);color:var(--ds-teal);font-weight:600}
.choice:hover{border-color:var(--ds-ink-2)}
button:focus-visible{outline:2px solid var(--ds-ink);outline-offset:4px}
.urgent-note{color:var(--ds-red);margin:0 0 18px}
.permit{margin-top:26px;border:1px solid var(--ds-hairline);border-radius:8px;padding:22px}
.permit-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--ds-ink-2);font-size:12px}
.stamp.denied{color:var(--ds-red);font-weight:600;border:2px solid var(--ds-red);padding:6px 10px;transform:rotate(-5deg)}
.permit h2{font-size:21px;font-weight:600;margin:26px 0 12px}
.permit p{line-height:1.8;margin:12px 0}
.reason{border-right:3px solid var(--ds-red);padding-right:14px}
.timer-line{font-variant-numeric:tabular-nums;background:var(--ds-raised);border-radius:4px;padding:12px}
.signature{font-size:12px;color:var(--ds-ink-2);padding-block:12px}
.appeal{padding:12px;background:var(--ds-raised);border-radius:4px}
.help{margin:24px 0;border-block:1px solid var(--ds-hairline);padding:6px 0}
.help p{margin:8px 0 18px;line-height:1.8}
.faq-button{width:100%;font-weight:600}
@media(min-width:768px){.hero{grid-template-columns:minmax(0,1fr) 240px;gap:48px;padding:32px 0}.clerk{display:block}.clerk img{width:240px;height:250px}.clerk figcaption{margin-top:8px}.permit{padding:30px}.choices{gap:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
html{direction:ltr}body{direction:rtl}

.review{display:flex;align-items:center;gap:10px;color:var(--ds-ink-2);background:var(--ds-raised);border-radius:4px;padding:12px;margin:14px 0 0}
.dots{display:inline-flex;gap:5px}
.dots span{width:6px;height:6px;border-radius:50%;background:var(--ds-teal)}
@media(prefers-reduced-motion:no-preference){
.dots span{animation:pulse 1s infinite}
.dots span:nth-child(2){animation-delay:.2s}
.dots span:nth-child(3){animation-delay:.4s}
@keyframes pulse{0%,100%{opacity:.25}50%{opacity:1}}
}