#hgGroups{max-width:900px;margin:auto}#hgGroups h1{font-size:28px}#hgGroups h2{font-size:23px;line-height:1.5;overflow-wrap:anywhere}.hgGroupCard,#hgGroupInvite{border:1px solid #ddd8c8;border-radius:16px;padding:18px;background:#fffcf4;margin:16px 0}#hgGroupInvite[hidden]{display:none}.hgGroupEyebrow{color:#746243;font-weight:700}.hgGroupDescription{white-space:pre-wrap;overflow-wrap:anywhere}.hgGroupMuted,.hgGroupRow small{color:#65645f;font-size:14px}.hgGroupRow{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;text-align:left;padding:14px 12px;border-bottom:1px solid #e4dfd0;background:#fffdf6;border-radius:10px;margin:8px 0}.hgGroupRow strong{display:block;font-size:19px;overflow-wrap:anywhere}.hgGroupRow small{display:block;margin-top:4px}.hgGroupActions{display:flex;flex-wrap:wrap;gap:8px}.hgGroupActions button,#hgGroups button,.hgGroupDialog button{min-height:44px;white-space:normal}.hgGroupMembers{padding:0;list-style:none}.hgGroupMembers li{display:flex;gap:12px;justify-content:space-between;border-bottom:1px solid #e5dfd0;padding:10px 0;overflow-wrap:anywhere}.hgGroupDialog{box-sizing:border-box;width:min(540px,calc(100vw - 24px));max-height:85dvh;overflow-y:auto;border:1px solid #d9d2c0;border-radius:18px;padding:20px;background:#fffdf7;color:#233b3c}.hgGroupDialog::backdrop{background:#142a2a88}.hgGroupDialogHead{display:flex;justify-content:space-between;gap:12px;align-items:center}.hgGroupDialog h2{font-size:23px;line-height:1.5}.hgGroupDialog label{display:block;margin:14px 0;font-weight:600}.hgGroupDialog input,.hgGroupDialog textarea{display:block;box-sizing:border-box;width:100%;font:inherit;font-size:17px;padding:10px;margin-top:6px;border:1px solid #aaa;border-radius:8px}.hgGroupDialog textarea{resize:vertical}#hgGroupStatus{min-height:1.6em}#hgGroups [hidden]{display:none!important}@media(max-width:480px){.hgGroupActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.hgGroupActions button{font-size:16px;padding:9px 7px}.hgGroupActions .hgPrimary{grid-column:1/-1}.hgGroupCard,#hgGroupInvite{padding:14px}}
/* HG 10.7: comfortable touch targets, compact class and discovery layouts. */
.hgGroupManage{margin:16px 0;border:1px solid #e5dfd0;border-radius:12px;padding:12px}.hgGroupManage summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-size:18px;font-weight:700}.hgGroupManage[open] summary{margin-bottom:10px}.hgGroupMembers li{align-items:flex-start}.hgGroupMembers small{display:inline-block;margin-left:12px;color:#746243}.hgGroupMembers p{white-space:pre-wrap;font-size:16px;margin:5px 0}.hgGroupMembers button{flex-shrink:0}.hgGroupDialog select,.hgDiscovery select,.hgDiscovery input{display:block;box-sizing:border-box;width:100%;font:inherit;min-height:44px;padding:10px;border:1px solid #c7c5bc;background:#fff;border-radius:8px;color:#142e50}.hgGroupDialog .hgCheck{display:flex;gap:10px;align-items:center}.hgGroupDialog .hgCheck input{width:22px;height:22px;margin:0;flex-shrink:0}.hgDiscovery{max-width:900px;margin:auto;padding:20px 0}.hgDiscovery h1{font-size:28px;margin:8px 0}.hgDiscovery>p{margin:8px 0 16px}.hgScopeTabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:18px 0}.hgScopeTabs button{min-height:48px;font-size:18px;padding:10px 5px;white-space:normal}.hgScopeTabs button.active{background:#ffd531;color:#142e50;font-weight:700}.hgAreaForm{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.hgAreaForm label{flex:1;min-width:110px}.hgAreaForm button{min-height:44px}.hgClassPost,.hgClassDirectory{border:1px solid #e5dfd0;border-radius:14px;background:#fffdf7;padding:16px;margin:12px 0;overflow-wrap:anywhere}.hgClassPostMeta{display:flex;justify-content:space-between;gap:8px}.hgClassPost small,.hgClassDirectory small{color:#65645f;font-size:14px}.hgClassPost p,.hgClassDirectory p{white-space:pre-wrap;margin:12px 0;font-size:18px}.hgClassDirectory strong,.hgClassDirectory small{display:block}.hgClassJoin{display:inline-block;min-height:44px;padding:10px;border-radius:8px;background:#ffd531;color:#142e50}.hgClassEmpty{padding:20px 0}.hgDiscoverLegacy{margin:24px 0}.hgDiscoverLegacy>summary{cursor:pointer;padding:14px;font-size:15px;color:#65645f}.hgDiscovery [hidden]{display:none!important}@media(max-width:480px){.hgDiscovery h1{font-size:26px}.hgClassPost{padding:12px}.hgClassPost .hgGroupActions{display:flex}.hgScopeTabs button{font-size:17px}.hgGroupMembers li>div{min-width:0}}
#hgClassroom{max-width:900px;margin:auto}#hgClassroom h1{font-size:28px;overflow-wrap:anywhere}#hgClassroom h2{font-size:23px;line-height:1.5}#hgClassroom [hidden]{display:none!important}.hgClassEventRow{display:flex;width:100%;align-items:center;justify-content:space-between;gap:12px;text-align:left;white-space:normal;border:1px solid #e5dfd0;border-radius:12px;background:#fffdf7;padding:14px;margin:10px 0}.hgClassEventRow span{min-width:0}.hgClassEventRow strong{display:block;font-size:19px;overflow-wrap:anywhere}.hgClassEventRow small{display:block;font-size:15px;line-height:1.6;color:#65645f}.hgClassMaterial,.hgClassRoster,.hgClassComment{padding:14px 0;border-bottom:1px solid #e5dfd0;overflow-wrap:anywhere}.hgClassRoster strong,.hgClassRoster small{display:block;white-space:pre-wrap}.hgClassRoster small{margin:5px 0}.hgClassRoster select{font:inherit;min-height:44px;max-width:100%;padding:6px;border-radius:8px}.hgClassComment small{display:block;font-size:14px;color:#65645f}.hgClassComment p{white-space:pre-wrap;font-size:17px}.hgGroupDialog [hidden]{display:none!important}#hgClassFields input[type=datetime-local]{min-width:0;width:100%;max-width:100%}@media(max-width:480px){#hgClassroom h1{font-size:25px}.hgClassRoster .hgGroupActions{display:flex}}

/* Compact class video catalogue; no public thumbnails or embedded player. */
.hgVideoRow{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid #ded9c9}.hgVideoText{min-width:0;flex:1}.hgVideoText h2{font-size:1.1rem;line-height:1.45;margin:0 0 6px;overflow-wrap:anywhere}.hgVideoText p{margin:6px 0;white-space:pre-wrap;overflow-wrap:anywhere}.hgVideoText summary{font-size:.9rem;cursor:pointer;color:#536273}.hgVideoRow .hgGroupActions{margin:0;flex-shrink:0}.hgVideoRow button{padding:10px 14px;min-height:44px}#hgVideoURL{overflow-wrap:anywhere}@media(max-width:600px){.hgVideoRow{align-items:stretch;flex-direction:column;gap:8px}.hgVideoRow .hgGroupActions{display:flex;flex-wrap:wrap}.hgVideoRow button{flex:1}}

.hgAlbumGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.hgAlbumCard{border:1px solid #e3ddce;border-radius:16px;padding:12px;min-width:0}.hgAlbumCard h2{font-size:1.1rem;margin:10px 0;overflow-wrap:anywhere}.hgAlbumCard p{white-space:pre-wrap;overflow-wrap:anywhere}.hgAlbumPhoto{display:block;padding:0;width:100%;overflow:hidden;border:0;background:#f5f2e9;border-radius:10px}.hgAlbumPhoto img{display:block;object-fit:contain;width:100%;height:210px}.hgAlbumPhoto span{display:block;padding:8px;font-size:.85rem}.hgAlbumPreview{width:min(900px,94vw)}.hgAlbumPreview img{display:block;max-width:100%;max-height:75vh;object-fit:contain;margin:auto}.hgAlbumCard summary{cursor:pointer;color:#536273}#hgMyRequests:empty{display:none}@media(max-width:540px){.hgAlbumGrid{grid-template-columns:1fr}.hgAlbumPhoto img{height:240px}}

/* Class-only chat, sized for touch and older readers. */
.hgChatRows{height:48vh;height:48dvh;min-height:220px;max-height:620px;overflow:auto;overscroll-behavior:contain;border:1px solid #ddd8c9;border-radius:16px;padding:14px;background:#f6f4ec;scrollbar-gutter:stable}
.hgChatMessage{width:fit-content;max-width:88%;margin:0 0 14px;padding:12px 16px;background:white;border:1px solid #e1ded3;border-radius:16px;overflow-wrap:anywhere;text-align:left}
.hgChatMessage.hgChatMine{margin-left:auto;background:#fff2c0}.hgChatMeta{display:flex;gap:12px;flex-wrap:wrap;align-items:baseline;font-size:.9em}.hgChatMeta time{color:#666;font-size:.85em}.hgChatBody{white-space:pre-wrap;margin:8px 0;line-height:1.6}.hgChatMessage blockquote{border-left:3px solid #cfb656;margin:8px 0;padding:6px 10px;white-space:pre-wrap;color:#585747;font-size:.9em}.hgChatMessageActions{display:flex;gap:8px;margin-top:8px}.hgChatMessageActions button{font-size:.9em;padding:6px 12px;min-height:40px}.hgChatAttachment{white-space:normal;text-align:left;max-width:100%}.hgChatComposer{padding:12px 0;background:#fffdf6}.hgChatComposer textarea{width:100%;box-sizing:border-box;font:inherit;padding:12px;resize:vertical;border:1px solid #ccd2db;border-radius:12px}.hgChatComposeActions{display:flex;gap:8px;align-items:start;flex-wrap:wrap;margin-top:8px}.hgChatComposeActions>button,.hgChatComposeActions>details>summary{padding:10px 16px;min-height:46px}.hgChatComposeActions>details>summary{cursor:pointer;box-sizing:border-box}.hgChatComposeActions #hgChatSend{margin-left:auto}.hgChatEmoji{display:flex;gap:6px;flex-wrap:wrap}.hgChatDraft{display:flex;gap:8px;align-items:center;flex-wrap:wrap;overflow-wrap:anywhere;font-size:.9em}.hgChatDraft:empty{display:none}.hgChatDraft span{flex:1 1 180px}.hgChatBadge{display:inline-block;background:#fff0b0;color:#17324f;border-radius:16px;padding:2px 8px;font-size:.8em}.hgChatBadge[hidden]{display:none}#hgChatPickRows{max-height:50vh;overflow:auto}#hgChatPhoto{max-width:100%;height:auto}#hgChatStatus{font-size:.9em;min-height:1.5em;margin:8px 0}#hgChat h1{font-size:clamp(1.3rem,4vw,2rem);margin:12px 0}@media(max-width:520px){.hgChatMessage{max-width:94%;padding:10px 12px}.hgChatRows{padding:8px}.hgChatComposeActions{gap:4px}.hgChatComposeActions>button{padding:10px 12px}}

/* Five clearly named entry points: 3 + 2 on phones, one row on wider screens. */
.hgGroupQuickActions{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.hgGroupQuickActions>button{box-sizing:border-box;position:relative;flex:1 1 calc((100% - 12px)/3);min-width:0;min-height:46px;margin:0;padding:8px 4px;font-size:16px;line-height:1.5;white-space:nowrap;border-radius:8px}
.hgGroupQuickActions .hgChatBadge{position:absolute;top:-8px;right:0;max-width:72px;font-size:11px;line-height:16px;padding:1px 5px;white-space:nowrap}
.hgQuickMore{margin:6px 0 12px}
.hgQuickMore>summary{display:list-item;cursor:pointer;min-height:44px;box-sizing:border-box;padding:10px 2px;font-size:16px;color:#526071}
.hgQuickMore[open]>.hgGroupActions{padding:6px 0}
@media(min-width:600px){.hgGroupQuickActions>button{flex-basis:calc((100% - 30px)/6)}}

/* Current class invitation: keep a readable label and a clear LINE action. */
.hgGroupQuickActions>button.hgLineShare{background:#06733c;color:#fff;font-weight:700;border-color:#06733c}

/* Member search must fit its card, including iOS native form controls. */
#hgGroupDetail .hgMemberFilters{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:10px;align-items:end;margin:12px 0 4px}
#hgGroupDetail .hgMemberFilters>label{display:block;min-width:0;margin:0;color:#142e50;font-size:16px;font-weight:600;letter-spacing:0;line-height:1.5}
#hgGroupDetail .hgMemberFilters input,#hgGroupDetail .hgMemberFilters select{display:block;box-sizing:border-box;width:100%;max-width:100%;min-width:0;min-height:46px;margin:4px 0 0;padding:8px 10px;border:1px solid #c7c5bc;border-radius:8px;background:#fff;color:#142e50;font:inherit;font-size:18px;line-height:1.5;letter-spacing:0}
#hgGroupDetail .hgMemberFilters input{-webkit-appearance:none;appearance:none}
#hgMemberFound{font-size:14px;color:#526071;margin:6px 0}
#hgMemberFound:empty{display:none}
#hgGroups .hgGroupQuickActions>button,.hgPage .hgGroupQuickActions>button:not(.hgQuestion){padding:8px 4px;min-height:46px;font-size:16px;line-height:1.5;white-space:nowrap;letter-spacing:0}
.hgPage details.hgQuickMore{margin:6px 0 12px;padding:0}
.hgPage .hgGroupQuickActions>button.hgLineShare{background:#06733c;color:#fff;border-color:#06733c}
@media(max-width:480px){#hgGroupDetail .hgMemberFilters{grid-template-columns:minmax(0,1fr);gap:8px}}
@media(max-width:360px){#hgGroups .hgGroupQuickActions>button,.hgPage .hgGroupQuickActions>button:not(.hgQuestion){flex-basis:calc((100% - 6px)/2)}}

/* Media-first class home: keep the roster and its filters closed by default. */
#hgGroupDetail .hgGroupCard{margin:8px 0;padding:12px 14px}
#hgGroupDetail .hgGroupCard>h2{margin:10px 0 4px;font-size:23px;line-height:1.4}
#hgGroupDetail .hgGroupCard>.hgGroupMuted{margin:4px 0;font-size:16px}
#hgGroupDetail .hgGroupCard>.hgGroupDescription{margin:6px 0;font-size:17px;line-height:1.5}
#hgGroupDetail details.hgQuickMore{margin:4px 0 0;padding:0;border:0}
#hgGroupDetail details.hgQuickMore>summary{margin:0;padding:10px 2px;min-height:44px;font-size:16px;line-height:1.5;letter-spacing:0;border:0}
#hgGroupHighlights{padding-top:0}
#hgGroupHighlights .hgDiscoverShelf{margin-top:12px;padding-top:12px}
/* Four discovery ranges with dependent city/district selectors. */
#hgDiscoverScope .hgScopeTabs{grid-template-columns:repeat(4,minmax(0,1fr));margin:12px 0;gap:6px}
#hgDiscoverScope .hgScopeTabs button{min-width:0;min-height:46px;padding:8px 3px;white-space:nowrap;font-size:17px;letter-spacing:0}
#hgDiscoverScope .hgDiscoverArea{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:8px}
#hgDiscoverScope .hgDiscoverArea label,#hgDiscoverScope .hgDiscoverGroupLabel{display:block;min-width:0;margin:0;color:#142e50;font-size:16px;letter-spacing:0;line-height:1.5}
#hgDiscoverScope .hgDiscoverArea select{min-width:0;max-width:100%;margin-top:4px;font-size:18px}
#hgDiscoverScope .hgScopeHint{font-size:16px;margin:8px 0}

/* Use native linked selectors when creating or editing a class. */
#hgGroupEditor .hgGroupAreaFields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#hgGroupEditor .hgGroupAreaFields label{min-width:0;margin:8px 0}
#hgGroupEditor label{color:#142e50;letter-spacing:0}
#hgGroupEditor .hgGroupAreaFields select{box-sizing:border-box;width:100%;min-width:0;max-width:100%;min-height:48px;margin-top:6px;font-size:18px}
@media(max-width:360px){#hgGroupEditor .hgGroupAreaFields{grid-template-columns:minmax(0,1fr);gap:0}}

.hgInviteLogin{display:inline-block;padding:12px 18px;border-radius:12px;text-decoration:none;color:#0b2c50;font-weight:700;line-height:1.5}
/* Discovery shelves: three previews per row, followed by classmates' nine goods. */
.hgDiscovery .hgDiscoverShelf{margin:22px 0 0;padding:18px 0 0;border-top:1px solid #dfd8c9}
.hgDiscovery .hgDiscoverShelfHead{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.hgDiscovery .hgDiscoverShelfHead h2{font-size:22px;line-height:1.4;margin:0;color:#192d49}
.hgDiscovery .hgDiscoverShelfHead>button{font-size:16px;min-height:44px;padding:8px 4px;background:transparent;color:#42604d;white-space:nowrap;border:0}
.hgDiscovery .hgDiscoverMediaGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.hgDiscovery .hgDiscoverMediaCard{display:block;min-width:0;width:100%;padding:0;border:0;background:transparent;color:#192d49;text-align:left;border-radius:10px;overflow:hidden}
.hgDiscovery .hgDiscoverCover{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:#e8e5dc;border-radius:10px}
.hgDiscovery .hgDiscoverCover img{display:block;width:100%;height:100%;object-fit:cover}
.hgDiscovery .hgDiscoverCover small{position:absolute;inset:0;display:grid;place-content:center;font-size:14px;color:#425047}
.hgDiscovery .hgDiscoverVideoCover{aspect-ratio:16/9}
.hgDiscovery .hgDiscoverVideoCover b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-content:center;width:34px;height:34px;background:#162a42cc;color:#fff;border-radius:50%;font-size:16px}
.hgDiscovery .hgDiscoverMediaTitle{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;font-size:16px;line-height:1.5;margin-top:6px}
.hgDiscovery .hgDiscoverMediaStatus{grid-column:1/-1;font-size:17px;color:#60645d;margin:4px 0;line-height:1.7}
.hgDiscovery .hgDiscoverMediaStatus button{margin-left:10px;min-height:44px}
.hgDiscovery .hgDiscoverGoodGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.hgDiscovery .hgDiscoverGoodGrid button{font-size:18px;min-height:48px;padding:8px 2px;border:1px solid #e0d9c9;border-radius:8px;background:#f7f1df;color:#263c4d}
.hgDiscovery .hgDiscoverGoodHint{font-size:16px;line-height:1.6;color:#68645c;margin:12px 0}
.hgDiscovery #hgDiscoverGoods.hgDiscoverGuest{border:0;padding:0}
.hgDiscoverGuest>.hgDiscoverShelfHead,.hgDiscoverGuest>.hgDiscoverGoodGrid,.hgDiscoverGuest>.hgDiscoverGoodHint{display:none}
.hgDiscovery .hgClassEmpty{padding:6px 0;margin:8px 0;font-size:18px;line-height:1.7}
@media(max-width:360px){.hgDiscovery .hgDiscoverShelfHead h2{font-size:20px}.hgDiscovery .hgDiscoverMediaGrid{gap:6px}.hgDiscovery .hgDiscoverShelfHead>button{font-size:15px}}

.hgVideoCategories{display:flex;gap:8px;margin:8px 0 12px}.hgVideoCategories button{flex:1;font-size:18px;min-height:44px;padding:8px;border:1px solid #ddd6c7;border-radius:8px;background:#fffdf6;color:#1c3553}.hgVideoCategories button[aria-pressed=true]{background:#ffdf62;font-weight:700}.hgDiscoverCourseList{display:grid;gap:8px}.hgDiscoverCourseList a.hgCoursePointButton{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;box-sizing:border-box;width:100%;min-width:0;min-height:48px;padding:10px 14px;border:1px solid #c9ac54;border-radius:10px;background:#fff3bd;color:#142d50;text-decoration:none;font-size:18px;line-height:1.45;cursor:pointer;box-shadow:0 1px 2px #142d5010}.hgDiscoverCourseList .hgCoursePointButton strong{flex:1 1 160px;min-width:0;overflow-wrap:anywhere}.hgDiscoverCourseList .hgCoursePointButton span{font-size:16px;font-weight:700;white-space:nowrap}.hgDiscoverCourseList a.hgCoursePointButton:hover{background:#ffe798;border-color:#a88421}.hgDiscoverCourseList a.hgCoursePointButton:active{background:#ffdf72}.hgDiscoverCourseList a.hgCoursePointButton:focus-visible{outline:3px solid #142d50;outline-offset:3px}

/* System administrator deletion confirmation. */
.hgGroupDialog .hgDeleteGroupButton,.hgGroupActions .hgDeleteGroupButton{color:#a12b25;border:1px solid #c98b85;background:#fff5f3;font-weight:700}
#hgGroupDeletePassword{box-sizing:border-box;width:100%;min-height:48px;font-size:20px;padding:10px;border:1px solid #9b9b9b;border-radius:8px}
#hgGroupDelete label{font-size:18px;display:block;margin-bottom:8px}
#hgGroupDeleteStatus{min-height:1.5em;font-size:18px}