:root{
    --ink:#241D16;
    --ink-soft:#5B4E3D;
    --paper:#E7DBBE;
    --paper-soft:#F1E7CC;
    --card:#FBF6E8;
    --moss:#44603F;
    --moss-dark:#2E4229;
    --plum:#7A2E22;
    --plum-dark:#571F17;
    --line:#D6C79C;
    --muted:#8A7A5C;
    --brass:#96762E;
    --brass-dark:#6E5620;
  }
  *{box-sizing:border-box;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    min-height:100vh;
  }
  .wrap{max-width:640px;margin:0 auto;padding:0 0 60px;}
  header{
    padding:34px 20px 22px;
    border-bottom:1px solid var(--line);
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
    position:relative;
  }
  h1{
    font-family:'Fraunces',serif;
    font-weight:600;
    font-size:30px;
    margin:0 0 6px;
    letter-spacing:-0.015em;
    color:var(--moss-dark);
  }
  header p{margin:0;color:var(--ink-soft);font-size:13.5px;font-style:italic;}
  .user-badge{
    text-align:right;
    font-size:12px;
    color:var(--ink-soft);
    flex-shrink:0;
  }
  .user-badge .name{font-weight:600;color:var(--ink);font-size:13px;}
  .user-badge .role-tag{
    display:inline-block;
    background:var(--plum);
    color:#fff;
    font-size:10px;
    padding:1px 6px;
    border-radius:8px;
    margin-left:4px;
  }
  .logout-link{
    background:none;border:none;color:var(--plum-dark);
    text-decoration:underline;cursor:pointer;font-size:12px;padding:4px 0 0;
  }

  nav.tabs{
    display:flex;
    gap:4px;
    padding:0 20px;
    margin-top:20px;
    border-bottom:1px solid var(--line);
    flex-wrap:wrap;
  }
  nav.tabs button{
    background:none;
    border:none;
    font-family:'Inter',sans-serif;
    font-size:14px;
    font-weight:500;
    color:var(--ink-soft);
    padding:10px 10px 12px;
    margin-right:12px;
    cursor:pointer;
    border-bottom:2px solid transparent;
    border-radius:6px 6px 0 0;
    position:relative;
    top:1px;
    transition:background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
  }
  nav.tabs button.active{
    color:var(--moss-dark);
    border-bottom:2px solid var(--moss);
  }
  nav.tabs button:not(.active):hover{
    color:#fff;
    background:var(--moss);
    border-bottom:2px solid var(--moss-dark);
  }

  section{padding:20px;}
  section.hidden{display:none;}
  .hidden{display:none !important;}

  .toolbar{
    display:flex;
    gap:8px;
    margin-bottom:16px;
    flex-wrap:wrap;
  }
  select, input[type=text], input[type=date], input[type=email], input[type=password], textarea{
    font-family:'Inter',sans-serif;
    font-size:13px;
    padding:8px 10px;
    border-radius:6px;
    border:1px solid var(--line);
    background:var(--card);
    color:var(--ink);
  }
  select{flex:1;min-width:120px;}
  .search-row{margin-bottom:16px;position:relative;}
  .search-row input{width:100%;}

  .add-toggle{
    width:100%;
    text-align:left;
    background:var(--moss-dark);
    color:var(--paper-soft);
    border:none;
    padding:12px 14px;
    border-radius:8px;
    font-family:'Inter',sans-serif;
    font-size:14px;
    font-weight:500;
    cursor:pointer;
    margin-bottom:16px;
  }
  .add-toggle-row{display:flex;gap:8px;margin-bottom:16px;}
  .add-toggle-compact{
    flex:1;
    background:var(--card);
    border:1px solid var(--line);
    color:var(--ink-soft);
    padding:9px 10px;
    border-radius:6px;
    font-family:'Inter',sans-serif;
    font-size:12.5px;
    font-weight:500;
    cursor:pointer;
    text-align:center;
  }
  .add-toggle-compact.accent-plum{background:var(--plum);border-color:var(--plum-dark);color:#FBF6E8;}
  .add-toggle-compact.accent-moss{background:var(--moss);border-color:var(--moss-dark);color:#FBF6E8;}
  .add-toggle-compact.open{background:var(--moss-dark);color:#fff;border-color:var(--moss-dark);}
  .add-form{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:10px;
    padding:16px;
    margin-bottom:20px;
    display:none;
  }
  .add-form.open{display:block;}
  .add-form label{
    display:block;
    font-size:12px;
    color:var(--muted);
    margin:10px 0 4px;
  }
  .add-form label:first-child{margin-top:0;}
  .add-form input, .add-form select{width:100%;}
  .form-row{display:flex;gap:10px;}
  .form-row > div{flex:1;}
  .save-btn{
    margin-top:14px;
    background:var(--moss);
    color:#fff;
    border:none;
    padding:10px 16px;
    border-radius:5px;
    font-size:14px;
    font-weight:500;
    cursor:pointer;
    box-shadow:0 1px 0 rgba(0,0,0,0.15) inset, 0 1px 2px rgba(36,29,22,0.25);
  }
  .save-btn:active{box-shadow:0 1px 0 rgba(0,0,0,0.2) inset;}
  .error-msg{color:var(--plum-dark);font-size:12px;margin-top:8px;display:none;}
  .info-msg{color:var(--moss-dark);font-size:12px;margin-top:8px;}

  .book-list{display:flex;flex-direction:column;gap:10px;}

  .view-toggle{display:flex;gap:6px;margin-bottom:14px;}
  .view-toggle button{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:6px;
    padding:8px 12px;
    font-size:16px;
    line-height:1;
    cursor:pointer;
    color:var(--ink-soft);
  }
  .view-toggle button.active{
    background:var(--moss-dark);
    border-color:var(--moss-dark);
    color:#fff;
  }

  .book-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(120px, 1fr));
    gap:16px;
  }
  .book-grid-item{
    cursor:pointer;
    background:none;
    border:none;
    padding:0;
    text-align:left;
    font-family:inherit;
    display:flex;
    flex-direction:column;
    gap:6px;
  }
  .book-grid-cover{
    width:100%;
    aspect-ratio:2/3;
    object-fit:cover;
    border-radius:8px;
    border:1px solid var(--line);
    background:var(--paper-soft);
  }
  .book-grid-cover-placeholder{
    width:100%;
    aspect-ratio:2/3;
    border-radius:8px;
    border:1px solid var(--line);
    background:var(--paper-soft);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    color:var(--muted);
  }
  .book-grid-title{
    font-family:'Fraunces',serif;
    font-size:13px;
    font-weight:500;
    color:var(--ink);
    line-height:1.3;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .book-grid-badges{display:flex;gap:4px;}
  .book-grid-dot{
    width:8px;height:8px;border-radius:50%;
    display:inline-block;
  }
  .book-grid-dot.read{background:var(--moss);}
  .book-grid-dot.unread{background:var(--muted);}
  .book-row{
    background:var(--card);
    border:1px solid var(--line);
    border-left:4px solid var(--muted);
    border-radius:6px;
    padding:12px 14px;
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:10px;
  }
  .book-row-main{display:flex;gap:12px;flex:1;min-width:0;}
  .book-cover{
    width:44px;
    height:64px;
    object-fit:cover;
    border-radius:4px;
    border:1px solid var(--line);
    flex-shrink:0;
    background:var(--paper-soft);
  }
  .book-cover-placeholder{
    width:44px;
    height:64px;
    border-radius:4px;
    border:1px solid var(--line);
    background:var(--paper-soft);
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--muted);
    font-size:18px;
    flex-shrink:0;
  }
  .book-cover-large{
    width:100px;
    height:145px;
    object-fit:cover;
    border-radius:6px;
    border:1px solid var(--line);
    margin-bottom:12px;
  }
  .book-title{
    font-family:'Fraunces',serif;
    font-weight:500;
    font-size:16px;
    margin:0 0 2px;
  }
  .book-meta{font-size:12px;color:var(--ink-soft);margin:0;}
  .book-tags{margin-top:7px;display:flex;gap:6px;flex-wrap:wrap;align-items:center;}
  .tag{
    font-size:11px;
    background:var(--paper-soft);
    color:var(--moss-dark);
    padding:3px 9px;
    border-radius:3px;
    border:1px solid var(--line);
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.4);
  }
  .status-tag{cursor:pointer;font-family:'Inter',sans-serif;}
  .status-read{background:var(--moss);border-color:var(--moss-dark);color:#fff;}
  .status-unread{background:var(--paper);border-color:var(--muted);color:var(--ink-soft);}
  .favorite-tag{
    cursor:pointer;
    font-family:'Fraunces',serif;
    border-radius:50%;
    width:26px;
    height:26px;
    padding:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:14px;
    line-height:1;
    box-shadow:none;
  }
  .favorite-on{
    background:radial-gradient(circle at 35% 30%, #9a4a3a, var(--plum) 70%, var(--plum-dark) 100%);
    border-color:var(--plum-dark);
    color:#f3e6c8;
    box-shadow:0 1px 2px rgba(36,29,22,0.4), inset 0 1px 1px rgba(255,255,255,0.25);
  }
  .favorite-off{background:var(--paper);border-color:var(--muted);color:var(--muted);}
  .star-picker{display:flex;gap:2px;margin:4px 0;}
  .star-picker button{background:none;border:none;cursor:pointer;font-size:20px;line-height:1;padding:2px;color:var(--muted);}
  .star-picker button.filled{color:var(--plum);}
  .web-rating{font-size:13px;color:var(--ink-soft);}
  .rating-line{display:flex;align-items:center;gap:6px;margin-top:4px;flex-wrap:wrap;}
  .rating-label{font-size:11px;color:var(--muted);min-width:70px;}

  .del-btn{background:none;border:none;color:var(--muted);cursor:pointer;font-size:16px;line-height:1;padding:4px;}
  .del-btn:hover{color:var(--plum-dark);}

  .empty{text-align:center;color:var(--muted);font-size:14px;padding:40px 20px;}

  .disco-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:12px;display:flex;gap:12px;}

  .release-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:12px;display:flex;gap:12px;}
  .release-cover{width:70px;height:102px;object-fit:cover;border-radius:6px;border:1px solid var(--line);flex-shrink:0;background:var(--paper-soft);}
  .release-cover-placeholder{width:70px;height:102px;border-radius:6px;border:1px solid var(--line);background:var(--paper-soft);display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--muted);flex-shrink:0;}
  .release-title{font-family:'Fraunces',serif;font-size:15px;font-weight:500;margin:0 0 2px;}
  .release-meta{font-size:12px;color:var(--ink-soft);margin:0 0 10px;}
  .release-actions{display:flex;gap:8px;}
  .release-actions button{flex:1;padding:7px;border-radius:6px;font-size:12px;font-weight:500;cursor:pointer;border:1px solid var(--line);background:var(--paper);color:var(--ink-soft);}
  .release-actions button.interested-yes{background:var(--moss);border-color:var(--moss);color:#fff;}
  .release-actions button.interested-no{background:var(--paper);border-color:var(--plum);color:var(--plum-dark);}
  .disco-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;}
  .disco-title{font-family:'Fraunces',serif;font-size:16px;font-weight:500;margin:0 0 2px;}
  .disco-author{font-size:13px;color:var(--ink-soft);margin:0 0 8px;}
  .match-badge{font-size:11px;background:var(--plum);color:#fff;padding:3px 9px;border-radius:10px;white-space:nowrap;flex-shrink:0;}
  .disco-note{font-size:13px;color:var(--ink-soft);margin:0;line-height:1.5;}

  .stat-strip{display:flex;gap:10px;margin-bottom:18px;flex-wrap:wrap;}
  .stat{flex:1;min-width:90px;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:10px 12px;}
  .stat .num{font-family:'Fraunces',serif;font-size:20px;font-weight:600;}
  .stat .label{font-size:11px;color:var(--muted);}

  .import-row{display:flex;gap:8px;margin-bottom:14px;}
  .import-btn{
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:4px;
    background:var(--moss);
    border:1px solid var(--moss-dark);
    border-radius:8px;
    padding:10px 6px;
    cursor:pointer;
    font-family:'Inter',sans-serif;
    font-size:11.5px;
    font-weight:500;
    color:#FBF6E8;
    text-align:center;
  }
  .import-btn:disabled{opacity:0.5;cursor:default;}
  .import-btn.accent-brass{background:var(--brass);border-color:var(--brass-dark);color:#FBF6E8;}
  .import-btn.accent-plum{background:var(--plum);border-color:var(--plum-dark);color:#FBF6E8;}
  .import-icon{width:18px;height:18px;flex-shrink:0;}

  .scan-status{font-size:13px;color:var(--ink-soft);padding:10px 0;display:none;}

  .progress-bar-outer{
    width:100%;
    height:8px;
    background:var(--paper-soft);
    border-radius:4px;
    overflow:hidden;
    margin:4px 0 10px;
    display:none;
  }
  .progress-bar-outer.show{display:block;}
  .progress-bar-inner{
    height:100%;
    background:var(--moss);
    width:0%;
    transition:width 0.2s ease;
  }

  .already-read-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px;margin-bottom:18px;display:flex;gap:14px;}
  .already-read-card.found{border-left:4px solid var(--moss);}
  .already-read-card.not-found{border-left:4px solid var(--plum);}
  .already-read-status{font-family:'Fraunces',serif;font-size:15px;font-weight:600;margin:0 0 6px;}
  .already-read-status.found{color:var(--moss-dark);}
  .already-read-status.not-found{color:var(--plum-dark);}
  .scan-status.show{display:block;}

  .staging{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:18px;display:none;}
  .staging.show{display:block;}
  .staging h3{font-family:'Fraunces',serif;font-size:15px;font-weight:500;margin:0 0 10px;}
  .staging-item{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--line);}
  .staging-item:last-of-type{border-bottom:none;}
  .staging-item input[type=text]{width:100%;font-size:13px;padding:6px 8px;margin-bottom:4px;}
  .staging-fields{flex:1;}
  .staging-remove{background:none;border:none;color:var(--muted);cursor:pointer;font-size:16px;padding:4px;flex-shrink:0;}
  .staging-actions{display:flex;gap:8px;margin-top:12px;}
  .staging-actions button{flex:1;padding:10px;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;border:1px solid var(--line);}
  .confirm-btn{background:var(--moss);color:#fff;border-color:var(--moss)!important;}
  .cancel-btn{background:var(--card);color:var(--ink-soft);}

  .fatal-error{background:#F6DEDA;color:var(--plum-dark);border:1px solid var(--plum);border-radius:8px;padding:12px 14px;margin:16px 20px;font-size:13px;display:none;}
  .fatal-error.show{display:block;}

  .author-link{color:var(--moss-dark);text-decoration:underline;cursor:pointer;background:none;border:none;padding:0;font:inherit;}

  .author-modal-overlay{display:none;position:fixed;inset:0;background:rgba(36,49,42,0.55);z-index:100;align-items:center;justify-content:center;padding:20px;}
  .author-modal-overlay.show{display:flex;}
  .author-modal{background:var(--card);border-radius:12px;max-width:420px;width:100%;max-height:80vh;overflow-y:auto;padding:20px;position:relative;}
  .author-modal-close{position:absolute;top:12px;right:12px;background:none;border:none;color:var(--muted);font-size:18px;cursor:pointer;padding:4px;}
  .author-modal h3{font-family:'Fraunces',serif;font-size:19px;font-weight:600;margin:0 20px 4px 0;}
  .author-modal .author-meta{font-size:13px;color:var(--ink-soft);margin:0 0 14px;line-height:1.5;}
  .author-modal h4{font-family:'Inter',sans-serif;font-size:12px;font-weight:600;color:var(--muted);margin:16px 0 6px;}
  .author-modal ul{margin:0;padding-left:18px;font-size:14px;line-height:1.6;}
  .author-modal .no-info{font-size:13px;color:var(--muted);font-style:italic;}

  .search-results{position:absolute;top:100%;left:0;right:0;background:var(--card);border:1px solid var(--line);border-top:none;border-radius:0 0 8px 8px;max-height:260px;overflow-y:auto;z-index:20;display:none;}
  .search-results.show{display:block;}
  .search-result-item{padding:10px 12px;border-bottom:1px solid var(--line);cursor:pointer;font-size:13px;}
  .search-result-item:last-child{border-bottom:none;}
  .search-result-item:hover{background:var(--paper-soft);}
  .search-result-item .sr-title{font-weight:500;color:var(--ink);}
  .search-result-item .sr-author{color:var(--ink-soft);font-size:12px;}
  .search-empty-hint{padding:10px 12px;font-size:12px;color:var(--muted);}

  .auth-wrap{max-width:400px;margin:60px auto;padding:0 20px;}
  .auth-card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:28px;}
  .auth-tabs{display:flex;gap:8px;margin-bottom:20px;}
  .auth-tabs button{flex:1;background:none;border:1px solid var(--line);border-radius:8px;padding:10px;font-size:14px;font-weight:500;color:var(--ink-soft);cursor:pointer;}
  .auth-tabs button.active{background:var(--moss-dark);color:#fff;border-color:var(--moss-dark);}
  .auth-form{display:none;}
  .auth-form.active{display:block;}
  .auth-form label{display:block;font-size:12px;color:var(--muted);margin:12px 0 4px;}
  .auth-form label:first-child{margin-top:0;}
  .auth-form input{width:100%;}
  .auth-submit{width:100%;margin-top:18px;background:var(--moss);color:#fff;border:none;padding:12px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;}

  .admin-banner{background:var(--plum);color:#fff;padding:10px 20px;font-size:13px;display:flex;justify-content:space-between;align-items:center;gap:10px;}
  .admin-banner button{background:rgba(255,255,255,0.2);border:none;color:#fff;padding:4px 10px;border-radius:6px;font-size:12px;cursor:pointer;}

  .request-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:10px;}
  .request-card .rq-title{font-family:'Fraunces',serif;font-size:15px;font-weight:500;margin:0 0 2px;}
  .request-card .rq-meta{font-size:12px;color:var(--ink-soft);margin:0 0 8px;}
  .request-actions{display:flex;gap:8px;}
  .request-actions button{flex:1;padding:8px;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;border:1px solid var(--line);}

  .user-row{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center;gap:10px;}
  .user-row .u-name{font-weight:500;font-size:14px;}
  .user-row .u-meta{font-size:12px;color:var(--ink-soft);}
  .user-row button{background:var(--paper-soft);border:1px solid var(--line);border-radius:6px;padding:6px 10px;font-size:12px;cursor:pointer;color:var(--moss-dark);}

  .crop-container{position:relative;max-width:100%;margin-bottom:14px;line-height:0;}
  .crop-container img{display:block;max-width:100%;max-height:45vh;width:auto;height:auto;margin:0 auto;user-select:none;-webkit-user-drag:none;}
  .crop-box{position:absolute;border:2px dashed #fff;box-shadow:0 0 0 9999px rgba(0,0,0,0.55);cursor:move;touch-action:none;}
  .crop-handle{position:absolute;width:22px;height:22px;touch-action:none;}
  .crop-handle.nw{top:-3px;left:-3px;border-top:4px solid #fff;border-left:4px solid #fff;cursor:nwse-resize;}
  .crop-handle.ne{top:-3px;right:-3px;border-top:4px solid #fff;border-right:4px solid #fff;cursor:nesw-resize;}
  .crop-handle.sw{bottom:-3px;left:-3px;border-bottom:4px solid #fff;border-left:4px solid #fff;cursor:nesw-resize;}
  .crop-handle.se{bottom:-3px;right:-3px;border-bottom:4px solid #fff;border-right:4px solid #fff;cursor:nwse-resize;}

  .spreadsheet-table{border-collapse:collapse;font-size:13px;min-width:100%;background:var(--card);}
  .spreadsheet-table th{
    background:var(--moss-dark);color:#fff;font-weight:500;text-align:left;
    padding:8px 10px;white-space:nowrap;position:sticky;top:0;font-size:12px;
  }
  .spreadsheet-table th.sortable-th:hover{background:var(--moss);}
  .spreadsheet-table td{border:1px solid var(--line);padding:0;}
  .spreadsheet-table tr:nth-child(even) td{background:var(--paper-soft);}
  .spreadsheet-table input{
    width:100%;border:none;background:transparent;padding:7px 9px;font-size:13px;
    font-family:'Inter',sans-serif;color:var(--ink);min-width:90px;
  }
  .spreadsheet-table input:focus{outline:2px solid var(--moss);outline-offset:-2px;background:var(--card);}
  .spreadsheet-table input.title-cell{min-width:160px;font-family:'Fraunces',serif;}
  .spreadsheet-table td.cell-saved{background:#DCEBD9 !important;transition:background 1.5s ease;}
  .spreadsheet-table td.cell-error{background:#F6DEDA !important;}
  .spreadsheet-thumb{width:28px;height:40px;object-fit:cover;display:block;border-radius:2px;}
  .spreadsheet-thumb-placeholder{width:28px;height:40px;background:var(--paper-soft);border-radius:2px;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--muted);}

  .leaderboard-row{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:12px 14px;margin-bottom:8px;}
  .leaderboard-rank{font-family:'Fraunces',serif;font-size:18px;font-weight:600;color:var(--muted);width:28px;text-align:center;flex-shrink:0;}
  .leaderboard-row:nth-child(1) .leaderboard-rank{color:var(--brass);}
  .leaderboard-row:nth-child(2) .leaderboard-rank{color:var(--ink-soft);}
  .leaderboard-row:nth-child(3) .leaderboard-rank{color:var(--plum);}
  .leaderboard-name{flex:1;font-size:14px;font-weight:500;}
  .leaderboard-count{font-family:'Fraunces',serif;font-size:16px;color:var(--moss-dark);font-weight:600;}

  .friend-row{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin-bottom:8px;cursor:pointer;}
  .friend-row .fr-name{flex:1;font-size:14px;font-weight:500;}
  .friend-unread{background:var(--plum);color:#fff;font-size:11px;border-radius:10px;padding:2px 7px;flex-shrink:0;}
  .friend-request-row{display:flex;align-items:center;gap:10px;background:var(--paper-soft);border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin-bottom:8px;}
  .friend-request-row .fr-name{flex:1;font-size:14px;}
  .friend-request-row button{padding:6px 10px;border-radius:6px;font-size:12px;cursor:pointer;border:1px solid var(--line);background:var(--card);}

  .msg-bubble{max-width:78%;padding:9px 12px;border-radius:12px;font-size:14px;line-height:1.4;}
  .msg-mine{align-self:flex-end;background:var(--moss);color:#fff;border-bottom-right-radius:3px;}
  .msg-theirs{align-self:flex-start;background:var(--card);border:1px solid var(--line);border-bottom-left-radius:3px;}
  .msg-time{font-size:10px;opacity:0.7;margin-top:3px;}

  .msg-book-card{display:flex;gap:10px;align-items:center;background:var(--paper-soft);border:1px solid var(--line);border-radius:8px;padding:8px;max-width:220px;}
  .msg-mine .msg-book-card{background:rgba(255,255,255,0.15);border-color:rgba(255,255,255,0.3);}
  .msg-book-cover{width:36px;height:52px;object-fit:cover;border-radius:3px;flex-shrink:0;}
  .msg-book-info{min-width:0;}
  .msg-book-title{font-family:'Fraunces',serif;font-size:12.5px;font-weight:600;margin:0 0 4px;line-height:1.2;}
  .msg-book-info button{font-size:11px;padding:3px 7px;border-radius:4px;border:1px solid var(--line);background:var(--card);cursor:pointer;color:var(--moss-dark);}

  .share-book-preview{display:flex;gap:10px;align-items:center;background:var(--paper-soft);border-radius:8px;padding:10px;margin-bottom:14px;}

  /* ============================================================
     Adaptation grand écran (tablette/ordinateur) : le site reste
     le même, il s'étale et respire davantage au-delà de 900px.
     ============================================================ */
  @media (min-width: 900px){
    .wrap{max-width:1080px;padding:0 0 60px;}
    header{padding-left:36px;padding-right:36px;}
    section{padding:20px 36px;}
    nav.tabs{padding:0 36px;}
    .admin-banner{padding:10px 36px;}

    .book-grid{grid-template-columns:repeat(auto-fill, minmax(150px, 1fr));gap:20px;}
    .book-grid-cover, .book-grid-cover-placeholder{border-radius:8px;}

    .toolbar{gap:10px;}
    .toolbar select{flex:1 1 160px;}

    .disco-card, .release-card, .request-card, .user-row, .friend-row, .friend-request-row{
      padding:16px 18px;
    }

    /* Le formulaire d'ajout/édition profite d'un peu plus de largeur pour
       ses champs côte à côte, au lieu de rester figé façon mobile. */
    .add-form .form-row{gap:14px;}

    /* Le tableur admin respire vraiment, plus besoin de défiler pour
       voir toutes les colonnes sur un écran large. */
    .spreadsheet-table{font-size:14px;}
    .spreadsheet-table th, .spreadsheet-table input{padding:9px 12px;}
  }

  @media (min-width: 1200px){
    .wrap{max-width:1240px;}
    .book-grid{grid-template-columns:repeat(auto-fill, minmax(160px, 1fr));}
  }

  .btn-share{
    width:100%;
    margin-top:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    background:linear-gradient(180deg, var(--paper-soft), var(--paper));
    border:1px solid var(--brass);
    color:var(--brass-dark);
    padding:10px 16px;
    border-radius:5px;
    font-size:14px;
    font-weight:500;
    font-family:'Inter',sans-serif;
    cursor:pointer;
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
  }
  .btn-share:hover{background:var(--paper-soft);}
  .btn-share-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:20px;height:20px;
    border-radius:50%;
    background:var(--brass);
    color:#fff;
    font-size:11px;
    flex-shrink:0;
  }

  .btn-danger{
    background:var(--card);
    border:1px solid var(--plum);
    color:var(--plum-dark);
    padding:10px 16px;
    border-radius:5px;
    font-size:14px;
    font-weight:500;
    font-family:'Inter',sans-serif;
    cursor:pointer;
  }
  .btn-danger:hover{background:#F6DEDA;}
  .btn-danger:active{background:#F0C9C0;}

  .library-banner{
    border-radius:10px;
    overflow:hidden;
    margin-bottom:18px;
    box-shadow:0 2px 6px rgba(36,29,22,0.25);
    line-height:0;
  }
  .library-banner svg{display:block;width:100%;height:auto;}

  /* ============================================================
     Bandeau de consentement cookies
     ============================================================ */
  .cookie-banner{
    position:fixed;left:0;right:0;bottom:0;z-index:500;
    background:var(--ink);color:var(--paper-soft);
    padding:16px 20px;
    box-shadow:0 -2px 10px rgba(0,0,0,0.3);
    font-family:'Inter',sans-serif;
  }
  .cookie-banner-text{font-size:13px;line-height:1.5;margin-bottom:12px;max-width:900px;}
  .cookie-banner-text strong{color:#fff;}
  .cookie-banner-text a{color:var(--paper-soft);text-decoration:underline;}
  .cookie-banner-actions{display:flex;gap:8px;flex-wrap:wrap;}
  .cookie-btn{padding:9px 14px;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;font-family:'Inter',sans-serif;}
  .cookie-btn-primary{background:var(--moss);border:1px solid var(--moss);color:#fff;}
  .cookie-btn-outline{background:transparent;border:1px solid var(--paper-soft);color:var(--paper-soft);}
  .cookie-panel{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,0.2);max-width:400px;}
  .cookie-panel-row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px;padding:6px 0;}

  .site-footer{
    max-width:640px;margin:0 auto;padding:24px 20px 90px;
    display:flex;gap:16px;flex-wrap:wrap;justify-content:center;
    font-size:12px;
  }
  .site-footer a, .footer-link-btn{
    color:var(--ink-soft);text-decoration:underline;background:none;border:none;
    font-size:12px;cursor:pointer;font-family:'Inter',sans-serif;padding:0;
  }
  @media (min-width: 900px){ .site-footer{max-width:1080px;} }
  @media (min-width: 1200px){ .site-footer{max-width:1240px;} }