.wrap-wide{max-width:1180px;margin:0 auto;padding:0 24px;}
  main{padding:32px 0 60px;}
  h1{font-size:26px;margin-bottom:4px;}
  .sub{color:var(--grey);font-size:13.5px;margin-bottom:22px;}

  /* --- key gate --- */
  #gate{max-width:440px;margin:60px auto;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:30px;}
  #gate label{display:block;font-weight:700;font-size:13px;color:var(--navy);margin-bottom:6px;}
  #gate input{width:100%;padding:11px 12px;border:1px solid var(--border);border-radius:8px;font-size:14.5px;margin-bottom:14px;font-family:inherit;}
  #gate button{width:100%;background:var(--gold);color:var(--navy-dark);border:none;padding:12px;border-radius:8px;font-weight:700;font-size:14.5px;cursor:pointer;}
  #gate .hint{font-size:12.5px;color:var(--grey);margin-top:10px;}
  #gate .err{color:#b3261e;font-size:13px;margin-top:10px;display:none;}

  /* --- inbox layout --- */
  #app{display:none;}
  .layout{display:grid;grid-template-columns:220px 320px 1fr;gap:0;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:var(--card);min-height:560px;}
  .pane{border-right:1px solid var(--border);overflow-y:auto;max-height:74vh;}
  .pane:last-child{border-right:none;}

  .addr-item{padding:14px 16px;cursor:pointer;border-bottom:1px solid var(--border);font-size:13.5px;}
  .addr-item:hover{background:#FBFAF7;}
  .addr-item.active{background:#FFF9E9;border-left:3px solid var(--gold);}
  .addr-item .name{font-weight:700;color:var(--navy);display:block;word-break:break-all;}
  .addr-item .count{font-size:12px;color:var(--grey);margin-top:3px;display:flex;justify-content:space-between;}
  .addr-item .unread-badge{background:var(--green);color:#fff;border-radius:10px;padding:1px 8px;font-size:11px;font-weight:700;}

  .folder-tabs{display:flex;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--card);z-index:1;}
  .folder-tabs button{flex:1;border:none;background:none;padding:11px 8px;font-size:12.5px;font-weight:700;color:var(--grey);cursor:pointer;border-bottom:2px solid transparent;}
  .folder-tabs button.active{color:var(--navy);border-bottom-color:var(--gold);}

  .msg-item{padding:13px 16px;cursor:pointer;border-bottom:1px solid var(--border);font-size:13px;}
  .msg-item:hover{background:#FBFAF7;}
  .msg-item.active{background:#FFF9E9;}
  .msg-item.unread .msg-from{font-weight:700;}
  .msg-from{color:var(--navy);font-size:13.5px;}
  .msg-subject{color:var(--ink);margin:2px 0;}
  .msg-date{color:var(--grey);font-size:11.5px;}
  .msg-snippet{color:var(--grey);font-size:12px;margin-top:2px;}
  .ai-badge{display:inline-block;margin-left:6px;background:#E4C868;color:#152A3E;font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:4px;}
  .empty-note{padding:24px 16px;color:var(--grey);font-size:13px;}

  .detail{padding:22px 26px;}
  .detail h2{font-size:19px;color:var(--navy);margin:0 0 10px;font-family:Georgia,serif;}
  .detail .meta{font-size:13px;color:var(--grey);margin-bottom:16px;line-height:1.7;}
  .detail .meta b{color:var(--ink);}
  .detail iframe{width:100%;min-height:360px;border:1px solid var(--border);border-radius:8px;background:#fff;}
  .detail pre{white-space:pre-wrap;font-family:inherit;font-size:14px;background:#FBFAF7;border:1px solid var(--border);border-radius:8px;padding:14px;}
  .attachments{margin-top:16px;}
  .attachments h3{font-size:13px;color:var(--navy);margin-bottom:8px;}
  .att-item{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border:1px solid var(--border);border-radius:8px;margin-bottom:6px;font-size:12.5px;}
  .att-item a, .att-item button{color:var(--green);font-weight:700;text-decoration:none;background:none;border:none;cursor:pointer;font-size:12.5px;font-family:inherit;padding:0;}
  .detail-actions{margin-top:18px;display:flex;gap:10px;}
  .detail-actions button{border:1px solid var(--border);background:#fff;border-radius:8px;padding:8px 14px;font-size:12.5px;font-weight:700;cursor:pointer;color:var(--ink);}
  .detail-actions button:hover{border-color:var(--gold);}
  .detail-actions button.danger{color:#b3261e;}

  .toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
  .toolbar button{border:1px solid var(--border);background:#fff;border-radius:8px;padding:8px 14px;font-size:12.5px;font-weight:700;cursor:pointer;color:var(--ink);margin-left:8px;}
  .toolbar button:first-child{margin-left:0;}

  /* --- compose modal --- */
  .modal-backdrop{display:none;position:fixed;inset:0;background:rgba(21,42,62,.55);z-index:50;align-items:center;justify-content:center;}
  .modal-backdrop.open{display:flex;}
  .modal{background:var(--card);border-radius:14px;padding:26px;width:100%;max-width:560px;max-height:86vh;overflow-y:auto;}
  .modal h2{font-size:18px;color:var(--navy);margin:0 0 16px;font-family:Georgia,serif;}
  .modal label{display:block;font-size:12.5px;font-weight:700;color:var(--navy);margin-bottom:4px;margin-top:12px;}
  .modal select,.modal input[type=text],.modal input[type=email],.modal textarea{
    width:100%;padding:9px 11px;border:1px solid var(--border);border-radius:8px;font-size:13.5px;font-family:inherit;
  }
  .modal textarea{min-height:160px;resize:vertical;}
  .modal-actions{margin-top:18px;display:flex;justify-content:flex-end;gap:10px;}
  .modal-actions button{border:1px solid var(--border);background:#fff;border-radius:8px;padding:9px 16px;font-size:13px;font-weight:700;cursor:pointer;color:var(--ink);}
  .modal-actions button.primary{background:var(--gold);color:var(--navy-dark);border-color:var(--gold);}
  .modal-err{color:#b3261e;font-size:12.5px;margin-top:8px;display:none;}
  .modal-ok{color:var(--green);font-size:12.5px;margin-top:8px;display:none;}