.view.groups-page { --gp-bg:#fff;--gp-soft:#eef5f3;--gp-text:#263c43;--gp-muted:#596d72;--gp-line:#d8e5e1;--gp-accent:#315f58; max-width:820px;box-sizing:border-box;margin:20px auto;padding:28px 20px 48px;color:var(--gp-text);font-size:16px;line-height:1.7; }
.groups-page * { box-sizing:border-box; }
.groups-page h1 { font-size:1.8rem;margin:6px 0 8px;line-height:1.4; }
.groups-page h2 { font-size:1.2rem;margin:0 0 14px;line-height:1.5; }
.groups-page p { margin:8px 0 16px; }
.groups-page a { color:var(--gp-accent);text-decoration:none; }
.groups-page small { font-size:14px;color:var(--gp-muted); }
.groups-heading { display:flex;align-items:center;gap:20px;margin-bottom:26px; }
.groups-heading > i { margin-left:auto;font-size:40px;color:var(--gp-accent); }
.groups-eyebrow { font-size:14px;font-weight:700;color:var(--gp-accent); }
.group-card { padding:24px;border:1px solid var(--gp-line);border-radius:16px;background:var(--gp-bg);margin:0 0 20px;overflow-wrap:anywhere; }
.group-message { padding:14px 18px;border-radius:10px;background:var(--gp-soft); }
.group-message.is-error { border:1px solid #b85050; }
.group-tabs { display:flex;gap:8px;flex-wrap:wrap;margin:0 0 22px; }
.group-tabs a,.groups-page .group-secondary { display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--gp-line);border-radius:9px;padding:9px 13px;background:var(--gp-bg);color:var(--gp-accent);font:inherit;cursor:pointer;text-decoration:none;min-height:44px; }
.group-tabs a[aria-current] { background:var(--gp-soft);font-weight:700;border-color:var(--gp-accent); }
.groups-page .group-primary { display:inline-flex;justify-content:center;align-items:center;border:0;border-radius:9px;padding:11px 20px;background:var(--gp-accent);color:#fff;font:inherit;font-weight:700;cursor:pointer;min-height:46px; }
.groups-page .group-text-button { background:transparent;border:0;color:var(--gp-muted);font:inherit;font-size:14px;padding:8px 0;cursor:pointer;min-height:40px; }
.group-form { display:grid;gap:10px; }
.group-form label { font-weight:700; }
.group-form input,.group-form textarea,.group-copy-row input { width:100%;border:1px solid var(--gp-line);border-radius:9px;padding:11px 13px;font:inherit;color:var(--gp-text);background:var(--gp-bg);min-width:0; }
.group-form textarea { resize:vertical; }
.group-form button { justify-self:start;margin-top:4px; }
.group-list { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px; }
.group-list a { display:flex;flex-direction:column;gap:6px;border-radius:10px;background:var(--gp-soft);padding:14px 16px; }
.group-list span { color:var(--gp-muted);font-size:14px; }
.group-row { display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap; }
.group-row h2 { margin:0; }
.group-feed > .group-row { margin:28px 0 16px; }
.group-body { white-space:pre-wrap;overflow-wrap:anywhere; }
.group-author { font-weight:700; }
.group-passage { padding:10px 14px;background:var(--gp-soft);border-radius:8px;font-weight:700; }
.group-empty { text-align:center;padding:30px 16px;color:var(--gp-muted); }
.group-comments,.group-invitation,.group-members { margin-top:16px;border-top:1px solid var(--gp-line);padding-top:12px; }
.groups-page summary { cursor:pointer;color:var(--gp-accent);padding:5px 0; }
.group-members ul { margin:10px 0;padding-left:24px; }
.group-copy-row { display:flex;gap:8px;margin:8px 0; }
.group-copy-row input { flex:1; }
.group-comment { margin:14px 0;padding:14px;background:var(--gp-soft);border-radius:8px; }
.group-comment p { margin-bottom:0; }
.group-comments .group-form { margin-top:16px; }
.group-alert { border-top:1px solid var(--gp-line); }
.group-alert button { display:flex;flex-direction:column;align-items:flex-start;gap:3px;width:100%;text-align:left;background:transparent;border:0;padding:16px 12px;color:var(--gp-text);font:inherit;cursor:pointer;overflow-wrap:anywhere; }
.group-alert.is-unread { background:var(--gp-soft);border-radius:8px; }
.group-badge { display:inline-flex;background:var(--gp-accent);color:#fff;border-radius:20px;padding:0 7px;font-size:13px; }
.groups-page :focus-visible { outline:2px solid var(--gp-accent);outline-offset:3px; }
.groups-page button:disabled { opacity:.6;cursor:wait; }
#create-group,.group-post { scroll-margin-top:95px; }
@media(max-width:600px) { .view.groups-page { padding:22px 14px 32px; }.group-card { padding:18px; }.groups-heading > i { font-size:30px; }.group-list { grid-template-columns:1fr; }.group-tabs a { font-size:14px;padding:8px 10px; } }

.view.groups-page[data-theme="dark"] { --gp-bg:#182329;--gp-soft:#23343b;--gp-text:#e6eeee;--gp-muted:#b6c8cd;--gp-line:#3a4c53;--gp-accent:#83c7b7;background:var(--gp-bg); }
.view.groups-page[data-theme] h1,.view.groups-page[data-theme] h2 { color:var(--gp-text); }
body .view.groups-page a.group-primary { color:#fff;background:#315f58; }
.view.groups-page[data-theme="dark"] .group-primary { color:#142329; }
.view.groups-page[data-theme] a { color:var(--gp-accent); }
.view.groups-page[data-theme] .group-form input,.view.groups-page[data-theme] .group-form textarea,.view.groups-page[data-theme] .group-copy-row input { color:var(--gp-text);background:var(--gp-bg);border-color:var(--gp-line); }