:root{font-family:system-ui,-apple-system,sans-serif;color:#efe9d5;background:#102c31}*{box-sizing:border-box}body{margin:0}header{position:sticky;top:0;z-index:5;background:#d9b86b;color:#1d2e31;border-bottom:4px solid #664c2c;padding:12px max(16px,4vw);display:flex;gap:16px;align-items:center;justify-content:space-between}header strong{font-family:Georgia,serif;font-size:1.3rem}header span{font-size:.85rem}button,a{cursor:pointer}button{border:2px solid #7e6035;background:#e9d391;color:#263e3b;border-radius:7px;padding:9px 13px;font-weight:700}button:hover{background:#f5dfad}a{color:#f4d789}main{max-width:1200px;margin:auto;padding:20px}.panel{background:#193d42;border:1px solid #56807c;border-radius:12px;padding:20px;margin:18px 0;box-shadow:0 10px 30px #051a1a55}.panel[hidden],section[hidden]{display:none}.hero{display:grid;grid-template-columns:minmax(230px,1fr) minmax(340px,1.4fr);gap:30px;align-items:center;background:linear-gradient(125deg,#274a48,#42563f);padding:30px;border:2px solid #b6a063;border-radius:15px}.hero h1{font-family:Georgia,serif;font-size:clamp(2rem,4vw,3.4rem);line-height:1.06;margin:10px 0}.hero small{letter-spacing:.16em;color:#f2d786}.office-map{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;transform:skewY(-6deg);padding:14px}.office-map span{display:grid;place-items:center;min-height:85px;text-align:center;padding:5px;background:linear-gradient(150deg,#f3e7c3,#b4c5ae);color:#294640;border:3px solid #756d4c;box-shadow:5px 7px 0 #112d30;font-weight:700;font-size:.82rem}.tabs{display:flex;gap:8px;overflow:auto;margin:18px 0}.tabs button[aria-current=page]{background:#f3d687}.messages{height:350px;overflow:auto;border:1px solid #5a7773;background:#112f34;padding:12px;border-radius:8px}.message{padding:10px;border-bottom:1px solid #35545a;white-space:pre-wrap}.message strong{display:block;color:#f2d589}.message time{font-size:.76rem;color:#afc4bb}form{display:grid;gap:12px;margin-top:16px}label{display:grid;gap:6px}input,textarea,select{font:inherit;color:#142c30;background:#f3eee0;border:2px solid #a4b4a0;border-radius:7px;padding:10px;width:100%}textarea{resize:vertical}form button{justify-self:start}.record{padding:12px;border-bottom:1px solid #426062}.record strong{display:block}.muted{color:#b4cac0;font-size:.86rem}#connectivity.offline{color:#903d2f}footer{text-align:center;padding:30px;color:#b3cbc0}@media(max-width:700px){header{flex-wrap:wrap}.hero{grid-template-columns:1fr}.office-map span{min-height:60px;font-size:.67rem}main{padding:10px}.panel{padding:14px}}