/* ============================================================
   MEDIA-MGR v2.0 — サイバーパンク Yellow Theme
   ============================================================ */

/* ---- Variables ---- */
:root {
  --gold:      #ffd700;
  --amber:     #ff8c00;
  --gold-dim:  rgba(255,215,0,0.4);
  --gold-faint:rgba(255,215,0,0.08);
  --green-acc: #00ff41;
  --bg-black:  #000000;
  --bg-dark:   #050503;
  --bg-panel:  rgba(10,8,0,0.88);
  --white:     #ffffff;
  --gray:      #888888;
  --gray-dim:  #333333;
  --danger:    #ff0033;
  --font-mono: 'Share Tech Mono', 'Courier New', monospace;
  --font-orb:  'Orbitron', sans-serif;
  --font-jp:   'Noto Sans JP', sans-serif;
}

/* ---- Reset ---- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-mono);
  background:var(--bg-black);
  color:var(--gold);
  min-height:100vh;
  overflow-x:hidden;
  position:relative;
}

/* ---- Grid Background ---- */
.grid-bg{
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(255,215,0,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,215,0,.04) 1px,transparent 1px);
  background-size:40px 40px;
}

/* ---- Scanline ---- */
.scanline-overlay{
  position:fixed;inset:0;pointer-events:none;z-index:1;
  background:repeating-linear-gradient(
    0deg,transparent,transparent 2px,
    rgba(0,0,0,.15) 2px,rgba(0,0,0,.15) 4px
  );
}

/* ============================================================
   HEADER
   ============================================================ */
.hud-header{
  position:sticky;top:0;z-index:100;
  display:flex;align-items:center;gap:1.5rem;
  padding:.6rem 1.5rem;
  background:rgba(5,4,0,.95);
  border-bottom:1px solid var(--gold-dim);
  box-shadow:0 0 20px rgba(255,215,0,.12);
}
.header-corner{
  position:absolute;width:12px;height:12px;
  border-color:var(--gold);border-style:solid;
}
.header-corner.tl{top:4px;left:4px;border-width:2px 0 0 2px;}
.header-corner.tr{top:4px;right:4px;border-width:2px 2px 0 0;}
.header-corner.bl{bottom:4px;left:4px;border-width:0 0 2px 2px;}
.header-corner.br{bottom:4px;right:4px;border-width:0 2px 2px 0;}

.sys-badge{
  font-family:var(--font-orb);font-size:.55rem;font-weight:700;
  padding:.2rem .4rem;border:1px solid var(--gold);color:var(--gold);
  letter-spacing:.15em;
}
.header-title{display:flex;flex-direction:column;gap:.1rem;}
.title-main{
  font-family:var(--font-orb);font-size:1rem;font-weight:700;
  color:var(--gold);text-shadow:0 0 12px var(--gold-dim);letter-spacing:.12em;
}
.title-sub{font-size:.6rem;color:var(--amber);opacity:.7;letter-spacing:.08em;}

.header-center{display:flex;flex-direction:column;align-items:center;gap:.3rem;margin:0 auto;}
.status-bar{display:flex;align-items:center;gap:.5rem;}
.status-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--green-acc);
  box-shadow:0 0 8px var(--green-acc);
  animation:blink 2s infinite;
}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:.3;}}
.status-text{font-size:.65rem;letter-spacing:.15em;color:var(--green-acc);}
.data-counter{display:flex;align-items:center;gap:.6rem;}
.counter-label{font-size:.55rem;color:var(--gray);letter-spacing:.1em;}
.counter-value{font-size:.8rem;color:var(--gold);font-weight:700;min-width:1.5rem;text-align:center;}

.header-right{display:flex;flex-direction:column;align-items:flex-end;gap:.1rem;}
.clock{font-family:var(--font-orb);font-size:.9rem;color:var(--gold);letter-spacing:.1em;}
.date{font-size:.6rem;color:var(--amber);opacity:.6;}

/* ============================================================
   MAIN
   ============================================================ */
.main-container{
  position:relative;z-index:2;
  max-width:1400px;margin:0 auto;padding:1.5rem;
  display:flex;flex-direction:column;gap:1.5rem;
}

/* ============================================================
   PANEL
   ============================================================ */
.panel{
  background:var(--bg-panel);
  border:1px solid var(--gold-dim);
  position:relative;
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));
}
.panel::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,215,0,.04) 0%,transparent 50%);
  pointer-events:none;
}

.panel-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:.8rem 1.2rem;
  border-bottom:1px solid var(--gold-faint);
  background:rgba(255,215,0,.03);
}
.panel-title{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;}
.step-num{
  font-family:var(--font-orb);font-size:1.4rem;font-weight:900;
  color:var(--gold);opacity:.3;line-height:1;
}
.panel-name{
  font-family:var(--font-orb);font-size:.75rem;font-weight:700;
  color:var(--gold);letter-spacing:.15em;
}
.panel-desc{font-size:.65rem;color:var(--gray);letter-spacing:.05em;}
.panel-status{
  font-size:.6rem;color:var(--amber);letter-spacing:.15em;
  padding:.2rem .6rem;border:1px solid rgba(255,140,0,.3);
}
.panel-actions{display:flex;align-items:center;gap:.8rem;}

.panel-body{padding:1.2rem;}

/* ============================================================
   DROP ZONE
   ============================================================ */
.drop-zone{
  border:1px dashed var(--gold-dim);
  padding:2.5rem 1rem;
  text-align:center;
  cursor:pointer;
  transition:all .2s;
  position:relative;
  display:flex;flex-direction:column;align-items:center;gap:1rem;
}
.drop-zone:hover,.drop-zone.drag-over{
  border-color:var(--gold);
  background:var(--gold-faint);
  box-shadow:0 0 20px rgba(255,215,0,.1);
}
.drop-icon{color:var(--gold);opacity:.5;}
.drop-main{font-size:.9rem;color:var(--white);margin-bottom:.3rem;}
.drop-sub{font-size:.75rem;color:var(--gray);}
.drop-hint{font-size:.65rem;color:var(--gray);opacity:.6;}
.file-label{
  color:var(--gold);cursor:pointer;text-decoration:underline;
  text-underline-offset:2px;
}
.file-label:hover{color:var(--amber);}

/* ---- Folder info bar ---- */
.folder-info-bar{
  display:flex;align-items:center;gap:.6rem;
  padding:.5rem 1rem;
  background:rgba(255,215,0,.06);
  border:1px solid var(--gold-dim);
  margin-top:.8rem;
  font-size:.75rem;
}
.folder-icon-sm{font-size:1rem;}
.folder-name-label{color:var(--gold);font-family:var(--font-mono);}
.folder-badge{
  font-size:.6rem;color:var(--amber);
  padding:.1rem .4rem;border:1px solid rgba(255,140,0,.4);
  margin-left:auto;
}

/* ============================================================
   FILE LIST
   ============================================================ */
.uploaded-files{margin-top:1rem;}
.files-header{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:.5rem;
}
.files-title{font-size:.65rem;color:var(--amber);letter-spacing:.12em;}
.btn-clear{
  background:none;border:1px solid var(--gray-dim);color:var(--gray);
  font-size:.6rem;padding:.2rem .5rem;cursor:pointer;font-family:var(--font-mono);
  transition:all .2s;
}
.btn-clear:hover{border-color:var(--danger);color:var(--danger);}

.files-list{display:flex;flex-direction:column;gap:.3rem;}
.file-item{
  display:flex;align-items:center;gap:.8rem;
  padding:.4rem .8rem;
  border:1px solid var(--gray-dim);
  font-size:.7rem;
}
.file-item.ready{border-color:rgba(0,255,65,.3);}
.file-item.loading{border-color:var(--gold-dim);}
.file-item.error{border-color:rgba(255,0,51,.3);}
.file-name{flex:1;color:var(--white);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.file-size{color:var(--gray);min-width:4rem;text-align:right;}
.file-status{font-size:.6rem;min-width:3.5rem;text-align:center;padding:.1rem .3rem;}
.file-item.ready .file-status{color:var(--green-acc);}
.file-item.loading .file-status{color:var(--gold);}
.file-item.error .file-status{color:var(--danger);}

/* ============================================================
   BUTTONS
   ============================================================ */
.hud-btn{
  display:inline-flex;align-items:center;gap:.5rem;
  position:relative;overflow:hidden;
  font-family:var(--font-orb);font-size:.65rem;font-weight:600;
  letter-spacing:.15em;padding:.6rem 1.4rem;
  border:none;cursor:pointer;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
  transition:all .2s;
}
.hud-btn:disabled{opacity:.4;cursor:not-allowed;}
.btn-icon{font-size:.9rem;}
.btn-glow{
  position:absolute;inset:0;opacity:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent);
  transition:opacity .2s;
}
.hud-btn:hover:not(:disabled) .btn-glow{opacity:1;}

.btn-primary{
  background:linear-gradient(135deg,var(--gold),var(--amber));
  color:#000;
}
.btn-primary:hover:not(:disabled){
  box-shadow:0 0 20px rgba(255,215,0,.4);
}

.btn-export{
  background:linear-gradient(135deg,#1a1500,#2d2000);
  border:1px solid var(--gold);color:var(--gold);
  width:100%;justify-content:center;
}
.btn-export:hover:not(:disabled){
  background:linear-gradient(135deg,#2d2000,#3d2d00);
  box-shadow:0 0 15px rgba(255,215,0,.3);
}
.btn-green{
  border-color:var(--green-acc);color:var(--green-acc);
}
.btn-green:hover:not(:disabled){
  box-shadow:0 0 15px rgba(0,255,65,.2);
}

.btn-sm{
  background:transparent;border:1px solid var(--gray-dim);color:var(--gray);
  font-family:var(--font-mono);font-size:.65rem;padding:.4rem .8rem;
  clip-path:none;letter-spacing:.05em;
}
.btn-sm:hover{border-color:var(--gold);color:var(--gold);}

.btn-xs{
  background:transparent;border:1px solid var(--gray-dim);color:var(--gray);
  font-size:.6rem;padding:.2rem .5rem;cursor:pointer;font-family:var(--font-mono);
  transition:all .2s;
}
.btn-xs:hover{border-color:var(--gold);color:var(--gold);}

.action-row{display:flex;align-items:center;gap:1rem;margin-top:1rem;}
.process-info{font-size:.65rem;color:var(--amber);}

/* ============================================================
   TAB NAV
   ============================================================ */
.tab-nav{
  border-bottom:1px solid var(--gold-dim);
  overflow:hidden;
}
.tab-nav-scroll{
  display:flex;gap:.3rem;padding:.5rem 1rem;
  overflow-x:auto;
  scrollbar-width:thin;
  scrollbar-color:var(--gold-dim) transparent;
}
.tab-btn{
  display:inline-flex;align-items:center;gap:.4rem;
  background:transparent;border:1px solid var(--gray-dim);
  color:var(--gray);font-family:var(--font-mono);font-size:.65rem;
  padding:.4rem .8rem;cursor:pointer;white-space:nowrap;
  transition:all .2s;
}
.tab-btn:hover{border-color:var(--gold-dim);color:var(--gold);}
.tab-btn.active{
  border-color:var(--gold);color:var(--gold);
  background:rgba(255,215,0,.08);
  box-shadow:0 0 10px rgba(255,215,0,.1);
}
.tab-icon{font-size:.7rem;}

/* ============================================================
   SUMMARY BAR
   ============================================================ */
.summary-bar{
  display:flex;gap:0;
  border-bottom:1px solid var(--gold-dim);
}
.summary-item{
  flex:1;padding:.5rem 1rem;
  border-right:1px solid var(--gold-faint);
}
.summary-item:last-child{border-right:none;}
.summary-label{display:block;font-size:.55rem;color:var(--gray);letter-spacing:.1em;margin-bottom:.2rem;}
.summary-value{font-family:var(--font-orb);font-size:.85rem;color:var(--gold);}

/* ============================================================
   DATA TABLE
   ============================================================ */
.table-container{
  overflow-x:auto;
  scrollbar-width:thin;
  scrollbar-color:var(--gold-dim) transparent;
  max-height:55vh;
  overflow-y:auto;
}
.data-table{
  width:100%;border-collapse:collapse;font-size:.72rem;
  min-width:700px;
}
.data-table th{
  position:sticky;top:0;z-index:10;
  background:#0d0a00;color:var(--amber);
  padding:.5rem .7rem;text-align:left;
  border-bottom:1px solid var(--gold-dim);
  font-family:var(--font-mono);letter-spacing:.08em;
  white-space:nowrap;font-weight:normal;
}
.data-table th.sortable{cursor:pointer;}
.data-table th.sortable:hover{color:var(--gold);}
.data-table th.num{text-align:right;}
.sort-icon{opacity:.4;margin-left:.3rem;}

.data-table td{
  padding:.45rem .7rem;border-bottom:1px solid rgba(255,215,0,.06);
  color:var(--white);vertical-align:middle;
}
.data-table tr:hover td{background:rgba(255,215,0,.05);}
.data-table td.p-amount{text-align:right;font-family:var(--font-mono);color:var(--gold);}
.data-table tbody tr:last-child td{border-bottom:none;}

/* ============================================================
   PAGINATION
   ============================================================ */
.pagination{
  display:flex;justify-content:center;gap:.4rem;
  padding:.8rem 1rem;
  flex-wrap:wrap;
}
.page-btn{
  background:transparent;border:1px solid var(--gray-dim);color:var(--gray);
  font-family:var(--font-mono);font-size:.65rem;
  padding:.3rem .6rem;cursor:pointer;min-width:2rem;text-align:center;
  transition:all .15s;
}
.page-btn:hover{border-color:var(--gold);color:var(--gold);}
.page-btn.active{border-color:var(--gold);color:var(--gold);background:rgba(255,215,0,.1);}

/* ============================================================
   SEARCH
   ============================================================ */
.search-box{
  display:flex;align-items:center;gap:.4rem;
  border:1px solid var(--gray-dim);padding:.3rem .6rem;
}
.search-box:focus-within{border-color:var(--gold-dim);}
.search-icon{color:var(--gold);font-size:.7rem;}
.search-input{
  background:transparent;border:none;outline:none;
  color:var(--white);font-family:var(--font-mono);font-size:.7rem;
  width:150px;
}
.search-input::placeholder{color:var(--gray);}

/* ============================================================
   EXPORT PANEL
   ============================================================ */
.export-body{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;}
@media(max-width:768px){.export-body{grid-template-columns:1fr;}}

.export-card{
  border:1px solid var(--gold-dim);padding:1rem;
  background:rgba(255,215,0,.03);
  display:flex;flex-direction:column;gap:.8rem;
}
.export-card-header{display:flex;align-items:center;gap:.8rem;}
.export-card-icon{font-size:1.5rem;color:var(--gold);}
.export-card-name{font-family:var(--font-orb);font-size:.7rem;color:var(--gold);letter-spacing:.1em;}
.export-card-desc{font-size:.6rem;color:var(--gray);margin-top:.2rem;}

.export-filename-row,.export-prefix-row{
  display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;
}
.filename-label{font-size:.6rem;color:var(--gray);white-space:nowrap;}
.filename-input{
  flex:1;background:rgba(255,215,0,.06);border:1px solid var(--gold-dim);
  color:var(--white);font-family:var(--font-mono);font-size:.7rem;
  padding:.3rem .5rem;outline:none;min-width:0;
}
.filename-input:focus{border-color:var(--gold);}
.filename-ext{font-size:.65rem;color:var(--gray);white-space:nowrap;}

.export-options{display:flex;gap:1rem;flex-wrap:wrap;}
.option-check{display:flex;align-items:center;gap:.4rem;cursor:pointer;font-size:.65rem;color:var(--gray);}
.option-check input{display:none;}
.checkmark{
  width:12px;height:12px;border:1px solid var(--gray-dim);
  display:inline-flex;align-items:center;justify-content:center;
  transition:all .15s;flex-shrink:0;
}
.option-check input:checked + .checkmark{
  background:var(--gold);border-color:var(--gold);
}
.option-check input:checked + .checkmark::after{
  content:'✓';font-size:.5rem;color:#000;
}

.agency-select-area{display:flex;flex-direction:column;gap:.5rem;}
.agency-select-header{display:flex;align-items:center;justify-content:space-between;font-size:.65rem;color:var(--gray);}
.select-btns{display:flex;gap:.4rem;}
.agency-checkboxes{
  display:flex;flex-wrap:wrap;gap:.4rem;
  max-height:120px;overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:var(--gold-dim) transparent;
}
.agency-cb-label{
  display:flex;align-items:center;gap:.3rem;
  font-size:.65rem;color:var(--gray);cursor:pointer;
  padding:.2rem .5rem;border:1px solid var(--gray-dim);
  transition:all .15s;
}
.agency-cb-label:hover{border-color:var(--gold-dim);color:var(--gold);}
.agency-cb-label input{display:none;}
.agency-cb-label input:checked ~ span{color:var(--gold);}
.agency-cb-label:has(input:checked){border-color:var(--gold);background:rgba(255,215,0,.06);}

/* ============================================================
   FLOATING ACTIONS
   ============================================================ */
.floating-actions{
  position:fixed;bottom:5rem;right:1.5rem;
  display:flex;flex-direction:column;gap:.5rem;z-index:200;
}
.fab{
  width:48px;height:48px;border-radius:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  background:rgba(10,8,0,.9);border:1px solid var(--gold);
  color:var(--gold);cursor:pointer;font-size:.9rem;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
  transition:all .2s;
}
.fab:hover{background:rgba(255,215,0,.1);box-shadow:0 0 15px rgba(255,215,0,.2);}
.fab.fab-secondary{border-color:var(--gray-dim);color:var(--gray);}
.fab.fab-secondary:hover{border-color:var(--gold);color:var(--gold);}
.fab-label{font-size:.45rem;letter-spacing:.1em;font-family:var(--font-mono);}

/* ============================================================
   LOG CONSOLE
   ============================================================ */
.log-console{
  position:fixed;bottom:0;left:0;right:0;z-index:150;
  background:rgba(5,4,0,.96);border-top:1px solid var(--gold-dim);
  max-height:8rem;
}
.log-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:.3rem .8rem;border-bottom:1px solid var(--gray-dim);
}
.log-title{font-size:.55rem;color:var(--amber);letter-spacing:.15em;}
.log-toggle{
  background:none;border:none;color:var(--gray);cursor:pointer;font-size:.7rem;
  font-family:var(--font-mono);
}
.log-body{
  overflow-y:auto;max-height:5.5rem;padding:.3rem .8rem;
  scrollbar-width:thin;scrollbar-color:var(--gold-dim) transparent;
}
.log-entry{font-size:.6rem;color:var(--gray);line-height:1.6;display:flex;gap:.5rem;}
.log-entry.ok .log-msg{color:var(--green-acc);}
.log-entry.error .log-msg{color:var(--danger);}
.log-entry.warn .log-msg{color:var(--amber);}
.log-time{color:var(--gray-dim);white-space:nowrap;flex-shrink:0;}
.log-msg{word-break:break-all;}

/* ============================================================
   TOAST
   ============================================================ */
.toast-container{
  position:fixed;top:5rem;right:1rem;z-index:300;
  display:flex;flex-direction:column;gap:.4rem;
  pointer-events:none;
}
.toast{
  padding:.5rem 1rem;border-left:3px solid var(--gold);
  background:rgba(5,4,0,.96);font-size:.7rem;
  animation:slideIn .2s ease;max-width:280px;
  pointer-events:auto;
}
.toast.success{border-color:var(--green-acc);color:var(--green-acc);}
.toast.error{border-color:var(--danger);color:var(--danger);}
.toast.warn{border-color:var(--amber);color:var(--amber);}
@keyframes slideIn{from{transform:translateX(20px);opacity:0;}to{transform:none;opacity:1;}}

/* ============================================================
   LOADING OVERLAY
   ============================================================ */
.loading-overlay{
  position:fixed;inset:0;z-index:500;
  background:rgba(0,0,0,.85);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1rem;
}
.loading-title{
  font-family:var(--font-orb);font-size:1rem;color:var(--gold);
  letter-spacing:.2em;animation:blink 1s infinite;
}
.loading-sub{font-size:.7rem;color:var(--amber);}
.loading-bar-wrap{width:200px;height:4px;background:var(--gray-dim);overflow:hidden;}
.loading-bar{
  height:100%;background:var(--gold);
  animation:loadbar 1.2s ease-in-out infinite;
}
@keyframes loadbar{0%{width:0;margin-left:0;}50%{width:100%;margin-left:0;}100%{width:0;margin-left:100%;};}

/* ============================================================
   PREVIEW MODAL
   ============================================================ */
.preview-overlay{
  position:fixed;inset:0;z-index:400;
  background:rgba(0,0,0,.88);
  display:flex;align-items:center;justify-content:center;
  padding:1rem;
}
.preview-modal{
  background:#050400;
  border:1px solid var(--gold-dim);
  width:min(900px,100%);max-height:85vh;
  display:flex;flex-direction:column;
  clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,20px 100%,0 calc(100% - 20px));
}
.preview-modal-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:.8rem 1.2rem;border-bottom:1px solid var(--gold-dim);
  flex-shrink:0;
}
.preview-modal-title{font-family:var(--font-orb);font-size:.75rem;color:var(--gold);letter-spacing:.12em;}
.preview-close{
  background:none;border:1px solid var(--gray-dim);color:var(--gray);
  cursor:pointer;font-family:var(--font-mono);font-size:.7rem;padding:.2rem .5rem;
}
.preview-close:hover{border-color:var(--danger);color:var(--danger);}
.preview-modal-body{overflow-y:auto;padding:1rem;flex:1;}
.preview-modal-footer{
  padding:.8rem 1.2rem;border-top:1px solid var(--gold-dim);
  display:flex;align-items:center;justify-content:space-between;
  flex-shrink:0;gap:1rem;flex-wrap:wrap;
}
#previewFooterInfo{font-size:.65rem;color:var(--gray);}

.preview-sheet-tabs{display:flex;gap:.3rem;flex-wrap:wrap;margin-bottom:.8rem;}
.preview-sheet-tab{
  background:transparent;border:1px solid var(--gray-dim);color:var(--gray);
  font-size:.6rem;padding:.25rem .6rem;cursor:pointer;font-family:var(--font-mono);
  transition:all .15s;
}
.preview-sheet-tab.active{border-color:var(--gold);color:var(--gold);}

.preview-table-wrap{overflow-x:auto;}
.preview-table{width:100%;border-collapse:collapse;font-size:.68rem;}
.preview-table th{
  background:rgba(255,215,0,.1);color:var(--amber);
  padding:.4rem .6rem;text-align:left;border:1px solid var(--gold-dim);
  white-space:nowrap;font-weight:normal;letter-spacing:.05em;
}
.preview-table td{
  padding:.35rem .6rem;border:1px solid rgba(255,215,0,.08);color:var(--white);
}
.preview-table td.p-amount{text-align:right;}
.preview-table tr:hover td{background:rgba(255,215,0,.04);}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:600px){
  .hud-header{padding:.5rem .8rem;gap:.8rem;}
  .title-main{font-size:.8rem;}
  .header-center{display:none;}
  .panel-header{flex-direction:column;align-items:flex-start;gap:.4rem;}
  .main-container{padding:.8rem;}
  .summary-bar{flex-wrap:wrap;}
  .summary-item{min-width:50%;}
}