/* The reference as an app (v1.10.0): /refs/app.js's pieces. Served at /refs/app.css for the bridge. */
.refs-app-icon{display:inline-grid;place-items:center;width:18px;height:18px;flex:0 0 18px}
.refs-app-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* A saved copy, shown by the service worker. */
.refs-offline-strip{padding:8px 14px;border-bottom:1px solid color-mix(in srgb,#b7791f 35%,var(--line));background:color-mix(in srgb,#f6c453 22%,var(--surface));color:var(--ink);font-size:13.5px;font-weight:700;text-align:center}

/* Favourite and share, under the page's heading. */
.refs-page-actions{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.refs-act{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:7px 13px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.refs-act:hover{border-color:var(--blue)}
.refs-act:focus-visible{outline:3px solid color-mix(in srgb,var(--blue) 30%,transparent);outline-offset:1px}
.refs-act-star[aria-pressed=true]{border-color:#c98a12}
.refs-act-star[aria-pressed=true] svg{fill:#f2b532;stroke:#c98a12}

/* v1.10.8: the plain link to the favourites page, next to the star and under the front page's search box.
   The installed app has it in its bottom bar, so there it is hidden. */
.refs-act-saved{text-decoration:none}
.refs-act-saved span,.refs-saved-row span{color:#c98a12}
.refs-saved-line{margin:10px 0 0;font-size:14px}
.refs-saved-row{font-weight:700;text-decoration:none}
.refs-saved-row:hover{text-decoration:underline}
.refs-standalone .refs-act-saved,.refs-standalone .refs-saved-line{display:none}

/* Install: Chrome's button and the iPhone's steps, on the front page. */
.refs-install{display:grid;gap:8px;justify-items:start;max-width:560px;margin-top:20px;padding:16px 18px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.refs-install p{margin:0;color:var(--muted);font-size:15px}

/* The saved and offline pages. */
.refs-saved-filter{max-width:520px}
.refs-saved .refs-list li{position:relative}
.refs-saved .refs-list a{padding-right:46px}
.refs-saved .is-unavailable a{opacity:.55}
.refs-saved-remove{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.refs-saved-remove:hover{border-color:var(--line);color:var(--ink)}

/* Installed: a bar at the bottom and a back arrow; nothing of the page is hidden, it only makes room. */
.refs-appbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:repeat(4,1fr);padding:4px 4px calc(4px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:color-mix(in srgb,var(--surface) 96%,transparent);backdrop-filter:blur(12px)}
.refs-appbar a{display:grid;justify-items:center;gap:2px;padding:6px 2px;border-radius:9px;color:var(--muted);font-size:11.5px;font-weight:700;line-height:1.2;text-align:center;text-decoration:none}
.refs-appbar a[aria-current=page]{color:var(--blue)}
.refs-appbar .refs-app-icon{width:22px;height:22px;flex-basis:22px}
.refs-standalone body{padding-bottom:calc(66px + env(safe-area-inset-bottom))}
.refs-standalone .consent-banner{bottom:calc(78px + env(safe-area-inset-bottom))}
.refs-app-back{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;margin-right:-8px;padding:0;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);cursor:pointer}
.refs-app-back .refs-app-icon{width:20px;height:20px}
@media print{.refs-appbar,.refs-app-back,.refs-page-actions,.refs-install,.refs-offline-strip,.refs-saved-line{display:none}}

/* v1.61.7: on a phone, the install offer as a bar at the bottom of every page (refs-app.js, 7). Fixed, so nothing
   moves; the page gets the bar's height as bottom padding only while it is shown. Never in the installed app. */
.refs-install-bar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;gap:10px;padding:10px 10px calc(10px + env(safe-area-inset-bottom)) 16px;border-top:1px solid var(--line);background:color-mix(in srgb,var(--surface) 97%,transparent);backdrop-filter:blur(12px);box-shadow:0 -6px 18px rgba(0,0,0,.08)}
.refs-install-bar-text{display:grid;gap:2px;flex:1 1 auto;min-width:0;font-size:14.5px;line-height:1.35}
.refs-install-bar-text span{color:var(--muted);font-size:13px}
.refs-install-bar .button{flex:0 0 auto;min-height:38px;padding:7px 14px}
.refs-install-bar-close{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;padding:0;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.refs-install-bar-close:hover{border-color:var(--line);color:var(--ink)}
.refs-install-shown body{padding-bottom:var(--refs-install-h,76px)}
/* The menu's „Install app": a button among the links, shown by refs-app.js on a phone only. */
.refs-nav-install{width:100%;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.site-menu-panel .refs-nav-install{padding:13px 0;border-bottom:1px solid var(--line);color:var(--ink);font-size:15px;font-weight:700}
.refs-nav-install[hidden],.refs-standalone .refs-nav-install,.refs-standalone .refs-install-bar{display:none}
@media print{.refs-install-bar{display:none}}
