@font-face { font-family: Heebo; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/heebo-hebrew-400-normal.ba65ac3e853c.woff2") format('woff2'); unicode-range: U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F; }
@font-face { font-family: Heebo; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/heebo-latin-400-normal.3c69e0cac215.woff2") format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF,U+FEFF,U+FFFD; }
@font-face { font-family: Heebo; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/heebo-hebrew-600-normal.e10bd43ce930.woff2") format('woff2'); unicode-range: U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F; }
@font-face { font-family: Heebo; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/heebo-latin-600-normal.aafd65be0bcf.woff2") format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF,U+FEFF,U+FFFD; }
* { box-sizing: border-box; }
html { color-scheme: light; }
body { margin: 0; min-inline-size: 0; background: var(--hui-color-canvas); color: var(--hui-color-text); font: var(--hui-text-body-size)/var(--hui-text-body-line) Heebo, sans-serif; }
h1,h2,h3,p { margin: 0; }
h1 { font-size: var(--hui-text-heading-medium-size); line-height: var(--hui-text-heading-medium-line); }
h2 { font-size: var(--hui-text-title-size); line-height: var(--hui-text-title-line); }
h3 { font-size: var(--hui-text-body-size); line-height: var(--hui-text-body-line); }
a { color: var(--hui-color-link); text-underline-offset: 3px; }
button,input,select { font: inherit; }
button,a,input,select { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--hui-color-focus); outline-offset: 3px; }
.skip-link { position: fixed; inset-block-start: 8px; inset-inline-start: 8px; transform: translateY(-200%); padding: 8px 16px; background: var(--hui-color-surface); z-index: var(--hui-z-notification); }
.skip-link:focus { transform: none; }
.page-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; padding: 8px max(16px, calc((100% - 1280px) / 2)); border-block-start: 3px solid var(--hui-color-primary); border-block-end: 1px solid var(--hui-color-border); background: var(--hui-color-surface); }
.brand { display: inline-flex; align-items: center; min-block-size: 44px; font-size: var(--hui-text-title-size); font-weight: 600; color: var(--hui-color-text); text-decoration: none; }
.account { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; font-size: var(--hui-text-body-small-size); }
.account bdi { overflow-wrap: anywhere; }
.account form { margin: 0; }
main { max-inline-size: 1280px; margin-inline: auto; padding: 20px 16px 32px; }
.page-footer { max-inline-size: 1280px; margin-inline: auto; padding: 16px; color: var(--hui-color-text-secondary); font-size: var(--hui-text-caption-size); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-block-size: 44px; min-inline-size: 44px; padding: 8px 16px; border: 1px solid var(--hui-color-control-border); border-radius: var(--hui-radius-small); font-weight: 600; line-height: var(--hui-text-body-line); cursor: pointer; text-decoration: none; }
.primary { background: var(--hui-color-primary); color: var(--hui-color-on-primary); border-color: var(--hui-color-primary); }
.primary:hover { background: var(--hui-color-primary-hover); border-color: var(--hui-color-primary-hover); }
.secondary { background: var(--hui-color-surface); color: var(--hui-color-text); }
.secondary:hover { background: var(--hui-color-surface-subtle); }
.muted { color: var(--hui-color-text-secondary); font-size: var(--hui-text-body-small-size); }
.login-card { display: grid; justify-items: start; gap: 16px; max-inline-size: 440px; margin: 48px auto; padding: 24px; background: var(--hui-color-surface); border: 1px solid var(--hui-color-border); border-radius: var(--hui-radius-large); box-shadow: var(--hui-shadow-small); }
.login-mark { display: grid; place-items: center; inline-size: 44px; block-size: 44px; background: var(--hui-color-primary-soft); color: var(--hui-color-primary-soft-text); border-radius: var(--hui-radius-medium); font-size: var(--hui-text-title-size); font-weight: 600; }
.google-login { inline-size: 100%; }
.google-mark { font-family: sans-serif; font-weight: 600; }
.notice { padding: 12px; border-radius: var(--hui-radius-small); }
.error { color: var(--hui-color-danger); background: var(--hui-color-danger-soft); }
.archive-workspace { display: grid; gap: 16px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.section-heading>div { display: grid; gap: 4px; }
.search-toolbar { display: flex; align-items: end; flex-wrap: wrap; gap: 8px; padding: 12px; background: var(--hui-color-surface); border: 1px solid var(--hui-color-border); border-radius: var(--hui-radius-medium); }
.search-field { display: grid; gap: 4px; flex: 1; min-inline-size: min(240px, 100%); font-size: var(--hui-text-body-small-size); }
.filter-field { display: grid; gap: 4px; inline-size: 150px; max-inline-size: 100%; font-size: var(--hui-text-body-small-size); }
.filter-help { flex-basis: 100%; }
input,select { min-inline-size: 0; inline-size: 100%; min-block-size: 44px; padding: 8px 12px; border: 1px solid var(--hui-color-control-border); border-radius: var(--hui-radius-small); background: var(--hui-color-surface); color: var(--hui-color-text); }
input::placeholder { color: var(--hui-color-text-tertiary); opacity: 1; }
.results-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.record-list { border: 1px solid var(--hui-color-border); border-radius: var(--hui-radius-medium); background: var(--hui-color-surface); }
.record-row { display: flex; gap: 12px; align-items: start; padding: 16px; border-block-end: 1px solid var(--hui-color-border); }
.record-row:last-child { border-block-end: 0; }
.record-icon { display: grid; place-items: center; inline-size: 36px; block-size: 36px; flex: none; background: var(--hui-color-surface-strong); border-radius: var(--hui-radius-small); color: var(--hui-color-text-secondary); }
.record-copy { display: grid; gap: 4px; flex: 1; min-inline-size: 0; }
.record-link { text-decoration: none; color: var(--hui-color-text); }
.record-link h3 { overflow-wrap: anywhere; }
.record-link:hover { text-decoration: underline; }
.record-meta { display: flex; flex-wrap: wrap; gap: 4px 12px; color: var(--hui-color-text-secondary); font-size: var(--hui-text-caption-size); }
.record-preview { white-space: pre-wrap; overflow-wrap: anywhere; font-size: var(--hui-text-body-small-size); }
.record-source { overflow-wrap: anywhere; font-size: var(--hui-text-caption-size); }
.record-open { flex: none; }
.empty-state { display: grid; gap: 8px; padding: 32px 16px; text-align: center; color: var(--hui-color-text-secondary); }
.pagination { display: flex; justify-content: center; gap: 8px; }
.record-detail { display: grid; gap: 16px; max-inline-size: 960px; }
.back-link { display: inline-flex; align-items: center; min-block-size: 44px; inline-size: fit-content; }
.detail-heading { display: grid; gap: 8px; }
.detail-heading h1 { overflow-wrap: anywhere; }
.communication-body { padding: 16px; background: var(--hui-color-surface); border: 1px solid var(--hui-color-border); border-radius: var(--hui-radius-medium); overflow-wrap: anywhere; }
.communication-body p { white-space: pre-wrap; }
.attachments { display: grid; gap: 12px; }
.attachment-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; padding: 12px 16px; background: var(--hui-color-surface); border: 1px solid var(--hui-color-border); border-radius: var(--hui-radius-medium); }
.attachment-row>div { display: grid; gap: 4px; min-inline-size: 0; overflow-wrap: anywhere; }
.unavailable { color: var(--hui-color-text-secondary); font-size: var(--hui-text-body-small-size); }
@media (max-width: 599px) {
  main { padding-block-start: 16px; }
  .login-card { margin-block: 24px; padding: 20px; }
  .record-row { flex-wrap: wrap; padding: 12px; }
  .record-open { margin-inline-start: 48px; }
  .account { inline-size: 100%; justify-content: space-between; }
  .filter-field { flex: 1; min-inline-size: 120px; }
}
@media (forced-colors: active) {
  .button, input, .record-list, .communication-body, .attachment-row { border: 1px solid CanvasText; }
}
