/* Interface only. The original worksheet fonts, educational colours and print
   geometry are deliberately owned by the generator's worksheet/print styles. */
@media screen {
  :root { --site-ink:#34463f; --site-muted:#737c70; --site-paper:#fffdf5; --site-line:#dce0d3; }
  body { background:#f8f5ee; color:var(--site-ink); }
  .builder-site-header { max-width:1320px; margin:auto; padding:28px 40px; display:flex; justify-content:space-between; align-items:center; gap:24px; }
  .builder-brand { font-size:28px; font-weight:750; letter-spacing:-1.4px; text-decoration:none; color:var(--site-ink); white-space:nowrap; }
  .builder-brand>span:first-child { color:#b95443; margin-right:5px; }
  .brand-dot { color:#b95443; }
  .builder-site-header nav { display:flex; gap:25px; align-items:center; font-size:12px; }
  .builder-site-header nav a { color:var(--site-muted); text-decoration:none; padding:9px 0; }
  .builder-site-header nav [aria-current] { color:var(--site-ink); border-bottom:1px solid #88987d; }
  .builder-intro { max-width:1240px; margin:15px auto 32px; padding:0 40px; box-sizing:border-box; }
  .builder-eyebrow { color:#9b7955; font-size:10px; letter-spacing:1.7px; margin:0 0 15px; }
  .builder-intro h1 { font-size:clamp(30px,4vw,48px); font-weight:650; line-height:1.12; letter-spacing:-1.7px; max-width:700px; margin:0 0 18px; }
  .builder-description { max-width:680px; font-size:15px; line-height:1.8; margin:0 0 10px; }
  .builder-privacy { color:var(--site-muted); font-size:12px; line-height:1.7; }
  .builder-fridge { max-width:1240px; box-sizing:border-box; margin:0 auto; border:1px solid #d8ddcf; border-radius:42px 42px 24px 24px; background:linear-gradient(110deg,#fffef8,#f3f1e4); box-shadow:inset 0 2px 2px white,0 15px 35px -20px #59634866; padding:18px; }
  .app-shell { padding:8px; gap:26px; align-items:flex-start; }
  .app-sidebar { flex:0 0 290px; box-sizing:border-box; border-radius:14px; border:1px solid var(--site-line); padding:22px; background:var(--site-paper); box-shadow:0 4px 8px -6px #46563e66; top:16px; max-height:calc(100dvh - 32px); scrollbar-width:thin; }
  .builder-panel-title { font-size:20px; line-height:1.3; margin:4px 0 24px; font-weight:600; letter-spacing:-.4px; }
  .app-sidebar label:not(.checkbox-label) { font-size:12px; font-weight:600; color:var(--site-ink); }
  .app-sidebar select,.app-sidebar input[type="text"],.app-sidebar input[type="number"],.app-sidebar textarea { background:#fffef9; color:var(--site-ink); border:1px solid #cdd4c5; border-radius:6px; padding:9px; font:inherit; font-size:13px; box-sizing:border-box; max-width:100%; }
  .app-sidebar select { width:100%; }
  .app-sidebar button { background:#eef0e5; color:var(--site-ink); border:1px solid #d5dccb; border-radius:6px; padding:10px 12px; font:inherit; font-size:12px; line-height:1.45; }
  .app-sidebar #btn-create,.app-sidebar #btn-print { background:#61715a; color:white; border-color:#61715a; font-weight:600; }
  .app-sidebar #btn-docx { background:#4e6e85; color:white; border-color:#4e6e85; }
  .app-sidebar button:disabled { opacity:.5; cursor:not-allowed; }
  .app-sidebar button:not(:disabled):hover { filter:brightness(.95); }
  .app-sidebar .settings-panel { border-color:var(--site-line); margin-top:18px; padding-top:12px; }
  .app-sidebar .settings-panel summary { color:var(--site-ink); font-size:13px; line-height:1.5; }
  .checkbox-label { font-size:12px; line-height:1.5; }
  input[type="checkbox"] { accent-color:#61715a; }
  .candidate-count,.storage-status { line-height:1.6; }
  .sidebar-actions { background:var(--site-paper); border-color:var(--site-line); padding:12px 22px 20px; margin:20px -22px -22px; bottom:-22px; max-height:43dvh; }
  .preview-scroll { min-width:0; flex:1; padding:0 0 16px; overflow-x:auto; }
  .builder-preview-label { font-size:10px; letter-spacing:1px; text-transform:uppercase; color:#737c70; margin:10px 0 18px; text-align:center; }
  .page-frame { margin:0 auto; }
  .builder-footer { max-width:1240px; padding:28px 40px 40px; box-sizing:border-box; margin:auto; display:flex; gap:20px; justify-content:space-between; font-size:11px; color:var(--site-muted); line-height:1.6; }
  .builder-footer a { color:var(--site-ink); }
  a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid #4e6e85; outline-offset:3px; }
  .builder-skip { position:absolute; left:15px; top:-100px; padding:12px; background:#34463f; color:white; z-index:100; }
  .builder-skip:focus { top:10px; }
  @media(max-width:1000px) {
    .builder-fridge { margin:0 18px; padding:12px; }
    .app-shell { gap:16px; }
    .app-sidebar { flex-basis:265px; padding:16px; }
    .sidebar-actions { padding:12px 16px 16px; margin:18px -16px -16px; bottom:-16px; }
  }
  @media(max-width:720px) {
    .builder-site-header { padding:22px; flex-wrap:wrap; gap:18px; }
    .builder-brand { font-size:25px; }
    .builder-site-header nav { gap:18px; font-size:11px; }
    .builder-intro { padding:0 22px; margin:15px auto 25px; }
    .builder-intro h1 { letter-spacing:-1px; }
    .builder-description { font-size:14px; }
    .builder-fridge { margin:0 10px; padding:10px; border-radius:26px 26px 18px 18px; }
    .app-shell { display:flex; flex-direction:column; padding:4px; gap:18px; }
    .app-sidebar { flex:none; width:100%; position:static; max-height:none; overflow:visible; }
    .sidebar-actions { position:static; max-height:none; }
    .preview-scroll { width:100%; box-sizing:border-box; }
    .builder-footer { padding:25px 22px; flex-direction:column; gap:12px; }
  }
}