:root { color-scheme: light; }
body.gpg-body { margin: 0; background: #f5f7f8; }
.gpg-app { min-height: 100vh; color: #203338; background: #f5f7f8; font: 16px/1.6 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.gpg-app *, .gpg-app *::before, .gpg-app *::after { box-sizing: border-box; }
.gpg-app a { color: #126253; text-underline-offset: .2em; }
.gpg-app h1 { margin: 0 0 1rem; color: #163b34; font-size: clamp(1.7rem, 4vw, 2.4rem); line-height: 1.2; }
.gpg-app p { margin: 0 0 1.3rem; }
.gpg-app :focus-visible { outline: 3px solid #b36a16; outline-offset: 4px; }
.gpg-header { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.4rem 3vw; background: #fff; border-bottom: 1px solid #dce4e2; }
.gpg-app .gpg-brand { color: #163b34; font-size: 1.3rem; font-weight: 800; text-decoration: none; }
.gpg-brand span { display: block; font-size: .85rem; font-weight: 500; letter-spacing: .04em; }
.gpg-account { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.gpg-account form { margin: 0; }
.gpg-layout { display: flex; max-width: 1400px; margin: 0 auto; }
.gpg-sidebar { flex: 0 0 235px; padding: 2rem 1rem; }
.gpg-navigation { display: flex; flex-direction: column; gap: .4rem; }
.gpg-app .gpg-nav-link { display: block; border-radius: .5rem; padding: .8rem 1rem; text-decoration: none; color: #344d48; font-weight: 600; }
.gpg-nav-link:hover { background: #e3ece8; }
.gpg-app .gpg-nav-link[aria-current="page"] { background: #174f42; color: #fff; }
.gpg-main { flex: 1; min-width: 0; padding: 2.5rem clamp(1rem, 4vw, 3rem); }
.gpg-card { padding: clamp(1.5rem, 4vw, 3rem); background: #fff; border: 1px solid #dce4e2; border-radius: 1rem; box-shadow: 0 8px 30px #153b3408; }
.gpg-login { max-width: 490px; margin: 1.5rem auto; }
.gpg-app .gpg-eyebrow { margin-bottom: .7rem; color: #56756b; font-size: .72rem; letter-spacing: .14em; font-weight: 700; }
.gpg-login label { display: block; margin: 1rem 0 .35rem; font-weight: 600; }
.gpg-login input[type="text"], .gpg-login input[type="password"] { width: 100%; min-height: 46px; padding: .7rem; border: 1px solid #a7b9b2; border-radius: .4rem; background: #fff; color: #203338; font: inherit; }
.gpg-login .gpg-remember { display: flex; align-items: center; gap: .6rem; margin: 1rem 0 1.5rem; font-weight: 400; }
.gpg-remember input { width: 18px; height: 18px; accent-color: #174f42; }
.gpg-app .gpg-button { appearance: none; display: inline-block; border: 1px solid #174f42; border-radius: .45rem; padding: .65rem 1.15rem; background: #174f42; color: #fff; font: inherit; font-weight: 650; cursor: pointer; line-height: 1.5; }
.gpg-app .gpg-button:hover { background: #103e34; color: #fff; }
.gpg-app .gpg-button-secondary { background: #fff; color: #174f42; }
.gpg-login form + p { margin: 1.5rem 0 0; }
.gpg-notice { margin-bottom: 1.5rem; border-left: 4px solid #a33830; border-radius: .3rem; padding: 1rem; background: #fff0ed; color: #762c25; }
.gpg-success { margin-bottom: 1.5rem; padding: 1rem; border-left: 4px solid #174f42; background: #edf7f0; }
.gpg-table-scroll { overflow-x: auto; margin-bottom: 2rem; }
.gpg-users-table { width: 100%; border-collapse: collapse; text-align: left; font-size: .9rem; }
.gpg-users-table caption { text-align: left; font-weight: 600; padding: .5rem 0; }
.gpg-users-table th, .gpg-users-table td { padding: .8rem .6rem; border-bottom: 1px solid #dce4e2; vertical-align: top; overflow-wrap: anywhere; }
.gpg-users-table thead th { background: #f1f6f3; }
.gpg-user-actions { display: flex; gap: .7rem; align-items: center; flex-wrap: wrap; }
.gpg-user-actions form { margin: 0; }
.gpg-user-actions .gpg-button { padding: .35rem .6rem; font-size: .85rem; }
.gpg-user-form { max-width: 560px; }
.gpg-user-form label { display: block; font-weight: 600; margin: 1rem 0 .35rem; }
.gpg-user-form input:not([type="hidden"]), .gpg-user-form select { width: 100%; min-height: 46px; border: 1px solid #a7b9b2; border-radius: .4rem; padding: .7rem; font: inherit; background: white; color: #203338; }
.gpg-user-form p { margin-top: 1rem; }
.gpg-user-form > button { margin: 1.2rem .7rem 0 0; }
.gpg-remove-connection { margin-top: 1rem; }
.gpg-remove-connection label { display: block; font-size: .85rem; margin-bottom: .5rem; }
.gpg-page-assignments fieldset { border: 1px solid #dce4e2; border-radius: .5rem; padding: 1rem; margin-top: 1rem; }
.gpg-page-assignments .gpg-page-choice { display: flex; align-items: center; gap: .6rem; font-weight: 400; }
.gpg-page-assignments .gpg-page-choice input { width: 18px; min-height: 18px; height: 18px; accent-color: #174f42; }
.gpg-app .gpg-menu-toggle { display: none; }
.gpg-app .gpg-skip { position: absolute; top: -100px; left: 1rem; padding: .6rem; background: #fff; z-index: 10; }
.gpg-app .gpg-skip:focus { top: .5rem; }
@media (max-width: 720px) {
  .gpg-header { align-items: flex-start; padding: 1rem; }
  .gpg-account { justify-content: flex-end; font-size: .85rem; }
  .gpg-account span { max-width: 140px; overflow-wrap: anywhere; }
  .gpg-layout { flex-direction: column; }
  .gpg-sidebar { flex: auto; padding: 1rem 1rem 0; }
  .gpg-app--js .gpg-menu-toggle { display: inline-block; }
  .gpg-app--js .gpg-navigation:not(.is-open) { display: none; }
  .gpg-navigation { margin-top: .6rem; }
  .gpg-main { padding: 1.5rem 1rem; }
  .gpg-login { margin-top: 0; }
}
.gpg-template-thumbnail { width: 80px; height: 100px; object-fit: contain; }
.gpg-template-preview { display: block; max-width: min(100%, 360px); max-height: 450px; object-fit: contain; }
.gpg-template-preview[hidden] { display: none; }
.gpg-template-form input[type="number"] { max-width: 240px; }
.gpg-post-text { width: 100%; min-height: 160px; box-sizing: border-box; font: inherit; }
.gpg-post-preview { display: block; width: auto; max-width: 100%; max-height: 720px; margin: 1rem 0; }
.gpg-post-thumb { width: 72px; height: 90px; object-fit: contain; }
.gpg-post-copy { white-space: pre-wrap; overflow-wrap: anywhere; }
.gpg-user-form .gpg-post-agree input[type="checkbox"] { width: auto; min-height: 0; }
.gpg-post-detail dd { margin-bottom: .75rem; overflow-wrap: anywhere; }
.gpg-preview-state { font-weight: 600; }
