:root{--paper:#fafbf8;--surface:#fff;--ink:#20372f;--muted:#6c7c73;--accent:#167d65;--soft:#eaf3ee;--line:#dfe6de;--mono:'Cascadia Code',Consolas,monospace;--font:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}a{color:inherit;text-decoration:none}button{cursor:pointer}button:disabled{opacity:.4;cursor:default}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #4a9a83;outline-offset:3px}.container{width:min(1200px,calc(100% - 64px));margin:auto}.brand{display:inline-flex;align-items:center;gap:10px;font-size:21px;font-weight:650;letter-spacing:-.045em;white-space:nowrap}.brand-symbol{display:inline-flex;align-items:end;gap:3px;transform:rotate(-10deg);width:26px;height:27px}.brand-symbol i{display:block;width:6px;border-radius:2px;background:var(--accent)}.brand-symbol i:nth-child(1){height:12px}.brand-symbol i:nth-child(2){height:24px}.brand-symbol i:nth-child(3){height:18px}.brand span:last-child{font-weight:400;color:var(--muted)}.button{display:inline-flex;align-items:center;justify-content:center;gap:16px;border:1px solid var(--line);border-radius:7px;background:white;padding:13px 21px;font-size:12px;font-weight:600;line-height:1.5;white-space:nowrap}.button:hover{border-color:#7d9e8c;background:#f3f7f2}.button.primary{background:var(--accent);border-color:var(--accent);color:white;box-shadow:0 2px 2px #132e2410}.button.primary:hover{background:#106b55}.text-link{color:var(--accent);font-size:12px;font-weight:600}.pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:5px 9px;font:10px var(--mono);color:var(--muted)}.muted{color:var(--muted)}.empty{padding:60px 24px;text-align:center;grid-column:1/-1;border:1px dashed #c8d7cb;border-radius:10px}.empty h3{font-size:20px;font-weight:500}.empty p{color:var(--muted);font-size:13px;line-height:1.7}.notice{font-size:12px;line-height:1.7;padding:14px 18px;border-radius:8px;background:#edf3ed;border:1px solid var(--line);color:var(--muted)}@media(max-width:680px){.container{width:calc(100% - 32px)}.brand{font-size:19px}}
[hidden]{display:none!important}
.brand-logo{display:block;width:116px;height:45px;position:relative;overflow:hidden;flex-shrink:0}.brand-logo img{position:absolute;width:140px;height:auto;max-width:none;left:-15px;top:-32px}.brand .brand-logo{line-height:0}.brand:has(.brand-logo){gap:0}
/* White wordmark on a quiet, high-contrast navigation surface. */
header.site-header,header.app-header,header.top{background:#14241f;color:#f3f8f4;border-bottom-color:#ffffff1c}
header.site-header{width:100%;max-width:none;height:76px;padding-inline:max(32px,calc((100vw - 1200px)/2))}
:is(header.site-header,header.app-header,header.top) .brand-logo img{width:148px;left:-19px;top:-35px}
:is(header.site-header,header.app-header) :is(.nav,.app-nav,.header-actions){color:#dce8df}
:is(header.site-header,header.app-header) :is(.nav,.app-nav,.header-actions)>a:hover{color:#c8f28c}
header.app-header .app-nav a.active{color:#d5f5a3}
:is(header.site-header,header.app-header) .button.primary{background:#f1f7ed;border-color:#f1f7ed;color:#173a2c;box-shadow:none}
:is(header.site-header,header.app-header) .button.primary:hover{background:#dff0ce;border-color:#dff0ce;color:#173a2c}
header.top .document-name{color:#f3f8f4;background:#ffffff08;border-left-color:#ffffff26}
header.top .document-name::placeholder{color:#bdcec2}
header.top .save-state{color:#bdcec2}
@media(max-width:680px){header.site-header{height:68px;padding-inline:16px}.brand-logo{width:106px;height:42px}.brand-logo img{width:128px;left:-14px;top:-29px}:is(header.site-header,header.app-header,header.top) .brand-logo img{width:136px;left:-18px;top:-32px}}

/* Compact application mark; the landing page keeps its wordmark. */
.brand-icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:0 0 44px}.brand-icon img{display:block;width:40px;height:40px;object-fit:contain}.top .logo:has(.brand-icon){min-width:44px;margin-right:4px}.brand:has(.brand-icon){gap:0}