/* YOU’RE NEXT navigation (RENAME-REFACTOR R2; owner 2026-10-26: 홈 · 전망 · 생존 · 플레이 · 유머, KR first). One header and one
   phone bar on every page of a market, drawn as a static skeleton by the page builders (scripts/nav/build.py) and
   upgraded by /app/nav/{cc}.js: the three groups open the 발견 screen's illustrated cards (the shared discovery card
   renderer, /app/discovery/banners.js) in a panel under the header (computer) or a sheet above the bar (phone).
   Tokens are the site's own (src/portal/shared/site-tokens.css; the dock box of /app/navigation/style.css).
   Dock contract: the bar is nav#yn-dock with the dock's box (63px, insets 12px, bottom 14px, z 45) and no inline style.
   Google's bottom anchor ad: the ad runtime (src/ads/place) measures it, handle included, plus 16px into html{--yn-anchor}
   (phones only; 0 or unset without one), and this file moves the bar up by it (transform), adds it to the body's bottom
   padding and lifts the card sheet with it; nothing here touches #ad-rail-right. Until a page has measured its own anchor,
   html.ynn-anchor-pre gives it the room the last page measured (nav.js anchorRoom). */

/* the old menus of a page that carries this one stay in the document for their scripts, hidden */
#ynn-header~#root>header.top,#ynn-header~#root>#yn-peek,#ynn-header~#root>#yn-rail,#ynn-header~#root>#yn-services:not([open]),
#ynn-header~#yn-rail,#ynn-header~#yn-standalone>#yn-header,#ynn-header~#yn-services:not([open]),
#ynn-header~header.hd,#ynn-header~header.guide-header,#ynn-header~nav.tabbar,body:has(>#ynn-header)>header.hd{display:none!important}

/* colours (2026-10-30 owner: back to the light theme, research/2026-10-30-light-theme/PALETTE.md): the menu's own set, the same on
   every page family whatever its own tokens are called; the former dark set under :root[data-theme="dark"] (future toggle).
   The discovery cards inside the panel and the sheet stay the dark cards they are (banners.css). */
:root{--ynn-top:rgba(255,255,255,.91);--ynn-line:rgba(28,38,56,.10);--ynn-text:#161B26;--ynn-muted:#5B6476;--ynn-faint:#667185;
  --ynn-sub:#5B6476;--ynn-label:#465063;--ynn-hi:#2D3444;--ynn-icon:#3A4254;--ynn-ring:#B52464;--ynn-tint:rgba(28,38,56,.05);
  --ynn-item-on:#B52464;--ynn-bar-on:#B52464;--ynn-on:#B52464;--ynn-on-bg:#FBEAF1;
  --ynn-field:rgba(28,38,56,.035);--ynn-field-2:rgba(28,38,56,.06);--ynn-field-line:rgba(28,38,56,.14);--ynn-field-line-2:rgba(28,38,56,.24);
  --ynn-btn:#FFFFFF;--ynn-btn-line:rgba(28,38,56,.14);--ynn-query:#F5F6F9;
  --ynn-menu:#FFFFFF;--ynn-menu-hover:#EFF1F6;--ynn-menu-line:rgba(28,38,56,.12);--ynn-menu-shadow:0 2px 6px rgba(28,38,56,.05),0 18px 44px rgba(28,38,56,.14);
  --ynn-panel:#FFFFFF;--ynn-panel-line:rgba(28,38,56,.12);--ynn-panel-shadow:0 2px 6px rgba(28,38,56,.05),0 20px 60px rgba(28,38,56,.16);
  --ynn-scrim:rgba(22,29,43,.42);--ynn-scrim-phone:rgba(22,29,43,.42);--ynn-count:#EFF1F6;
  --ynn-card:#FFFFFF;--ynn-card-line:rgba(28,38,56,.10);
  --ynn-dock:rgba(255,255,255,.96);--ynn-dock-line:rgba(28,38,56,.10);--ynn-dock-shadow:0 4px 24px rgba(28,38,56,.094);--ynn-tab:#5B6476}
:root[data-theme="dark"]{--ynn-top:rgba(11,13,18,.86);--ynn-line:rgba(255,255,255,.08);--ynn-text:#F2F4F8;--ynn-muted:#A3A9BA;--ynn-faint:#858CA0;
  --ynn-sub:#8D9EB8;--ynn-label:#B7C5DA;--ynn-hi:#C9CFDC;--ynn-icon:#CBD6E6;--ynn-ring:#F5F6FA;--ynn-tint:rgba(255,255,255,.07);
  --ynn-item-on:#F2F4F8;--ynn-bar-on:initial;--ynn-on:initial;--ynn-on-bg:initial;
  --ynn-field:rgba(255,255,255,.03);--ynn-field-2:rgba(255,255,255,.06);--ynn-field-line:rgba(255,255,255,.10);--ynn-field-line-2:rgba(255,255,255,.22);
  --ynn-btn:#151B27;--ynn-btn-line:rgba(255,255,255,.125);--ynn-query:#0B0E15;
  --ynn-menu:#121620;--ynn-menu-hover:#191D29;--ynn-menu-line:rgba(255,255,255,.10);--ynn-menu-shadow:0 24px 64px rgba(0,0,0,.6);
  --ynn-panel:#10151F;--ynn-panel-line:rgba(255,255,255,.14);--ynn-panel-shadow:0 20px 80px rgba(0,0,0,.53);
  --ynn-scrim:rgba(4,5,9,.58);--ynn-scrim-phone:rgba(4,5,9,.6);--ynn-count:rgba(255,255,255,.07);
  --ynn-card:rgba(255,255,255,.025);--ynn-card-line:rgba(255,255,255,.07);
  --ynn-dock:#191f2ef5;--ynn-dock-line:#ffffff25;--ynn-dock-shadow:0 8px 35px #0008;--ynn-tab:#a9b6ca}

.ynn-header,.ynn-header *,.ynn-layer,.ynn-layer *,#yn-dock.ynn-dock,#yn-dock.ynn-dock *,.ynn-foot,.ynn-foot *{box-sizing:border-box}
.ynn-header,.ynn-layer,#yn-dock.ynn-dock,.ynn-foot{word-break:keep-all;overflow-wrap:break-word}
.ynn-header svg,.ynn-layer svg,#yn-dock.ynn-dock svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* header */
.ynn-header{position:sticky;top:0;z-index:50;margin:0;padding:0;background:var(--ynn-top);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--ynn-line);color:var(--ynn-text);font:400 15px/1.5 'Instrument Sans',yn-is-a,yn-is-r,'Noto Sans KR',yn-kr-m,system-ui,-apple-system,'Segoe UI',sans-serif;letter-spacing:normal;text-align:left}
.ynn-bar{display:flex;align-items:center;gap:34px;height:72px;max-width:1248px;margin:0 auto;padding:0 24px}
.ynn-brand{display:flex;align-items:center;gap:10px;color:var(--ynn-text);text-decoration:none;font:800 19px/1 Sora,yn-so-a,yn-so-r,'Noto Sans KR',system-ui,sans-serif;letter-spacing:-.01em;white-space:nowrap}
.ynn-brand:hover{color:var(--ynn-text);text-decoration:none}
.ynn-ring{width:20px;height:20px;border-radius:50%;flex:none;background:conic-gradient(from 210deg,#3DE8C6,#FFC83D,#FF7A45,#FF3D8A,#3DE8C6);-webkit-mask:radial-gradient(circle,transparent 5.2px,#000 5.8px);mask:radial-gradient(circle,transparent 5.2px,#000 5.8px)}
.ynn-nav{display:flex;align-self:stretch;gap:4px;margin:0;padding:0}
.ynn-item{position:relative;display:flex;align-items:center;gap:5px;margin:0;padding:0 13px;border:0;background:none;color:var(--ynn-muted);font:600 15px/1 'Instrument Sans','Noto Sans KR',system-ui,sans-serif;text-decoration:none;white-space:nowrap;cursor:pointer;transition:color .15s}
.ynn-item>svg{width:13px;height:13px;stroke-width:2.2;opacity:.75;transition:transform .18s}
.ynn-item:hover,.ynn-item.is-active,.ynn-item[aria-expanded="true"]{color:var(--ynn-text);text-decoration:none}
.ynn-item.is-active{color:var(--ynn-item-on)}
.ynn-item[aria-expanded="true"]>svg{transform:rotate(180deg);opacity:1}
.ynn-item[aria-expanded="true"]::before{content:"";position:absolute;inset:18px 2px;z-index:-1;border-radius:11px;background:var(--ynn-tint)}
.ynn-item.is-active::after{content:"";position:absolute;left:13px;right:13px;bottom:-1px;height:2px;border-radius:2px;background:var(--ynn-bar-on,rgb(var(--ynn-rgb)))}
.ynn-item[data-ynn-key="home"].is-active::after{background:linear-gradient(90deg,#3DE8C6 0%,#FFC83D 38%,#FF7A45 66%,#FF3D8A 100%)}
.ynn-item:focus-visible,.ynn-search:focus-visible,.ynn-picker:focus-visible,.ynn-layer a:focus-visible,.ynn-layer button:focus-visible,#yn-dock.ynn-dock>.ynn-tab:focus-visible,.ynn-menu a:focus-visible{outline:2px solid var(--ynn-ring);outline-offset:3px;border-radius:10px}
.ynn-tools{position:relative;display:flex;align-items:center;gap:10px;margin-left:auto}
.ynn-search{display:flex;align-items:center;gap:10px;height:40px;min-width:216px;margin:0;padding:0 14px;border:1px solid var(--ynn-field-line);border-radius:12px;background:var(--ynn-field);color:var(--ynn-faint);font:500 14px/1 'Instrument Sans','Noto Sans KR',system-ui,sans-serif;cursor:pointer;text-decoration:none;transition:border-color .15s,color .15s,background .15s}
.ynn-search>svg{width:17px;height:17px;color:var(--ynn-muted)}
.ynn-search:hover,.ynn-search[aria-expanded="true"]{border-color:var(--ynn-field-line-2);background:var(--ynn-field-2);color:var(--ynn-hi);text-decoration:none}
.ynn-picker{display:flex;align-items:center;gap:8px;height:40px;margin:0;padding:0 14px;border:1px solid var(--ynn-field-line);border-radius:12px;background:none;color:var(--ynn-text);font:600 13px/1 'Instrument Sans','Noto Sans KR',system-ui,sans-serif;cursor:pointer;text-decoration:none}
.ynn-picker>svg{width:14px;height:14px;stroke-width:2;color:var(--ynn-muted)}
.ynn-picker .ynn-short{display:none}
.ynn-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:52;display:grid;min-width:240px;max-height:min(70vh,520px);overflow:auto;padding:6px;border:1px solid var(--ynn-menu-line);border-radius:14px;background:var(--ynn-menu);box-shadow:var(--ynn-menu-shadow)}
.ynn-menu[hidden]{display:none}
.ynn-menu a,.ynn-menu button{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;margin:0;padding:10px 12px;border:0;border-radius:9px;background:none;color:var(--ynn-muted);font:500 14px/1.3 'Instrument Sans','Noto Sans KR',system-ui,sans-serif;text-align:left;text-decoration:none;cursor:pointer}
.ynn-menu a:hover,.ynn-menu button:hover,.ynn-menu [aria-current]{background:var(--ynn-menu-hover);color:var(--ynn-text)}
.ynn-menu small{color:var(--ynn-faint);font:700 12px/1.6 Sora,system-ui,sans-serif}
.ynn-menu h4{margin:6px 12px 4px;color:var(--ynn-faint);font:600 11px/1.4 'Instrument Sans','Noto Sans KR',system-ui,sans-serif}

/* the card layer: a panel under the header (computer), a sheet above the bar (phone) */
.ynn-layer{position:fixed;inset:73px 0 0;z-index:49;font:400 15px/1.5 'Instrument Sans',yn-is-a,yn-is-r,'Noto Sans KR',yn-kr-m,system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--ynn-text);text-align:left}
.ynn-layer[hidden]{display:none}
.ynn-scrim{position:absolute;inset:0;background:var(--ynn-scrim)}
.ynn-panel{position:relative;max-width:1200px;max-height:calc(100% - 20px);margin:10px auto 0;padding:20px 22px 22px;overflow:auto;border:1px solid var(--ynn-panel-line);border-radius:22px;background:var(--ynn-panel);box-shadow:var(--ynn-panel-shadow)}
.ynn-panel-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 0 16px}
.ynn-panel-head small{display:block;margin:0 0 4px;color:var(--ynn-sub);font-size:11px;line-height:1.2}
.ynn-panel-head h2{display:flex;align-items:center;gap:9px;margin:0;color:var(--ynn-text);font:700 19px/1.2 'Instrument Sans','Noto Sans KR',system-ui,sans-serif}
.ynn-count{display:inline-grid;place-items:center;min-width:22px;height:20px;padding:0 6px;border-radius:7px;background:var(--ynn-count);color:var(--ynn-label);font:600 11.5px/1 'Instrument Sans',system-ui,sans-serif}
.ynn-group-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px}
.ynn-group-head h3{display:flex;align-items:center;gap:8px;margin:0;color:var(--ynn-label);font:600 12px/1.2 'Instrument Sans','Noto Sans KR',system-ui,sans-serif}
.ynn-group-head h3 small{color:var(--ynn-faint);font-weight:500}
.ynn-group-head i{width:7px;height:7px;border-radius:50%;background:rgb(var(--ynn-rgb))}
.ynn-query{display:flex;align-items:center;gap:12px;height:52px;margin:0 0 18px;padding:0 16px;border:1px solid var(--ynn-field-line-2);border-radius:14px;background:var(--ynn-query)}
.ynn-query>svg{width:19px;height:19px;color:var(--ynn-muted)}
.ynn-query input{flex:1;min-width:0;height:100%;margin:0;padding:0;border:0;outline:0;background:none;color:var(--ynn-text);font:500 16px/1 'Instrument Sans','Noto Sans KR',system-ui,sans-serif}
.ynn-query input::placeholder{color:var(--ynn-faint)}
.ynn-query kbd{padding:4px 7px;border:1px solid var(--ynn-field-line);border-radius:7px;color:var(--ynn-faint);font:600 11px/1 'Instrument Sans',system-ui,sans-serif}
.ynn-empty{margin:8px 2px 0;color:var(--ynn-faint);font-size:14px}
.ynn-search-groups{display:grid;gap:18px}

/* the 발견 screen's illustrated cards. Computer: rail-style cards in a grid. */
.ynn-cards{display:grid;grid-template-columns:repeat(var(--ynn-cols,3),minmax(0,1fr));gap:12px}
.ynn-cards>.yn-bn-card{min-height:226px;margin:0}
.ynn-cards .ynb-label .ynb-name{white-space:nowrap}
/* Phone: the home's two-up 인기 기능 tiles (art on top, the short question, the teaser); the name sits where the rank chip
   would be; a group with an odd count ends on one full-width row (the theme-list row) */
.ynn-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ynn-tiles>.ynn-full,.ynn-tiles>.ynn-banner{grid-column:1/-1}
.ynn-tiles>.yn-bn-card{min-height:0;margin:0;padding:14px 12px 16px;border-radius:18px}
.ynn-tiles>.yn-bn-card .ynb-art{position:static;order:-1;width:60px;height:60px;margin:-4px 0 6px -6px}
.ynn-tiles>.yn-bn-card .ynb-label{position:absolute;top:14px;right:12px;left:76px;justify-content:flex-end}
.ynn-tiles>.yn-bn-card .ynb-label>:not(.ynb-name){display:none}
.ynn-tiles>.yn-bn-card .ynb-name{font-size:11px;line-height:1.3;white-space:normal;text-align:right;overflow:visible}
.ynn-tiles>.yn-bn-card .ynb-q,.ynn-tiles>.yn-bn-card .ynb-d,.ynn-tiles>.yn-bn-card .ynb-meta,.ynn-tiles>.yn-bn-card .ynb-go{display:none}
.ynn-tiles>.yn-bn-card .ynb-qs{display:block;margin:0;font:800 15.5px/1.4 var(--ynb-kr);letter-spacing:-.035em}
.ynn-tiles>.yn-bn-card .ynb-foot{padding:12px 0 0;gap:0}
.ynn-tiles>.yn-bn-card .ynb-ans{font-size:19px}
.ynn-tiles>.yn-bn-card .ynb-ans small{font-size:11.5px;margin:0 4px 0 2px}
.ynn-tiles>.yn-bn-row,.ynn-banner>.yn-bn{margin:0}
.ynn-tiles>.yn-bn-row .ynb-new{display:none}   /* the sheet shows no NEW chips (the tiles hide them too): the name keeps its room */
/* the current service: a ring in the card's own colour */
.yn-bn.ynn-current{border-color:rgba(var(--ynb-c-rgb),.75);box-shadow:inset 0 0 0 1px rgba(var(--ynb-c-rgb),.6)}
/* search: every entry as an illustrated row */
.ynn-rows{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ynn-rows>.yn-bn-row{margin:0}
/* fallback (the discovery cards could not load): the menu's own icon cards */
.ynn-hcard{position:relative;display:flex;align-items:center;gap:14px;min-height:80px;padding:15px 16px;border:1px solid var(--ynn-card-line);border-radius:16px;background:var(--ynn-card);color:var(--ynn-text);text-decoration:none}
.ynn-hcard:hover{border-color:rgba(var(--ynn-rgb),.38);background:rgba(var(--ynn-rgb),.05);color:var(--ynn-text);text-decoration:none}
.ynn-hcard.ynn-current{border-color:rgba(var(--ynn-rgb),.45)}
.ynn-glyph{display:grid;place-items:center;flex:none;width:40px;height:40px;border:1px solid rgba(var(--ynn-rgb),.16);border-radius:12px;background:rgba(var(--ynn-rgb),.08);color:color-mix(in srgb,rgb(var(--ynn-rgb)) 45%,#161B26)}   /* light: the group colour darkened to read on white */
:root[data-theme="dark"] .ynn-glyph{color:rgb(var(--ynn-rgb))}
.ynn-glyph>svg{width:20px;height:20px}
.ynn-copy{display:grid;gap:4px;min-width:0}
.ynn-copy b{color:var(--ynn-text);font:600 15px/1.3 'Instrument Sans','Noto Sans KR',system-ui,sans-serif;letter-spacing:-.01em}
.ynn-copy small{color:var(--ynn-muted);font-size:12.5px;line-height:1.4}

/* footer service links (static, for readers without the menu and for crawlers) */
.ynn-foot{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0 0 14px;padding:0;font:500 13px/1.6 'Instrument Sans','Noto Sans KR',system-ui,sans-serif;color:var(--ynn-faint)}
.ynn-foot>div{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline}
.ynn-foot-wrap{max-width:1080px;margin:40px auto 0;padding:20px 20px 4px;border-top:1px solid var(--ynn-line)}
.ynn-foot b{color:var(--ynn-muted);font-weight:600}
.ynn-foot a{color:var(--ynn-faint);text-decoration:none}
.ynn-foot a:hover{color:var(--ynn-text)}

/* phone */
#yn-dock.ynn-dock{display:none}
@media (max-width:960px){
  .ynn-bar{height:56px;gap:10px;padding:0 16px}
  .ynn-nav{display:none}
  .ynn-search{justify-content:center;width:44px;min-width:0;height:44px;padding:0;border-color:var(--ynn-btn-line);background:var(--ynn-btn);color:var(--ynn-icon)}
  .ynn-search>span{display:none}
  .ynn-search>svg{width:18px;height:18px;color:var(--ynn-icon)}
  .ynn-picker{height:44px;padding:0 12px 0 13px;border-radius:13px;font-size:14px}
  .ynn-picker .ynn-long{display:none}
  .ynn-picker .ynn-short{display:inline}
  body:has(>#ynn-header){padding-bottom:calc(96px + env(safe-area-inset-bottom,0px) + var(--yn-anchor,0px))}
  #yn-dock.ynn-dock{transform:translateY(calc(-1 * var(--yn-anchor,0px)));transition:transform .2s ease-out}
  html.ynn-anchor-pre{--yn-anchor:var(--ynn-anchor-pre,0px)}html.ynn-anchor-pre #yn-dock.ynn-dock{transition:none}   /* the last page's anchor room until this page's anchor is measured (nav.js anchorRoom, D11): the bar starts up there */
  #yn-dock.ynn-dock{display:flex;position:fixed;left:12px;right:12px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:45;flex-direction:row;flex-wrap:nowrap;align-items:stretch;gap:3px;width:auto;height:auto;margin:0;padding:5px;border:1px solid var(--ynn-dock-line);border-radius:23px;background:var(--ynn-dock);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:var(--ynn-dock-shadow);font:400 10px/12px 'Instrument Sans','Noto Sans KR',system-ui,-apple-system,'Segoe UI',sans-serif;letter-spacing:normal;text-align:center;-webkit-text-size-adjust:100%;text-size-adjust:100%}
  #yn-dock.ynn-dock>.ynn-tab{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1 1 0;min-width:0;height:51px;margin:0;padding:0;gap:4px;border:0;border-radius:17px;background:none;color:var(--ynn-tab);font:inherit;text-decoration:none;cursor:pointer;transition:background .15s,color .15s}
  #yn-dock.ynn-dock>.ynn-tab>svg{display:block;width:22px;height:22px;padding:1.5px;overflow:visible}
  #yn-dock.ynn-dock>.ynn-tab>span{display:block;max-width:100%;height:12px;overflow:hidden;line-height:12px;white-space:nowrap;text-overflow:ellipsis}
  #yn-dock.ynn-dock>.ynn-tab.is-active{background:var(--ynn-on-bg,rgba(var(--ynn-rgb),.1));color:var(--ynn-on,rgb(var(--ynn-rgb)))}
  html.ynn-open #yn-dock.ynn-dock{z-index:61}
  html.ynn-open,html.ynn-open body{overflow:hidden}
  .ynn-layer{inset:0;z-index:60}
  .ynn-scrim{background:var(--ynn-scrim-phone)}
  .ynn-sheet{position:absolute;left:12px;right:12px;bottom:calc(14px + 63px + 10px + env(safe-area-inset-bottom,0px) + var(--yn-anchor,0px));display:flex;flex-direction:column;max-height:calc(100% - 57px - 87px - 20px - var(--yn-anchor,0px));border:1px solid var(--ynn-panel-line);border-radius:24px;background:var(--ynn-panel);box-shadow:var(--ynn-panel-shadow);overflow:hidden}
  .ynn-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 12px 14px 17px;border-bottom:1px solid var(--ynn-line)}
  .ynn-sheet-head small{display:block;margin:0 0 3px;color:var(--ynn-sub);font-size:10px;line-height:1.3}
  .ynn-sheet-head h2{margin:0;color:var(--ynn-text);font:700 21px/1.3 'Instrument Sans','Noto Sans KR',system-ui,sans-serif}
  .ynn-sheet-head h2 .ynn-count{margin-left:8px;vertical-align:3px}
  .ynn-sheet-actions{display:flex;align-items:center;gap:4px}
  .ynn-icon{display:grid;place-items:center;width:44px;height:44px;margin:0;padding:0;border:0;border-radius:50%;background:none;color:var(--ynn-icon);cursor:pointer}
  .ynn-icon>svg{width:20px;height:20px}
  .ynn-icon.ynn-close{border:1px solid var(--ynn-panel-line)}
  .ynn-sheet-body{padding:14px 12px 10px;overflow:auto;overscroll-behavior:contain}
  .ynn-sheet-body .ynn-query{height:46px;margin:0 0 14px}
  .ynn-rows{grid-template-columns:minmax(0,1fr)}
  .ynn-tiles .ynn-hcard{min-height:72px}
  .ynn-menu{position:fixed;left:12px;right:12px;top:62px;min-width:0}
}
@media (max-width:374px){.ynn-tiles>.yn-bn-card .ynb-qs{font-size:14.5px;letter-spacing:-.045em}}   /* 360: a long question keeps two lines in a tile */
@media (max-width:359px){.ynn-brand{font-size:17px;gap:8px}}
@media (prefers-reduced-motion:reduce){.ynn-item>svg,.ynn-item,.ynn-search,#yn-dock.ynn-dock,#yn-dock.ynn-dock>.ynn-tab{transition:none}}

/* Result discover room (src/client/service-suggestion.js, 2026-10-29). A result the server draws (job / major results, university
   and region details) keeps the discover block's 250px under its share block from the first paint, as padding of the share
   block (no background, no margin to collapse), until the block is its next sibling: the block (250px, no margins) then takes
   the room over in the same frame and nothing under it moves, however late the script comes. Closed by html.yn-rd-off (no block
   for this page: outside the 7 markets, the card file failed) and after 6 s without the block (no script), so a page never keeps
   an empty room. Results the page draws itself get the block in the same task as the draw, so the room never paints there. */
html:not(.yn-rd-off) #app .wrap.rs > .share:not(:has(+ section.yn-rd)),
html:not(.yn-rd-off) #univ-main > .share-section:not(:has(+ section.yn-rd)),
html:not(.yn-rd-off) #region-main .r-detail > .r-share:not(:has(+ section.yn-rd)){padding-bottom:250px;animation:ynn-rd-room 6s step-end forwards}
@keyframes ynn-rd-room{to{padding-bottom:0}}

/* Light theme (2026-10-30), for every page that carries this file. The ad runtime (src/ads/place/engine.js) writes its slot labels
   as color:inherit at 50% opacity, which reads on the dark ground only: on light they take the page's muted text at full opacity
   (one step more specific than the runtime's rules, which come later). The result discover block (section.yn-rd,
   src/client/service-suggestion.js) keeps its two dark cards; its heading sits on the page and takes the page's text colour. */
:root:not([data-theme="dark"]) :is(.yn-ad.yn-ad-res,.yn-ad.yn-ad-req,.yn-ad.yn-ad-fb,.yn-ad.yn-ad-on,.yn-ad-rail)>.yn-ad-lbl{color:var(--muted,#5B6476);opacity:1}
:root:not([data-theme="dark"]) .yn-rd{color:var(--text,#161B26)}
:root:not([data-theme="dark"]) .yn-rd .yn-rd-h{color:var(--text,#161B26)}
:root:not([data-theme="dark"]) .yn-rd a.yn-rd-c:hover{box-shadow:0 14px 34px rgba(28,38,56,.16)}
:root:not([data-theme="dark"]) .yn-rd a.yn-rd-c:focus-visible{outline-color:var(--ring,#B52464)}
/* The Fun board (/ko/stories/, body.fb-doc) keeps its dark ground in this release (src/portal/story/style.css): the footer row on it
   takes the dark values, and the light header's search placeholder, over the dark page behind the glass, the muted grey. */
:root:not([data-theme="dark"]) body.fb-doc :is(.ynn-foot,.ynn-foot-wrap){--ynn-text:#F2F4F8;--ynn-muted:#A3A9BA;--ynn-faint:#858CA0;--ynn-line:rgba(255,255,255,.08)}
:root:not([data-theme="dark"]) body.fb-doc .ynn-header{--ynn-faint:#5B6476}
