:root{
  --accent:#3B6B8A;
  --accent-dark:#294e68;
  --header-bg:#171717;
  --header-text:#fff;
  --bg:#f3f5f6;
  --surface:#fff;
  --text:#1b1f22;
  --muted:#66717a;
  --border:#dce1e4;
  --radius:10px;
  --shadow:0 10px 28px rgba(24,39,50,.08);
}
*{box-sizing:border-box;}
html{min-height:100%;}
body{margin:0;min-height:100vh;font-family:Calibri,"Segoe UI",system-ui,sans-serif;background:var(--bg);color:var(--text);}
button,input,textarea{font:inherit;}
.app-header{min-height:76px;padding:15px 28px;background:var(--header-bg);color:var(--header-text);display:flex;align-items:center;justify-content:space-between;gap:20px;}
.app-brand{display:flex;align-items:center;gap:14px;min-width:0;}
.app-logo{width:44px;height:44px;border-radius:8px;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:800;letter-spacing:.04em;flex:0 0 auto;}
.app-logo-image{width:174px;height:44px;display:block;object-fit:contain;object-position:left center;flex:0 0 auto;}
.app-brand-title{font-size:18px;font-weight:700;line-height:1.15;}
.app-brand-subtitle{font-size:13px;opacity:.7;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.app-actions{display:flex;align-items:center;gap:10px;flex:0 0 auto;}
.app-button{border:1px solid rgba(255,255,255,.3);border-radius:8px;background:transparent;color:#fff;padding:9px 14px;text-decoration:none;cursor:pointer;font-size:13px;line-height:1;}
.app-button:hover{background:rgba(255,255,255,.1);}
.app-main{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:40px 0 48px;}
.page-heading{margin-bottom:26px;}
.page-kicker{color:var(--accent);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:7px;}
.page-heading h1{font-size:28px;line-height:1.15;margin:0;font-weight:700;}
.page-heading p{font-size:15px;color:var(--muted);margin:9px 0 0;max-width:700px;line-height:1.5;}
.app-footer{text-align:center;color:#8b949a;font-size:12px;padding:22px;}
@media(max-width:680px){
  .app-header{padding:13px 16px;align-items:flex-start;}
  .app-logo{width:40px;height:40px;}
  .app-logo-image{width:142px;height:40px;}
  .app-brand-title{font-size:16px;}
  .app-actions{flex-direction:column;align-items:stretch;}
  .app-button{padding:8px 10px;text-align:center;}
  .app-main{width:min(100% - 28px,1180px);padding-top:28px;}
  .page-heading h1{font-size:24px;}
}
@media print{
  .app-header,.app-actions,.app-footer,.no-print{display:none!important;}
  body{background:#fff;}
  .app-main{width:100%;padding:0;}
}
