/* ==== THE Duegho look (owner, accepted 2026-10-24): one family (Inter), the page at 110 % on a computer (one factor for every part), ONE type scale
   (a name 15 px 550, a handle / time 14 px grey, a post's text 15 px, the menus 16 px medium, the titles 17 px), soft
   outline Follow buttons, X's text colours. Loaded LAST by every layout: it is the design layer over the components. */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400..700&display=swap");

:root { --dg-ink: #0F1419; --dg-sub: #536471; --dg-line: #EFF3F4; --mo-zoom: 1; --ink: #0F1419; --mute: #536471; --line: #EFF3F4; }

/* 1. no zoom anywhere (the cards' own 1.25 included) */
html .wrap > .nav, html .wrap > .side, html .dg-ptop, html .dg-htabs, html main > .compose, html .dg-actf, html .dg-sr, html .dg-htags,
html .dg-more-from > h3, html .dg-ntop, html .dg-ntabs, html #dgFeed > .empty, html main > .dg-amb-hero, html main > h1, html .ogapoll-core { zoom: 1 !important; }
/* the BODY at 110 % of this 100 % look, on a computer (owner 2026-10-25): the left menu, the centre (the profile's top,
   the tabs, the cards) and the right column, one factor (--dg-scale); the red header and the 2nd header are NOT zoomed.
   (Not the html element: a zoomed html would keep the breakpoints of the unzoomed width and overflow.) */
:root { --dg-scale: 1.1; }
html .ogapoll-core { max-width: 640px; }
@media (min-width: 768px) {
  html .wrap > *:not(.modal):not(.dg-veil) { zoom: var(--dg-scale) !important; }
  html .wrap > .nav, html .wrap > .side { top: calc(112px / var(--dg-scale)); }
}

/* 2. one family */
html body, html .hd, html .m2, html .bb, html #dgNav, html .ogapoll-core, html .ogapoll-core *, html .dg-ptop, html .dg-ptop *, html .side, html .side *,
html .dg-pmodal, html .dg-pmodal *, html .dgm-box, html .dgm-box *, html .pill, html .dg-htabs * { font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important; }
html body { color: var(--dg-ink); font-size: 15px; -webkit-font-smoothing: antialiased; }

/* 3. ONE name, ONE handle, everywhere: the cards, Who to follow, Rising accounts, the circles, the lists, search */
html .dg-post .ogapoll-pc-name, html .side .nm, html .dg-prow2 .who b, html .dg-acc .who b, html .dg-plink b, html .dg-about .row b {
  font-size: 15px !important; font-weight: 550 !important; color: #1F2933 !important; letter-spacing: 0; }
html .dg-post .ogapoll-pc-handle, html .dg-post .dg-time, html .side .sub, html .dg-prow2 .who small, html .dg-acc .who small, html .dg-post .dg-loc,
html .dg-phandle > span:first-child, html .dg-plink small {
  font-size: 14px !important; font-weight: 400 !important; color: var(--dg-sub) !important; }
html .dg-post .dg-time b, html .dg-post .dg-time { font-weight: 400 !important; }
html .dg-ptop .otherprofileslider span { font: 500 13px Inter, system-ui, sans-serif !important; color: var(--dg-ink); margin-top: 6px; }

/* the post: text 15 px, the footer counts 13 px, the comment line 14 px */
html .dg-post .dg-text { font-size: 15px !important; line-height: 1.45 !important; color: var(--dg-ink); font-weight: 400; }
html .dg-post .ogapoll-pc-stat, html .dg-post .dg-count, html .dg-post .ogapoll-vt-n { font-size: 13px !important; font-weight: 500 !important; }
html .dg-post .dg-cm, html .dg-post .dg-cm * { font-size: 14px; }
html .ph-xcard { border-color: var(--dg-line) !important; }

/* the menus: medium, the active one bold */
html #dgNav a, html #dgNav button { font-size: 16px !important; font-weight: 500 !important; color: var(--dg-ink); }
html #dgNav a.on { font-weight: 700 !important; color: var(--red); }
html .m2 .pill { font-size: 14px !important; font-weight: 500 !important; padding: 6px 14px; }
html .m2 .pill.on, html .m2 .dg-ppill-red { font-weight: 600 !important; }
html .side h3, html .box h3 { font-size: 17px !important; font-weight: 650 !important; color: #1F2933; }
html .side .fol, html .dg-ptop .dg-fol, html .dg-prow2 .dg-fol, html .dg-post .dg-fol {
  font-size: 13px !important; font-weight: 500 !important; color: #1D9BF0 !important; background: transparent !important; border: 1px solid #A9D8F7 !important;
  border-radius: 999px !important; padding: 5px 14px !important; box-shadow: none !important; }
html .side .fol:hover, html .dg-ptop .dg-fol:hover, html .dg-prow2 .dg-fol:hover, html .dg-post .dg-fol:hover { background: #EEF7FE !important; }
html .side .fol.on, html .dg-ptop .dg-fol.on, html .dg-prow2 .dg-fol.on, html .dg-post .dg-fol.on { color: #536471 !important; border-color: #E1E8ED !important; }

/* 4. the profile's top: a softer header (name 20 px, bio 15 px, grey stat labels) */
html .dg-ptop h5 { font-size: 20px !important; font-weight: 650 !important; color: #1F2933 !important; }
html .dg-ptop .profileintro li, html .dg-ptop .profileintro li span { font-size: 15px !important; line-height: 1.4 !important; color: var(--dg-ink); }
html .dg-ptop .profileintro li img { width: 15px; height: 15px; opacity: .7; }
html .dg-ptop .accountinfo li, html .dg-ptop .accountinfo li span, html .dg-ptop .accountinfo a { font-size: 14px !important; font-weight: 400 !important; color: var(--dg-sub); }
html .dg-ptop .accountinfo li.website a { color: #1F7BC0; }
html .dg-ptop .profilenumberslisting li { font: 400 13px Inter, system-ui, sans-serif !important; color: var(--dg-sub) !important; }
html .dg-ptop .profilenumberslisting li span { font: 700 17px Inter, system-ui, sans-serif !important; color: var(--dg-ink) !important; }
html .dg-ptop .dg-pbiz, html .dg-ptop .dg-pfy { font-size: 12px !important; font-weight: 500 !important; }
html .dg-ptop .secprofileimg img, html .dg-ptop .dg-pinit { width: 104px; height: 104px; border-width: 2px; }
html .dg-ptop .otherprofileslider img, html .dg-ptop .otherprofileslider .dg-pinit.sm { width: 64px; height: 64px; }
html .dg-ptop .otherprofileslider .item { width: 74px; }

/* the lists (followers, gifts…) and the modals' tabs */
html .dg-pm-head b { font-size: 17px !important; font-weight: 700 !important; }
html .dg-pm-tabs button { font-size: 13px !important; font-weight: 500 !important; }
html .dg-pm-tabs button span { font-size: 15px !important; font-weight: 700 !important; }
html .dg-prow2 .bio { font-size: 14px !important; color: var(--dg-ink); }

/* phones keep their sizes (they never had the zoom) but get the same family and weights */
@media (max-width: 767px) {
  html .dg-ptop h5 { font-size: 17px !important; }
  html .dg-ptop .secprofileimg img, html .dg-ptop .secprofileimg .dg-pinit { width: 76px; height: 76px; }
  html .dg-ptop .profileintro li, html .dg-ptop .profileintro li span { font-size: 14px !important; }
}


/* a phone's card header: Follow = a short blue word, hidden once followed (the base rule, kept over the soft outline) */
@media (max-width: 767px) {
  html .dg-post .ogapoll-pc-actions .dg-fol { border: 0 !important; padding: 0 6px !important; background: none !important; }
  html .dg-post .ogapoll-pc-actions .dg-fol.on { display: none !important; }
}

/* the notifications page on the same scale (owner 2026-10-25: "la colonne du milieu semble encore bien zoomée"): the title
   20 px, the tabs 15 px medium, a card = a list row (a name 15/550, its text 14 px grey, a 40 px photo, quieter padding) */
html .dg-ntop h3 { font: 650 20px Inter, system-ui, sans-serif !important; color: #1F2933; }
html .dg-ntabs a { font-size: 15px !important; font-weight: 500 !important; padding: 8px !important; }
html .dg-ntabs a.on { font-weight: 600 !important; }
html .dg-ncard { padding: 12px 14px 12px 46px !important; border-radius: 14px !important; border-color: var(--dg-line) !important; margin-bottom: 8px !important; }
html .dg-ncard.unread { background: #F5FAFE !important; border-color: #D6ECFB !important; }
html .dg-nstar { top: 20px !important; left: 14px !important; width: 20px !important; height: 20px !important; }
html .dg-nav { width: 40px !important; height: 40px !important; font-size: 14px !important; }
html .dg-ninfo b, html .dg-ninfo strong, html .dg-nhead b, html .dg-nhead strong { font: 550 15px Inter, system-ui, sans-serif !important; color: #1F2933 !important; }
html .dg-ninfo p, html .dg-ninfo span, html .dg-nago { font-size: 14px !important; font-weight: 400 !important; color: var(--dg-sub) !important; }
html .dg-nbody { font-size: 14px !important; margin-top: 6px !important; }
html .dg-nthumb { width: 44px !important; height: 44px !important; border-radius: 8px !important; }
html .dg-ninfo h4 { font: 550 15px Inter, system-ui, sans-serif !important; color: #1F2933 !important; }
/* profile intro (bio, job, school) and the website line smaller; the date/place line keeps 14px (owner 2026-10-25) */
html .dg-ptop .profileintro li, html .dg-ptop .profileintro li span { font-size: 14px !important; line-height: 1.35 !important; }
html .dg-ptop .profileintro li img { width: 13px; height: 13px; }
html .dg-ptop .accountinfo li.website a { font-size: 13px !important; }
@media (max-width: 767px) {
  html .dg-ptop .profileintro li, html .dg-ptop .profileintro li span { font-size: 13px !important; }
  html .dg-ptop .profileintro { gap: 2px; }
}
/* desktop: at most 7 circles visible; the circles grow with the column, the space between them stays the same (owner 2026-10-25) */
@media (min-width: 768px) {
  html .dg-ptop .otherprofileslider .item { flex: 0 0 max(84px, calc((100% - 36px) / 7)) !important; width: auto !important; }
  html .dg-ptop .otherprofileslider img, html .dg-ptop .otherprofileslider .dg-pinit.sm { width: calc(100% - 12px) !important; height: auto !important; aspect-ratio: 1; }
}
html .dg-ptop .otherprofileslider .item { min-width: 0 !important; overflow: hidden; }
html .dg-ptop .otherprofileslider .item span { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* circles row arrows: same height on both sides, centred on the circles, the chevron in its real proportions */
html .dg-cir-arrow { margin: 0 !important; padding: 0 !important; width: 32px; height: 32px; border: 2px solid #fff; }
html .dg-cir-arrow img { width: 8px !important; height: 14px !important; }
html .dg-cir-arrow.prev { left: 2px; } html .dg-cir-arrow.next { right: 2px; }
html .dg-cir-arrow.prev img { margin-right: 2px; } html .dg-cir-arrow.next img { margin-left: 2px; }
