/* Shared reading surfaces; native-sized controls on narrow screens. */
:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
button:disabled { opacity: .5; cursor: default; }
.skip-link { position: fixed; top: -100px; left: 12px; z-index: 5000; background: var(--surface); color: var(--text); padding: 12px; }
.skip-link:focus { top: 8px; }
#status-message:empty { display: none; }
#status-message { padding: 8px 16px; background: var(--surface-2); color: var(--text); font-size: 14px; flex: 0 0 auto; }
.icon-btn, .chip, .btn-follow { min-height: 44px; }
.rail { flex-basis: 92px; }
.rail button { width: 84px; min-height: 64px; height: auto; opacity: 1; color: var(--text-2); }
.nav-label { display: block; font-family: var(--f-mono); font-size: 11px; line-height: 1.4; margin-top: 7px; }
.rail button.on { color: var(--text); }
.activity-menu { padding: 12px; display: grid; gap: 10px; }
.activity-item { width: 100%; display: flex; align-items: center; gap: 12px; padding: 18px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); color: var(--text); font-size: 17px; cursor: pointer; text-align: start; }
.activity-item span:last-child { margin-inline-start: auto; }
.video-row { width: 100%; display: flex; align-items: center; gap: 14px; padding: 16px; border: 0; border-bottom: 1px solid var(--border); background: var(--surface); color: var(--text); text-align: start; cursor: pointer; }
.video-row img { width: 104px; height: 76px; object-fit: cover; border-radius: 8px; flex-shrink: 0; }
.video-row > span { min-width: 0; }
.video-row strong { display: block; font-size: 18px; line-height: 1.35; overflow-wrap: anywhere; }
.video-row .src, .video-row .foot { display: block; color: var(--text-2); font-size: 12px; line-height: 1.6; }
.video-country { display: flex; align-items: center; gap: 12px; }
.video-country select { max-width: 220px; min-height: 44px; background: var(--surface); color: var(--text); border: 1px solid var(--border); border-radius: 8px; }
.video-detail { padding: 18px; }
.video-detail h1 { font-size: 24px; line-height: 1.3; margin-bottom: 10px; }
.video-detail p { color: var(--text-2); margin: 10px 0; }
.video-detail iframe { display: block; width: 100%; height: min(65dvh, 640px); background: #000; border: 0; margin: 14px 0 22px; }
.video-controls { display: flex; gap: 12px; justify-content: space-between; margin: 12px 0; }
.video-consent { padding: 28px 16px; border: 1px solid var(--border); margin: 18px 0; border-radius: 12px; }
.more-wrap { padding: 18px; text-align: center; }
.row .ttl, .cover h1, .excerpt { overflow-wrap: anywhere; }
.personal-story { color: inherit; text-decoration: none; }
.txt > .personal-story { display: block; padding: 4px 0; }
.profile-trigger, .profile-name, .group-trigger { border: 0; padding: 0; font: inherit; color: inherit; text-align: start; cursor: pointer; }
.profile-trigger { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
.profile-name, .group-trigger { background: transparent; min-height: 44px; }
.who .profile-name { display: block; width: 100%; font-size: 14.5px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ch .profile-name { font-weight: 700; }
.uline .av.profile-trigger, .cm .av.profile-trigger { color: #fff; }
.list-body { overscroll-behavior: contain; }
.row.card .thumb, .row.card.lead .thumb { height: clamp(180px, 26vw, 320px); }
.row.card .ttl, .row.card.lead .ttl { font-size: 21px; line-height: 1.3; }
.form input, .form select, .form textarea { min-height: 44px; }
button.notif { width: 100%; min-height: 44px; border: 0; border-bottom: 1px solid var(--border); background: transparent; color: var(--text); font: inherit; text-align: start; }
.form .msg { display: block; margin: 10px 0 !important; }
@media (max-width: 899.9px) {
  body { height: 100dvh; }
  .body { position: relative; padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
  .rail { position: fixed; inset: auto 0 0; height: calc(68px + env(safe-area-inset-bottom)); padding: 4px 8px calc(4px + env(safe-area-inset-bottom)); flex-direction: row; justify-content: space-around; border-top: 1px solid var(--border); border-right: 0; z-index: 40; overflow: visible; }
  .rail button { width: 30%; min-height: 56px; }
  .rail button.on::before { display: none; }
  .nav-label { margin-top: 4px; }
  .top { flex-basis: auto; flex-wrap: wrap; padding: 8px 12px; gap: 8px; }
  .top .logo { margin-inline-end: auto; }
  .top .grow { display: none; }
  .qwrap { flex: 1 0 100%; order: 10; }
  .qwrap input { min-height: 44px; font-size: 16px; }
  #btn-keys { display: none; }
  #btn-logout { max-width: 80px; overflow: hidden; text-overflow: ellipsis; }
  .me { min-height: 44px; min-width: 44px; justify-content: center; }
  .list { border: 0; width: 100%; }
  .pane { width: 100%; min-width: 0; }
  .form input, .form select, .form textarea { font-size: 16px; }
  .bar { scrollbar-width: thin; }
  .list-head { padding-bottom: 6px; }
  .video-row strong { font-size: 18px; }
  .video-detail { padding: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

.quick-links{display:flex;gap:6px;padding:8px 12px;overflow-x:auto;border-bottom:1px solid var(--border);flex-shrink:0}.quick-links button{white-space:nowrap;min-height:44px}#saved-search{width:100%;min-height:44px;padding:9px 12px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font:inherit}
#share-dialog{position:fixed;inset:0;z-index:4000;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;padding:20px}
.share-options{display:flex;flex-wrap:wrap;gap:12px;max-width:440px;max-height:90dvh;overflow:auto;width:100%;padding:24px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 60px var(--shadow)}
.share-options h2,.share-options p,.share-options input{flex:1 0 100%;min-width:0;margin:0;overflow-wrap:anywhere}
.share-options input{box-sizing:border-box;width:100%;padding:10px;color:var(--text);background:var(--surface-2);border:1px solid var(--border);border-radius:8px;font-size:16px}
.share-options button,.share-options a{min-height:44px;display:inline-flex;align-items:center;justify-content:center}