/* Safari-style chrome for every dock website window. Content never imitates a
   remote homepage: blocked sites have an explicit external-open state. */
.tb-window--web {
  box-sizing: border-box;
  min-width: 0;
  min-height: 0;
  border-radius: 13px;
  background: rgba(238, 239, 241, .94);
  border-color: rgba(255, 255, 255, .7);
  box-shadow: 0 28px 90px rgba(0, 0, 0, .33), 0 0 0 1px rgba(0, 0, 0, .12);
}
.tb-window--web .tb-window-titlebar { border-bottom: 1px solid rgba(0, 0, 0, .04); }
.tb-window--web .tb-window-title { color: #53565c; font-size: 12px; }
.tb-window--web .tb-window-content { overflow: hidden; }
.tb-window--web .tb-tl:focus-visible { outline: 2px solid #0067d9; outline-offset: 4px; }
.tb-window--web .tb-tl:focus-visible::after { opacity: 1; }
.tb-webview, .tb-webview * { box-sizing: border-box; }
.tb-webview {
  height: 100%; min-height: 0; display: flex; flex-direction: column;
  color: #272a30; font: 13px/1.5 var(--tb-font); text-shadow: none;
  user-select: text; -webkit-user-select: text;
}
.tb-webview-toolbar {
  display: flex; align-items: center; gap: 6px; flex: 0 0 auto;
  min-height: 52px; padding: 8px 12px 11px;
  border-bottom: 1px solid rgba(0, 0, 0, .12);
  background: rgba(247, 247, 248, .42);
}
.tb-webview-toolbar button, .tb-webview-external {
  flex: 0 0 30px; width: 30px; height: 30px; border: 0; padding: 6px;
  border-radius: 6px; display: inline-flex; align-items: center; justify-content: center;
  color: #565961; background: transparent; cursor: pointer; text-decoration: none;
  transition: background-color 140ms ease, color 140ms ease;
}
.tb-webview-external span { display: none; }
.tb-webview-external[hidden] { display: none; }
.tb-webview-toolbar svg { display: block; width: 18px; height: 18px; }
.tb-webview-toolbar button:hover:not(:disabled), .tb-webview-external:hover {
  background: rgba(0, 0, 0, .07); color: #17191c;
}
.tb-webview-toolbar button:disabled { opacity: .28; cursor: default; }
.tb-webview-address {
  flex: 1 1 auto; min-width: 0; width: 100%; height: 32px; margin: 0 10px;
  padding: 0 12px; border: 1px solid rgba(0, 0, 0, .08); border-radius: 7px;
  background: rgba(255, 255, 255, .75); color: #42464d;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .025); text-align: center;
  font: 12px var(--tb-font); text-overflow: ellipsis;
  user-select: text; -webkit-user-select: text;
}
.tb-webview-address:focus { background: #fff; text-align: left; }
.tb-webview :is(button,a,input):focus-visible { outline: 2px solid #0879ed; outline-offset: 2px; }
.tb-webview-notice {
  flex: 0 0 auto; padding: 7px 18px; margin: 0;
  font-size: 11px; line-height: 1.45; color: #646972; background: #f6f7f8;
  border-bottom: 1px solid #e7e8eb;
}
.tb-webview-notice[hidden] { display: none; }
.tb-webview-stage {
  position: relative; flex: 1 1 auto; min-height: 0; overflow: auto;
  background: #fafafa;
}
.tb-webview-frame { display: block; width: 100%; height: 100%; border: 0; background: white; }
.tb-webview-fallback {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 100%; padding: 40px 24px; text-align: center;
}
.tb-webview-fallback img {
  display: block; width: 76px; height: 76px; object-fit: contain; margin: 0 0 24px;
  filter: drop-shadow(0 5px 6px rgba(0, 0, 0, .09));
}
.tb-webview-fallback h2 {
  max-width: 100%; margin: 0 0 10px; color: #26282d;
  font-size: 23px; line-height: 1.25; letter-spacing: -.55px; font-weight: 600;
}
.tb-webview-fallback p {
  max-width: 330px; margin: 0 0 24px; font-size: 13px; line-height: 1.6; color: #737780;
}
.tb-webview-fallback a {
  display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 7px 17px;
  color: white; background: #007aff; border: 1px solid rgba(0, 0, 0, .06); border-radius: 7px;
  font-size: 13px; font-weight: 500; text-decoration: none; box-shadow: 0 1px 2px rgba(0, 0, 0, .07);
}
.tb-webview-fallback a:hover { background: #006ee5; }
.tb-webview-fallback a svg { width: 14px; height: 14px; }
@media (max-width: 540px) {
  .tb-webview-toolbar { gap: 2px; padding: 6px 7px 9px; }
  .tb-webview-toolbar button, .tb-webview-external { flex-basis: 28px; width: 28px; padding: 5px; }
  .tb-webview-address { margin: 0 3px; padding: 0 7px; font-size: 11px; }
  .tb-webview-fallback { padding: 30px 20px; }
  .tb-webview-fallback h2 { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .tb-window--web, .tb-window--web.tb-animating, .tb-webview-toolbar button, .tb-webview-external { transition: none; }
}