:root {
      --bg:#080c14; --bg2:#060a11; --card:rgba(255,255,255,0.055); --card2:rgba(255,255,255,0.035);
      --border:rgba(255,255,255,0.09);
      --teal:#00e5c8; --teal2:#00bfa8; --teal-glow:rgba(0,229,200,0.18); --teal-dim:rgba(0,229,200,0.10);
      --text:#ffffff; --text2:#a8b4cc; --text3:#4e5a78;
      --green:#00e57a; --green-bg:rgba(0,229,122,0.10);
      --red:#ff5a7e; --red-bg:rgba(255,90,126,0.10);
      --gold:#FFD700; --silver:#C0C0C0; --bronze:#CD7F32;
      --amber:#ffb830; --amber-dim:rgba(255,184,48,0.12);
      --violet:#b06fff; --violet-dim:rgba(176,111,255,0.12);
      --safe-b:env(safe-area-inset-bottom,0px); --r:14px; --r-lg:20px;
      --glass-blur:blur(24px) saturate(160%);
      --glass-border:rgba(255,255,255,0.13);
      --glass-shine:rgba(255,255,255,0.22);
    }
    *{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
    html{height:100%;}
    body{font-family:'Outfit',sans-serif;background:var(--bg2);color:var(--text);min-height:100%;font-size:14px;line-height:1.5;
      background-image:
        radial-gradient(ellipse 80% 60% at 15% 10%, rgba(0,229,200,0.07) 0%, transparent 60%),
        radial-gradient(ellipse 60% 50% at 85% 80%, rgba(0,120,255,0.06) 0%, transparent 55%),
        radial-gradient(ellipse 40% 40% at 50% 50%, rgba(120,60,255,0.04) 0%, transparent 70%);
      background-attachment:fixed;
    }

    /* ─── HEADER ─── */
    header{
      background:rgba(8,12,20,0.72);
      backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
      border-bottom:1px solid var(--glass-border);
      box-shadow:0 1px 0 rgba(255,255,255,0.04), 0 8px 32px rgba(0,0,0,0.4);
      height:60px;padding:0 20px;display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:300;overflow:visible;
    }
    #periodBar{
      position:sticky;top:60px;z-index:299;
      background:rgba(6,10,17,0.68);
      backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
      border-bottom:1px solid var(--glass-border);
      box-shadow:0 4px 20px rgba(0,0,0,0.3);
      padding:8px 14px;display:flex;gap:6px;align-items:center;
    }
    #periodBar .ptab{flex:1;padding:8px 4px;font-size:14px;border-radius:8px;font-weight:700;}
    .logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:clamp(18px,4.5vw,22px);letter-spacing:-0.03em;}
    .logo-orb{width:clamp(34px,10vw,48px);height:clamp(34px,10vw,48px);border-radius:clamp(10px,2.5vw,14px);background:linear-gradient(135deg,var(--teal),#0088ff);display:flex;align-items:center;justify-content:center;font-size:clamp(16px,5vw,22px);box-shadow:0 0 20px var(--teal-glow);}
    .logo-text em{color:var(--teal);font-style:normal;}
    .bq-pill{font-size:9px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--teal);background:var(--teal-dim);border:1px solid rgba(0,229,200,0.2);padding:3px 8px;border-radius:6px;}
    #statusBar{position:absolute;left:50%;transform:translateX(-50%);font-size:11px;color:var(--text2);display:flex;align-items:center;gap:6px;pointer-events:none;white-space:nowrap;z-index:1;}
    #statusBar.loading{color:var(--teal);font-size:24px;font-weight:700;gap:10px;text-shadow:0 0 20px var(--teal-glow);}
    #statusBar.loading .spinner{width:20px;height:20px;border-width:3px;}
    #statusBar.error{color:var(--red);}
    .filter-btn{width:clamp(38px,10vw,48px);height:clamp(38px,10vw,48px);border-radius:11px;background:rgba(255,255,255,0.07);border:1px solid var(--glass-border);display:none;align-items:center;justify-content:center;cursor:pointer;color:var(--text2);transition:all .2s;flex-shrink:0;backdrop-filter:blur(12px);}
    .filter-btn.active{background:rgba(0,229,200,0.14);border-color:rgba(0,229,200,0.35);color:var(--teal);box-shadow:0 0 16px rgba(0,229,200,0.25);}
    .share-btn{width:clamp(38px,10vw,48px);height:clamp(38px,10vw,48px);border-radius:11px;background:rgba(255,255,255,0.07);border:1px solid var(--glass-border);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text2);transition:all .2s;flex-shrink:0;margin-left:auto;backdrop-filter:blur(12px);}
    .share-btn:hover{background:rgba(0,229,200,0.12);border-color:rgba(0,229,200,0.3);color:var(--teal);}
    .share-btn.copied{background:rgba(0,229,200,0.14);border-color:rgba(0,229,200,0.35);color:var(--teal);box-shadow:0 0 16px rgba(0,229,200,0.25);}
    /* 疑似フルスクリーン（スマホ Chrome/Safari 対応） */
    body.pseudo-fs{position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden;z-index:0;}
    body.pseudo-fs .content{overflow-y:auto;height:calc(100vh - 56px - var(--safe-b,0px));-webkit-overflow-scrolling:touch;}
    .fullscreen-btn{width:clamp(38px,10vw,48px);height:clamp(38px,10vw,48px);border-radius:11px;background:rgba(255,255,255,0.07);border:1px solid var(--glass-border);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text2);transition:all .2s;flex-shrink:0;margin-left:4px;backdrop-filter:blur(12px);}
    .fullscreen-btn:hover{background:rgba(0,229,200,0.12);border-color:rgba(0,229,200,0.3);color:var(--teal);}
    .fullscreen-btn.active{background:rgba(0,229,200,0.14);border-color:rgba(0,229,200,0.35);color:var(--teal);box-shadow:0 0 16px rgba(0,229,200,0.25);}
    .an-stat-card{background:var(--card2);border:1px solid var(--border);border-radius:12px;padding:16px 20px;}
    .an-event-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--border);}
    .an-event-row:last-child{border-bottom:none;}
    .an-bar-wrap{flex:1;height:6px;background:var(--border);border-radius:3px;overflow:hidden;}
    .an-bar{height:100%;background:linear-gradient(90deg,var(--teal),#60d9ff);border-radius:3px;transition:width .4s ease;}
    .an-day-row{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:12px;color:var(--text2);}
    #shareCopiedToast{position:fixed;top:68px;right:16px;background:rgba(10,16,28,0.9);backdrop-filter:blur(20px);border:1px solid rgba(0,229,200,0.35);color:var(--teal);font-size:13px;font-weight:600;padding:8px 16px;border-radius:10px;box-shadow:0 4px 24px rgba(0,0,0,0.5),0 0 20px rgba(0,229,200,0.15);opacity:0;transition:opacity .2s;pointer-events:none;z-index:9999;}

    .app{display:flex;flex-direction:column;}

    /* ─── DRAWER ─── */
    .drawer{
      background:rgba(6,10,17,0.82);
      backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
      border-bottom:1px solid var(--glass-border);
      overflow:hidden;max-height:0;transition:max-height .4s cubic-bezier(.4,0,.2,1);
    }
    .drawer.open{max-height:1800px;}
    .drawer-inner{padding:20px 16px 24px;}

    .sect{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:0.14em;color:var(--text3);margin-bottom:12px;margin-top:20px;display:flex;align-items:center;gap:8px;}
    .sect:first-child{margin-top:0;}
    .sect::after{content:'';flex:1;height:1px;background:var(--border);}
    .fgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:4px;}
    .fgrid .span2{grid-column:1/-1;}
    .field{display:flex;flex-direction:column;gap:5px;}
    .field label{font-size:10px;font-weight:600;color:var(--text2);letter-spacing:0.04em;}
    .field input,.field select{padding:10px 12px;background:rgba(255,255,255,0.06);border:1px solid var(--glass-border);border-radius:var(--r);color:var(--text);font-family:'Outfit',sans-serif;font-size:13px;width:100%;transition:border-color .2s, box-shadow .2s;appearance:none;-webkit-appearance:none;backdrop-filter:blur(8px);}
    .field select{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2710%27%20height%3D%276%27%3E%3Cpath%20d%3D%27M0%200l5%206%205-6z%27%20fill%3D%27%236b7494%27/%3E%3C/svg%3E);background-repeat:no-repeat;background-position:right 12px center;padding-right:32px;}
    .field select option{background:#0e1824;color:var(--text);}
    .field select option:checked{background:rgba(0,229,200,0.18);color:var(--teal);}
    .field input:focus,.field select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-dim);}
    .field input::placeholder{color:var(--text3);}
    input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(1) brightness(1.5);opacity:0.7;cursor:pointer;}
    .date-row{display:flex;align-items:center;gap:5px;}
    .date-row input{flex:1;min-width:0;}
    .arr{width:26px;height:38px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--card);border:1px solid var(--border);border-radius:8px;color:var(--text2);font-size:16px;cursor:pointer;transition:all .15s;}
    .arr:active{background:var(--teal-dim);border-color:rgba(0,229,200,0.3);color:var(--teal);}

    .metric-toggle{display:flex;background:var(--card2);border:1px solid var(--border);border-radius:10px;overflow:hidden;margin-bottom:4px;}
    .metric-toggle button{flex:1;padding:11px 6px;font-size:12px;font-weight:700;font-family:'Outfit',sans-serif;border:none;background:transparent;color:var(--text3);cursor:pointer;transition:all .2s;}
    .metric-toggle button.active{background:linear-gradient(135deg,var(--teal),#00aaff);color:#0e1118;border-radius:8px;margin:2px;padding:9px 4px;}
    .metric-note{font-size:10px;color:var(--text3);margin-top:6px;min-height:14px;}

    .btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px 16px;border:none;border-radius:var(--r);font-size:13px;font-weight:600;font-family:'Outfit',sans-serif;cursor:pointer;transition:all .2s;width:100%;}
    .btn+.btn{margin-top:8px;}
    .btn:disabled{opacity:0.45;cursor:not-allowed;}
    .btn:active:not(:disabled){transform:scale(0.97);}
    .btn.loading-btn{opacity:0.7;cursor:wait;pointer-events:none;}
    .btn-show:disabled{opacity:0.45;cursor:not-allowed;}
    .rtab:disabled{opacity:0.45;cursor:not-allowed;pointer-events:none;}
    .btn-teal{background:linear-gradient(135deg,var(--teal),#00aaff);color:#0e1118;font-weight:700;box-shadow:0 4px 20px var(--teal-glow);}
    .btn-ghost{background:rgba(255,255,255,0.06);color:var(--text2);border:1px solid var(--glass-border);backdrop-filter:blur(8px);}
    .btn-ghost:hover{border-color:rgba(0,229,200,0.3);color:var(--teal);}
    .btn-dl{background:var(--green-bg);color:var(--green);border:1px solid rgba(0,229,122,0.2);}
    #excelStatus{font-size:11px;color:var(--text2);min-height:16px;display:flex;align-items:center;gap:6px;margin-top:6px;}

    .pc-hide { display: none; }

    .content{padding:14px 14px calc(min(22vw,130px) + var(--safe-b) + 4px);min-height:60vh;overflow-x:hidden;}

    /* ─── CARD ─── */
    .card{
      background:linear-gradient(145deg, rgba(255,255,255,0.07) 0%, rgba(255,255,255,0.03) 100%);
      border:1px solid var(--glass-border);
      border-radius:var(--r-lg);
      padding:18px;margin-bottom:12px;
      backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);
      box-shadow:0 4px 24px rgba(0,0,0,0.35), inset 0 1px 0 var(--glass-shine);
      position:relative;overflow:hidden;
      animation:fadeUp .25s ease both;
    }
    .card::before{
      content:'';position:absolute;top:0;left:0;right:0;height:1px;
      background:linear-gradient(90deg,transparent,rgba(255,255,255,0.18),transparent);
      pointer-events:none;
    }
    .card-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:14px;gap:8px;}
    .card-head-left{display:flex;align-items:flex-start;gap:8px;flex:1;min-width:0;}
    .card-head-right{display:flex;align-items:center;gap:8px;flex-shrink:0;}
    .card-eyebrow{font-size:22px;font-weight:700;color:var(--text2);white-space:nowrap;}
    .card-eyebrow::after{content:'·';margin:0 6px;color:var(--text3);}
    .card-title{font-size:22px;font-weight:700;color:var(--text);}
    .card-head-left > div{display:flex;align-items:baseline;flex-wrap:nowrap;gap:0;overflow:hidden;}
    #cardTrendDetail .card-head{flex-wrap:wrap;}
    #cardTrendDetail .card-head-left{overflow:hidden;}
    #cardTrendDetail .card-head-left > div{flex-wrap:wrap;min-width:0;}
    #cardTrendDetail .card-eyebrow{font-size:22px;white-space:nowrap;}
    #cardTrendDetail .card-title{font-size:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:calc(100vw - 220px);}
    #cardTrendDetail .card-head-right{flex-shrink:1;min-width:0;}
    #cardTrendDetail .card-total{font-size:36px;white-space:nowrap;}
    .card-total{font-size:36px;font-weight:800;letter-spacing:-0.04em;line-height:1.2;text-align:right;font-variant-numeric:tabular-nums;background:linear-gradient(90deg,var(--teal),#60d9ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;white-space:nowrap;}
    .card-header-total{font-size:20px;font-weight:700;letter-spacing:-0.03em;line-height:1.2;text-align:right;background:linear-gradient(90deg,var(--teal),#60d9ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;white-space:nowrap;font-family:'Outfit',sans-serif;}

    .card-minimize{width:36px;height:36px;border-radius:10px;flex-shrink:0;background:rgba(255,255,255,0.06);border:1px solid var(--glass-border);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text3);transition:all .2s;backdrop-filter:blur(8px);}
    .card-minimize:hover{background:rgba(0,229,200,0.12);border-color:rgba(0,229,200,0.3);color:var(--teal);}
    .card-minimize:active{transform:scale(0.92);}
    .card.minimized .card-body{display:none !important;}
    .card.minimized{padding-bottom:14px;}

    .chart-mode-toggle{display:inline-flex;background:rgba(255,255,255,0.05);border:1px solid var(--glass-border);border-radius:10px;overflow:hidden;margin-bottom:12px;backdrop-filter:blur(12px);}
    .chart-mode-toggle button{padding:5px 16px;font-size:24px;font-weight:600;font-family:'Outfit',sans-serif;border:none;background:transparent;color:var(--text2);cursor:pointer;transition:all .2s;}
    .chart-mode-toggle button.active{background:rgba(0,229,200,0.12);color:var(--teal);border-radius:8px;margin:2px;padding:3px 14px;box-shadow:inset 0 0 0 1px rgba(0,229,200,0.35);}

    .sort-dir-toggle{display:inline-flex;background:rgba(255,255,255,0.05);border:1px solid var(--glass-border);border-radius:10px;overflow:hidden;margin-left:auto;backdrop-filter:blur(12px);}
    .sort-dir-toggle button{padding:5px 13px;font-size:11px;font-weight:600;font-family:'Outfit',sans-serif;border:none;background:transparent;color:var(--text3);cursor:pointer;transition:all .2s;}
    .sort-dir-toggle button.active{background:var(--teal-dim);color:var(--teal);border-radius:8px;margin:2px;padding:3px 11px;}

    .rtabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;}
    .rtab{padding:6px 14px;border-radius:8px;font-size:24px;font-weight:600;font-family:'Outfit',sans-serif;background:rgba(255,255,255,0.05);border:1px solid var(--glass-border);color:var(--text2);cursor:pointer;transition:all .15s;backdrop-filter:blur(8px);}
    .rtab.active{background:rgba(0,229,200,0.12);border-color:rgba(0,229,200,0.35);color:var(--teal);box-shadow:0 0 14px rgba(0,229,200,0.2),inset 0 1px 0 rgba(0,229,200,0.2);}
    .rtab:active{transform:scale(0.95);}

    .rank-controls{display:flex;align-items:center;gap:8px;margin-bottom:14px;flex-wrap:wrap;}
    .topn-row{display:flex;align-items:center;gap:8px;}
    .topn-row label{font-size:11px;font-weight:600;color:var(--text2);white-space:nowrap;}
    .topn-btns{display:flex;gap:4px;flex-wrap:wrap;}
    .topn-btn{padding:5px 12px;font-size:12px;font-weight:600;font-family:'Outfit',sans-serif;background:rgba(255,255,255,0.05);border:1px solid var(--glass-border);border-radius:8px;color:var(--text2);cursor:pointer;transition:all .15s;backdrop-filter:blur(8px);}
    .topn-btn.active{background:rgba(0,229,200,0.12);border-color:rgba(0,229,200,0.35);color:var(--teal);box-shadow:0 0 10px rgba(0,229,200,0.2);}
    .topn-btn:active{transform:scale(0.93);}
    .topn-row select,.inline-sel{padding:6px 28px 6px 10px;background:var(--card2);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:12px;font-family:'Outfit',sans-serif;appearance:none;-webkit-appearance:none;background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2710%27%20height%3D%276%27%3E%3Cpath%20d%3D%27M0%200l5%206%205-6z%27%20fill%3D%27%236b7494%27/%3E%3C/svg%3E);background-repeat:no-repeat;background-position:right 8px center;}

    .detail-ctrl{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;align-items:center;}
    .detail-ctrl select{padding:6px 28px 6px 10px;background:var(--card2);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:12px;font-family:'Outfit',sans-serif;appearance:none;-webkit-appearance:none;background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2710%27%20height%3D%276%27%3E%3Cpath%20d%3D%27M0%200l5%206%205-6z%27%20fill%3D%27%236b7494%27/%3E%3C/svg%3E);background-repeat:no-repeat;background-position:right 8px center;min-width:120px;}
    .detail-ctrl select:focus{outline:none;border-color:var(--teal);}
    .sort-btn{padding:5px 12px;background:var(--card2);border:1px solid var(--border);border-radius:8px;color:var(--text2);font-size:11px;font-weight:600;font-family:'Outfit',sans-serif;cursor:pointer;transition:all .15px;white-space:nowrap;}
    .sort-btn.active{background:var(--teal-dim);border-color:rgba(0,229,200,0.3);color:var(--teal);}
    .sort-btn:active{transform:scale(0.95);}

    .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
    table{border-collapse:collapse;width:100%;}
    th{padding:8px 10px;text-align:left;font-size:11px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:0.06em;border-bottom:1px solid var(--glass-border);white-space:nowrap;background:rgba(255,255,255,0.03);cursor:pointer;user-select:none;}
    th:hover{color:var(--teal);}
    th.sort-asc::after{content:' ▲';}
    th.sort-desc::after{content:' ▼';}
    td{padding:9px 10px;font-size:13px;border-bottom:1px solid rgba(255,255,255,0.05);white-space:nowrap;color:#d8dff0;}
    tr:last-child td{border-bottom:none;}
    tbody tr:active td{background:rgba(255,255,255,0.04);}

    .dorm-row{cursor:pointer;transition:background .15s;position:relative;}
    .dorm-row:hover td{background:rgba(0,229,200,0.04);}
    .dorm-row:active td{background:rgba(0,229,200,0.08);}
    .dorm-row .dorm-hint{display:none;position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:10px;color:var(--text3);background:var(--card2);border:1px solid var(--border);border-radius:6px;padding:2px 8px;pointer-events:none;white-space:nowrap;z-index:10;}
    .dorm-row:hover .dorm-hint{display:block;}

    .pager{display:flex;align-items:center;gap:8px;margin-bottom:12px;}
    .pgr{padding:6px 14px;background:var(--card2);border:1px solid var(--border);border-radius:8px;color:var(--text2);font-size:11px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;transition:all .15s;}
    .pgr:hover{border-color:rgba(0,229,200,0.3);color:var(--teal);}
    .pgr-info{font-size:11px;color:var(--text3);}

    .btn-show{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border:1px solid var(--border);border-radius:10px;font-size:12px;font-weight:600;font-family:'Outfit',sans-serif;background:var(--card2);color:var(--text2);cursor:pointer;transition:all .2s;white-space:nowrap;flex-shrink:0;}
    .btn-show:hover{border-color:rgba(0,229,200,0.35);color:var(--teal);}

    #emptyState{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 24px;gap:14px;text-align:center;}
    .empty-glow{width:120px;height:120px;border-radius:30px;background:var(--teal-dim);border:1px solid rgba(0,229,200,0.2);display:flex;align-items:center;justify-content:center;font-size:48px;box-shadow:0 0 40px var(--teal-glow);}
    #emptyState h3{font-size:28px;font-weight:700;}
    #emptyState p{font-size:16px;color:var(--text2);line-height:1.7;}

    /* ─── BOTTOM NAV（ガラス調） ─── */
    .bnav{position:fixed;bottom:0;left:0;right:0;
      background:linear-gradient(180deg,rgba(10,13,20,0.75) 0%,rgba(8,10,16,0.95) 100%);
      backdrop-filter:blur(32px) saturate(180%);-webkit-backdrop-filter:blur(32px) saturate(180%);
      border-top:1px solid rgba(255,255,255,0.12);
      box-shadow:0 -1px 0 rgba(255,255,255,0.06), 0 -8px 40px rgba(0,0,0,0.5);
      height:calc(28vw + var(--safe-b));max-height:calc(160px + var(--safe-b));padding-bottom:var(--safe-b);
      display:flex;align-items:stretch;z-index:200;}
    .nb{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1vw;min-width:0;background:none;border:none;cursor:pointer;color:rgba(255,255,255,0.35);font-family:'Outfit',sans-serif;font-size:2.4vw;font-weight:600;letter-spacing:0.02em;transition:color .2s;padding:8px 2px;}
    .nb.act{color:var(--teal);}
    .nb:active{opacity:0.6;}
    .nb-icon{
      width:18vw;height:18vw;max-width:84px;max-height:84px;
      border-radius:3.75vw;
      display:flex;align-items:center;justify-content:center;
      transition:all .25s cubic-bezier(.34,1.56,.64,1);
      position:relative;
      background:rgba(255,255,255,0.05);
      border:1px solid rgba(255,255,255,0.08);
    }
    @media not all and (hover:hover) and (pointer:fine){
      .nb-icon{width:27vw;height:27vw;max-width:126px;max-height:126px;border-radius:5.625vw;}
    }
    .nb.act .nb-icon{
      background:rgba(0,229,200,0.12);
      border:1px solid rgba(0,229,200,0.35);
      box-shadow:0 0 16px rgba(0,229,200,0.18), inset 0 1px 0 rgba(0,229,200,0.2);
    }
    .nb-icon svg{width:9.75vw;height:9.75vw;max-width:48px;max-height:48px;stroke:currentColor;stroke-width:1.8;transition:all .2s;}
    @media not all and (hover:hover) and (pointer:fine){
      .nb-icon svg{width:14.625vw;height:14.625vw;max-width:72px;max-height:72px;}
    }
    .nb:not(.act) .nb-icon svg{stroke:rgba(255,255,255,0.40);}
    .nb.act .nb-icon svg{stroke:var(--teal);filter:drop-shadow(0 0 5px rgba(0,229,200,0.5));}
    .nb-label{font-size:2.4vw;max-font-size:12px;line-height:1;color:inherit;white-space:nowrap;}
    @media not all and (hover:hover) and (pointer:fine){
      .nb-label{font-size:3vw;}
    }

    .period-tabs{display:flex;gap:6px;margin-bottom:14px;}
    .ptab{flex:1;padding:11px 4px;border-radius:8px;font-size:22px;font-weight:700;font-family:'Outfit',sans-serif;background:var(--card2);border:1px solid var(--border);color:var(--text2);cursor:pointer;text-align:center;}
    .ptab.active{background:var(--teal-dim);border-color:rgba(0,229,200,0.35);color:var(--teal);box-shadow:0 0 8px var(--teal-glow);}
    .ptab:active{transform:scale(0.94);}
    .ptab.active:disabled,.ptab.active[disabled]{background:var(--teal-dim);border-color:rgba(0,229,200,0.35);color:var(--teal);box-shadow:0 0 8px var(--teal-glow);opacity:1 !important;}
    .ptab.touching{background:var(--teal-dim);border-color:rgba(0,229,200,0.35);color:var(--teal);transform:scale(0.94);}

    .spinner{width:12px;height:12px;flex-shrink:0;border:2px solid var(--teal-dim);border-top-color:var(--teal);border-radius:50%;animation:spin .6s linear infinite;display:inline-block;}
    @keyframes spin{to{transform:rotate(360deg);}}
    @keyframes fadeUp{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}

    /* ─── 除外ポップアップ（共通） ─── */
    .excl-popup-overlay{position:fixed;inset:0;z-index:600;background:rgba(0,0,0,0.55);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:20px;animation:fadeIn .15s ease;}
    .excl-popup-overlay.hidden{display:none;}
    @keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
    .excl-popup{background:var(--card);border:1px solid rgba(0,229,200,0.25);border-radius:var(--r-lg);width:100%;max-width:480px;max-height:75vh;display:flex;flex-direction:column;box-shadow:0 24px 80px rgba(0,0,0,0.7),0 0 40px rgba(0,229,200,0.08);animation:popIn .2s cubic-bezier(.34,1.56,.64,1);}
    @keyframes popIn{from{opacity:0;transform:scale(0.92);}to{opacity:1;transform:scale(1);}}
    .excl-popup-head{padding:16px 18px 12px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;flex-shrink:0;}
    .excl-popup-title{flex:1;font-size:13px;font-weight:700;color:var(--teal);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .excl-popup-close{width:28px;height:28px;border-radius:8px;border:1px solid var(--border);background:var(--card2);color:var(--text3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;transition:all .15s;}
    .excl-popup-close:hover{border-color:rgba(255,90,126,0.4);color:var(--red);}
    .excl-popup-body{padding:12px 18px 16px;overflow-y:auto;flex:1;}
    .excl-all-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:10px 14px;border-radius:10px;font-size:13px;font-weight:700;font-family:'Outfit',sans-serif;cursor:pointer;transition:all .2s;border:1px solid rgba(255,90,126,0.35);background:rgba(255,90,126,0.12);color:var(--red);margin-bottom:12px;}
    .excl-all-btn.all-on{background:rgba(255,90,126,0.25);border-color:var(--red);}
    .excl-all-btn:active{transform:scale(0.97);}
    .excl-customer-list{display:flex;flex-direction:column;gap:6px;}
    .excl-customer-row{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:10px;background:var(--card2);border:1px solid var(--border);}
    .excl-customer-name{flex:1;font-size:12px;color:var(--text2);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .excl-customer-amt{font-size:11px;color:var(--text3);white-space:nowrap;flex-shrink:0;}
    .excl-toggle{position:relative;width:42px;height:24px;flex-shrink:0;cursor:pointer;}
    .excl-toggle input{opacity:0;width:0;height:0;}
    .excl-slider{position:absolute;inset:0;border-radius:24px;background:var(--bg);border:1px solid var(--border);transition:all .25s;}
    .excl-slider::before{content:'';position:absolute;width:18px;height:18px;border-radius:50%;background:var(--text3);top:2px;left:2px;transition:all .25s;}
    .excl-toggle input:checked + .excl-slider{background:rgba(255,90,126,0.25);border-color:var(--red);}
    .excl-toggle input:checked + .excl-slider::before{background:var(--red);transform:translateX(18px);box-shadow:0 0 8px rgba(255,90,126,0.5);}

    /* ─── 管理モーダル ─── */
    .modal-overlay{position:fixed;inset:0;z-index:500;background:rgba(0,0,0,0.7);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:20px;}
    .modal-overlay.hidden{display:none;}
    .modal-box{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);width:100%;max-width:560px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 24px 80px rgba(0,0,0,0.6);}
    .modal-head{padding:18px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
    .modal-head-title{font-size:15px;font-weight:700;}
    .modal-close{width:30px;height:30px;border-radius:8px;border:1px solid var(--border);background:var(--card2);color:var(--text2);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;transition:all .15s;}
    .modal-close:hover{border-color:rgba(255,90,126,0.4);color:var(--red);}
    /* 卸グループ管理モーダル */
    .wg-group{background:rgba(255,255,255,0.03);border:1px solid rgba(80,140,255,0.15);border-radius:12px;padding:12px 14px;margin-bottom:10px;}
    .wg-group-head{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
    .wg-group-name{flex:1;background:rgba(255,255,255,0.07);border:1px solid rgba(80,140,255,0.2);border-radius:8px;padding:5px 10px;color:var(--text);font-size:13px;font-family:'Outfit',sans-serif;}
    .wg-group-name:focus{outline:none;border-color:var(--teal);}
    .wg-del-btn{width:28px;height:28px;border-radius:7px;background:rgba(255,90,126,0.1);border:1px solid rgba(255,90,126,0.2);color:var(--red);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;}
    .wg-del-btn:hover{background:rgba(255,90,126,0.2);}
    .wg-codes{display:flex;flex-wrap:wrap;gap:6px;min-height:28px;}
    .wg-code-tag{display:flex;align-items:center;gap:4px;background:rgba(0,229,200,0.1);border:1px solid rgba(0,229,200,0.25);border-radius:20px;padding:2px 10px 2px 8px;font-size:11px;color:var(--teal);}
    .wg-code-tag button{background:none;border:none;color:rgba(0,229,200,0.5);cursor:pointer;font-size:13px;line-height:1;padding:0;}
    .wg-code-tag button:hover{color:var(--red);}
    .wg-add-input{background:rgba(255,255,255,0.05);border:1px solid rgba(80,140,255,0.2);border-radius:8px;padding:4px 9px;color:var(--text);font-size:11px;font-family:'Outfit',sans-serif;width:110px;}
    .wg-add-input:focus{outline:none;border-color:var(--teal);}
    .wg-add-btn{padding:4px 10px;border-radius:7px;background:rgba(0,229,200,0.1);border:1px solid rgba(0,229,200,0.25);color:var(--teal);font-size:11px;cursor:pointer;}
    .wg-add-btn:hover{background:rgba(0,229,200,0.2);}
    .wg-auto-section{margin-bottom:16px;padding:12px 14px;background:rgba(255,184,48,0.05);border:1px solid rgba(255,184,48,0.2);border-radius:12px;}
    .wg-auto-title{font-size:12px;font-weight:600;color:rgba(255,184,48,0.9);margin-bottom:6px;}
    .wg-auto-desc{font-size:11px;color:var(--text3);margin-bottom:10px;line-height:1.5;}
    .wg-auto-row{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
    .wg-auto-label{font-size:11px;color:var(--text2);flex:1;}
    .wg-candidate-tag{background:rgba(255,184,48,0.12);border:1px solid rgba(255,184,48,0.25);border-radius:6px;padding:2px 8px;font-size:10px;color:rgba(255,184,48,0.9);}
    .wg-footer{display:flex;gap:8px;margin-top:16px;}
    /* 商品グループ: pgのプレフィックスで卸と区別 */
    .pg-group{background:rgba(255,255,255,0.03);border:1px solid rgba(176,111,255,0.15);border-radius:12px;padding:12px 14px;margin-bottom:10px;}
    .pg-group-head{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
    .pg-group-name{flex:1;background:rgba(255,255,255,0.07);border:1px solid rgba(176,111,255,0.2);border-radius:8px;padding:5px 10px;color:var(--text);font-size:13px;font-family:'Outfit',sans-serif;}
    .pg-group-name:focus{outline:none;border-color:var(--violet);}
    .pg-code-tag{display:flex;align-items:center;gap:4px;background:rgba(176,111,255,0.1);border:1px solid rgba(176,111,255,0.25);border-radius:20px;padding:2px 10px 2px 8px;font-size:11px;color:var(--violet);}
    .pg-code-tag button{background:none;border:none;color:rgba(176,111,255,0.5);cursor:pointer;font-size:13px;line-height:1;padding:0;}
    .pg-code-tag button:hover{color:var(--red);}
    .pg-save-btn{flex:1;padding:9px;border-radius:10px;background:rgba(176,111,255,0.14);border:1px solid rgba(176,111,255,0.35);color:var(--violet);font-size:13px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;}
    .pg-save-btn:hover{background:rgba(176,111,255,0.22);}
    .pg-add-group-btn{padding:9px 16px;border-radius:10px;background:rgba(176,111,255,0.1);border:1px solid rgba(176,111,255,0.25);color:var(--violet);font-size:13px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;}
    .pg-add-group-btn:hover{background:rgba(176,111,255,0.18);}
    .wg-save-btn{flex:1;padding:9px;border-radius:10px;background:rgba(0,229,200,0.14);border:1px solid rgba(0,229,200,0.35);color:var(--teal);font-size:13px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;}
    .wg-save-btn:hover{background:rgba(0,229,200,0.22);}
    .wg-add-group-btn{padding:9px 16px;border-radius:10px;background:rgba(80,140,255,0.1);border:1px solid rgba(80,140,255,0.25);color:#80aaff;font-size:13px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;}
    .wg-add-group-btn:hover{background:rgba(80,140,255,0.18);}
    .modal-body{padding:16px 20px;overflow-y:auto;flex:1;}
    .modal-empty{text-align:center;padding:40px 0;color:var(--text3);font-size:13px;}
    .excl-group{border:1px solid var(--border);border-radius:var(--r);margin-bottom:8px;overflow:hidden;}
    .excl-group-head{display:flex;align-items:center;gap:10px;padding:11px 14px;background:var(--card2);cursor:pointer;user-select:none;transition:background .15s;}
    .excl-group-head:hover{background:rgba(255,255,255,0.04);}
    .excl-group-arrow{font-size:11px;color:var(--text3);transition:transform .2s;flex-shrink:0;}
    .excl-group-arrow.open{transform:rotate(90deg);}
    .excl-group-pname{flex:1;font-size:13px;font-weight:600;color:var(--text);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .excl-group-badge{font-size:10px;font-weight:700;padding:2px 8px;border-radius:6px;background:rgba(255,90,126,0.15);color:var(--red);border:1px solid rgba(255,90,126,0.2);white-space:nowrap;flex-shrink:0;}
    .excl-group-del{padding:4px 10px;border-radius:7px;font-size:11px;font-weight:600;font-family:'Outfit',sans-serif;cursor:pointer;background:rgba(255,90,126,0.12);color:var(--red);border:1px solid rgba(255,90,126,0.25);transition:all .15s;white-space:nowrap;flex-shrink:0;}
    .excl-group-del:hover{background:rgba(255,90,126,0.25);}
    .excl-group-body{display:none;padding:8px 14px;border-top:1px solid var(--border);}
    .excl-group-body.open{display:block;}
    .excl-cust-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--border);font-size:12px;}
    .excl-cust-row:last-child{border-bottom:none;}
    .excl-cust-name{flex:1;color:var(--text2);}
    .excl-cust-del{padding:3px 9px;border-radius:6px;font-size:11px;font-weight:600;font-family:'Outfit',sans-serif;cursor:pointer;background:var(--card);color:var(--text3);border:1px solid var(--border);transition:all .15s;}
    .excl-cust-del:hover{border-color:rgba(255,90,126,0.4);color:var(--red);}
    .excl-manage-btn{display:flex;align-items:center;gap:5px;padding:5px 12px;border-radius:8px;font-size:11px;font-weight:600;font-family:'Outfit',sans-serif;cursor:pointer;white-space:nowrap;background:rgba(255,90,126,0.10);color:var(--red);border:1px solid rgba(255,90,126,0.2);transition:all .15s;}
    .excl-manage-btn:hover{background:rgba(255,90,126,0.20);}

    /* ─── PC ─── */
    @media (hover:hover) and (pointer:fine){
      body{display:grid;grid-template-rows:60px auto 1fr;min-height:100vh;}
      header{grid-row:1;}
      #periodBar{grid-row:2;grid-column:1/-1;top:60px;}
      .app{grid-row:3;display:grid;grid-template-columns:240px 1fr;}
      .drawer{max-height:none !important;border-bottom:none;border-right:1px solid var(--border);overflow-y:auto;grid-column:1;position:sticky;top:60px;height:calc(100vh - 60px);}
      .content{grid-column:2;padding-bottom:24px;}
      .bnav{display:none;}
      .filter-btn{display:none !important;}
      .drawer-inner{padding:24px 20px;}
      .pc-hide{display:none !important;}
    }

    /* ─── スマホ ─── */
    @media not all and (hover:hover) and (pointer:fine){
      .filter-btn{display:flex !important;}
      /* リンク・フィルターボタンを2倍サイズに */
      /* ボタンをheader(56px)に収まるよう調整 */
      .share-btn,.filter-btn{width:44px !important;height:44px !important;min-width:44px !important;min-height:44px !important;max-width:44px !important;max-height:44px !important;border-radius:10px !important;flex-shrink:0 !important;}
      .share-btn svg,.filter-btn svg{width:20px !important;height:20px !important;max-width:20px !important;max-height:20px !important;}
      header{height:56px;padding:0 14px;overflow:hidden;}
      #periodBar{display:none !important;}
      .content{padding-top:10px;}
      .logo{font-size:17px;}
      .logo-orb{width:12vw;height:12vw;max-width:56px;max-height:56px;border-radius:2.5vw;font-size:6.5vw;}
      .content{padding:10px 10px calc(96px + var(--safe-b));}
      .ptab{padding:11px 4px;font-size:22px;}
      .rtab{padding:8px 14px;font-size:26px;}
      .card-minimize{width:44px;height:44px;border-radius:12px;}
      .detail-ctrl select{font-size:14px;}
      /* フッターアイコンはvwベースのため上書き不要 */
      .content{padding:10px 10px calc(19vw + var(--safe-b));}
    }

    /* ─── フッター2段（スマホ専用） ─── */
    .bnav-period{ display:none; }
    @media not all and (hover:hover) and (pointer:fine){
      .bnav{ flex-direction:column; height:auto; max-height:none; padding-bottom:var(--safe-b); }
      .bnav-period{
        display:grid;
        grid-template-columns: repeat(6, 1fr);
        width:100%; gap:6px; padding:10px 12px 8px;
        border-bottom:1px solid rgba(255,255,255,0.07);
      }
      .bnav-period .ptab{
        padding:9px 2px; font-size:3.2vw; font-weight:700; border-radius:10px;
        font-family:'Outfit',sans-serif;
        background:rgba(255,255,255,0.05);
        border:1px solid rgba(255,255,255,0.08);
        color:rgba(255,255,255,0.45); cursor:pointer; text-align:center;
        transition:all .2s; letter-spacing:0.01em;
      }
      .bnav-period .ptab.active{
        background:rgba(0,229,200,0.12); border-color:rgba(0,229,200,0.35); color:var(--teal);
        box-shadow:0 0 12px rgba(0,229,200,0.15), inset 0 1px 0 rgba(0,229,200,0.2);
      }
      .bnav-period .ptab.touching{
        background:rgba(0,229,200,0.12); border-color:rgba(0,229,200,0.35); color:var(--teal); transform:scale(0.94);
      }
      .bnav-icons{ display:flex; width:100%; align-items:stretch; height:calc(27vw); max-height:150px; }
      .content{ padding:10px 10px calc(27vw + 92px + var(--safe-b)) !important; }
    }

    /* ─── ローディングオーバーレイ ─── */
    /* ═══════════════ オープニングアニメーション ═══════════════ */
    #loadingOverlay{position:fixed;inset:0;z-index:9999;background:#000;display:flex;align-items:center;justify-content:center;transition:opacity 1.2s ease,visibility 1.2s ease;overflow:hidden;}
    #loadingOverlay.hidden{opacity:0;visibility:hidden;pointer-events:none;}
    /* cinematic vignette */
    #loadingOverlay::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 70% at 50% 50%,transparent 30%,rgba(0,0,0,0.85) 100%);pointer-events:none;z-index:0;}
    /* パーティクル用canvas */
    #loCanvas{position:absolute;inset:0;pointer-events:none;z-index:0;}
    /* ステージ */
    #loStage{display:flex;flex-direction:column;align-items:center;gap:24px;position:relative;z-index:2;}
    /* ロゴ画像 ── 透過PNGを最大限に活かす */
    #loLogo{
      width:min(320px,72vw);
      opacity:0;
      transform:scale(0.82) translateY(12px);
      transition:opacity 1.4s cubic-bezier(0.16,1,0.3,1), transform 1.6s cubic-bezier(0.16,1,0.3,1);
      filter:
        drop-shadow(0 0 18px rgba(255,190,50,0.55))
        drop-shadow(0 0 50px rgba(255,110,0,0.30))
        drop-shadow(0 2px 8px rgba(0,0,0,0.7));
    }
    #loLogo.lo-show{opacity:1;transform:scale(1) translateY(0);}
    /* 水平ライン */
    #loLine{
      width:0;height:1px;
      background:linear-gradient(90deg,transparent,rgba(255,190,60,0.8),rgba(255,230,120,0.9),rgba(255,190,60,0.8),transparent);
      box-shadow:0 0 8px rgba(255,180,50,0.6);
      transition:width 1.3s cubic-bezier(0.16,1,0.3,1) 0.1s;
      margin:0;
    }
    #loLine.lo-show{width:min(380px,80vw);}
    /* ブランド名 */
    .lo-brand{
      font-family:'Cormorant Garamond',serif;
      font-size:clamp(40px,10vw,64px);
      font-weight:300;
      letter-spacing:0.16em;
      background:linear-gradient(135deg,#fff8e8 0%,#ffd080 45%,#ff9a3c 100%);
      -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
      opacity:0;transform:translateY(20px) scale(0.97);
      transition:opacity 1.1s cubic-bezier(0.16,1,0.3,1) 0.3s,transform 1.2s cubic-bezier(0.16,1,0.3,1) 0.3s;
      text-shadow:none;
      filter:drop-shadow(0 0 24px rgba(255,180,60,0.4));
    }
    .lo-brand.lo-show{opacity:1;transform:translateY(0) scale(1);}
    /* タグライン */
    .lo-tagline{
      font-family:'Noto Sans JP',sans-serif;
      font-size:clamp(10px,2.5vw,13px);
      font-weight:200;
      letter-spacing:0.30em;
      color:rgba(255,215,130,0.65);
      opacity:0;transform:translateY(10px);
      transition:opacity 1s ease 0.8s,transform 1s ease 0.8s;
    }
    .lo-tagline.lo-show{opacity:1;transform:translateY(0);}
    /* プログレスバー（下部） */
    #loProgress{
      position:absolute;bottom:0;left:0;height:2px;width:0%;
      background:linear-gradient(90deg,rgba(255,140,0,0.4),rgba(255,210,80,0.9),rgba(255,140,0,0.4));
      box-shadow:0 0 10px rgba(255,180,50,0.5);
      transition:none;
    }
    /* テキスト（下部） */
    .lo-text{
      position:absolute;bottom:22px;left:50%;transform:translateX(-50%);
      font-family:'Noto Sans JP',sans-serif;font-size:10px;
      color:rgba(255,180,60,0.28);letter-spacing:0.14em;white-space:nowrap;
    }
    /* 旧クラスとの互換（_hideLoadingで参照） */
    .lo-inner{display:none;}
    .lo-bar-wrap{display:none;}
    .lo-bar{display:none;}

    #trendSubAmounts{font-size:36px;font-weight:800;line-height:1.3;margin-top:4px;text-align:right;}
    #trendSubAmounts span{font-size:36px;font-weight:800;display:block;text-align:right;font-variant-numeric:tabular-nums;}

    /* ─── 単位切替 ─── */
    .unit-toggle{display:inline-flex;background:var(--card2);border:1px solid var(--border);border-radius:10px;overflow:hidden;}
    .unit-toggle button{padding:4px 11px;font-size:18px;font-weight:700;font-family:'Outfit',sans-serif;border:none;background:transparent;color:var(--text3);cursor:pointer;transition:all .2s;}
    .unit-toggle button.active{background:linear-gradient(135deg,var(--teal),#00aaff);color:#0e1118;border-radius:8px;margin:2px;padding:2px 9px;}

    /* ─── ヒートマップ ─── */
    .heatmap-wrap{overflow-x:auto;padding-bottom:4px;width:100%;}
    .hm-table{border-collapse:collapse;table-layout:fixed;width:100%;}
    .hm-table th{padding:2px 2px;color:#ffffff;font-weight:700;text-align:center;font-size:14px;}
    .hm-table td{height:28px;text-align:center;font-size:11px;font-weight:700;border-radius:3px;cursor:default;color:rgba(255,255,255,0.95);overflow:hidden;}
    .hm-table td.hm-empty{background:rgba(255,255,255,0.03);}
    .hm-legend{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:14px;font-weight:600;color:#ffffff;}

    /* ─── ヒートマップ 部門フィルター ─── */
    .hm-dept-filter{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px;align-items:center;}
    .hm-dept-btn{padding:5px 12px;border-radius:8px;font-size:11px;font-weight:600;font-family:'Outfit',sans-serif;background:var(--card2);border:1px solid var(--border);color:var(--text2);cursor:pointer;transition:all .15s;white-space:nowrap;}
    .hm-dept-btn.active{background:var(--teal-dim);border-color:rgba(0,229,200,0.35);color:var(--teal);}
    .hm-dept-btn:active{transform:scale(0.95);}
    .hm-dept-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--text3);flex-shrink:0;}
    .hm-filter-wrap{display:flex;gap:10px;margin-bottom:12px;align-items:center;flex-wrap:wrap;}
    .hm-filter-group{display:flex;align-items:center;gap:6px;}
    .hm-filter-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text3);}
    .hm-sel{padding:6px 28px 6px 10px;background:var(--card2);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:12px;font-family:'Outfit',sans-serif;appearance:none;-webkit-appearance:none;background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2710%27%20height%3D%276%27%3E%3Cpath%20d%3D%27M0%200l5%206%205-6z%27%20fill%3D%27%236b7494%27/%3E%3C/svg%3E);background-repeat:no-repeat;background-position:right 8px center;cursor:pointer;min-width:110px;}
    .hm-sel option,.topn-row select option,.detail-ctrl select option,.inline-sel option{background:#0e1824;color:var(--text);}
    .hm-sel option:checked,.topn-row select option:checked,.detail-ctrl select option:checked,.inline-sel option:checked{background:rgba(0,229,200,0.18);color:var(--teal);}

    /* ─── 休眠得意先 ─── */
    .dth-btn{padding:5px 16px;border-radius:8px;font-size:22px;font-weight:700;font-family:'Outfit',sans-serif;background:var(--card2);border:1px solid var(--border);color:var(--text2);cursor:pointer;transition:all .15s;}
    .dth-btn.active{background:rgba(255,184,48,0.15);border-color:rgba(255,184,48,0.4);color:rgba(255,184,48,1);}

    /* ─── ドリルダウン ─── */
    #cardDrilldown{border-top:2px solid rgba(0,229,200,0.3);}
    .drill-back{display:inline-flex;align-items:center;gap:5px;padding:4px 12px;border-radius:8px;font-size:13px;font-weight:600;font-family:'Outfit',sans-serif;cursor:pointer;background:var(--teal-dim);color:var(--teal);border:1px solid rgba(0,229,200,0.3);transition:all .15s;}

    /* ─── 分類別割合 ─── */
    .pie-section{margin-top:16px;padding-top:14px;border-top:1px solid var(--border);}
    .pie-section-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--text3);margin-bottom:10px;}
    .pie-section-inner{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}

    /* ─── 2段推移チャート ─── */
    .trend-section-label{
      font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;
      color:var(--text3);margin-bottom:6px;display:flex;align-items:center;gap:8px;
    }
    .trend-section-label::after{content:'';flex:1;height:1px;background:var(--border);}
    .trend-divider{height:1px;background:var(--border);margin:14px 0;}
    .category-ratio-wrap{margin-top:0;}
    .cat-legend-inline{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;font-size:11px;font-weight:600;}

    /* ─── カテゴリデュアルレイアウト（旧） ─── */
    #catDualWrap { display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
    #catDualWrap > div:first-child { display:flex; flex-direction:column; min-height:0; }
    #categoryRatioWrap { flex:1; min-height:0; }
    #categoryRatioWrap canvas { width:100% !important; height:100% !important; display:block; }

    @media (max-width:700px) {
      #catDualWrap { grid-template-columns:1fr; align-items:start; }
      #catDualWrap > div:first-child { display:flex; flex-direction:column; }
      #categoryRatioWrap { margin-bottom:0; }
      #categoryRatioWrap canvas { width:100% !important; height:340px !important; display:block; }
      /* 凡例は非表示にして余白を除去 */
      #categoryRatioLegend { display:none !important; }
    }
    /* スマホ（タッチ端末）のみ長押しヒントを表示 */
    @media (hover:none) and (pointer:coarse) {
      #rankLongPressHint { display:block !important; }
    }

    /* ─── KPI カード（金融UI） ─── */
    .kpi-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;}
    @media(max-width:900px){.kpi-strip{grid-template-columns:repeat(3,1fr);}}
    @media(max-width:600px){.kpi-strip{grid-template-columns:repeat(2,1fr);}}
    .kpi-slide{flex:0 0 100%;width:100%;}
    #kpiCarouselTrack{width:100%;}
    .kpi-card{
      background:linear-gradient(160deg, rgba(10,20,48,0.92) 0%, rgba(6,14,36,0.96) 100%);
      border:1px solid rgba(80,140,255,0.18);
      border-radius:18px;
      padding:15.4px 13.2px 13.2px; /* 14*1.1, 12*1.1 */
      backdrop-filter:blur(20px);
      -webkit-backdrop-filter:blur(20px);
      position:relative;
      overflow:hidden;
      box-shadow:0 2px 24px rgba(0,0,0,0.55), inset 0 1px 0 rgba(80,140,255,0.12);
      transition:transform .2s, box-shadow .2s;
    }
    .kpi-card::before{
      content:'';position:absolute;top:0;left:0;right:0;height:1px;
      background:linear-gradient(90deg,transparent,rgba(80,140,255,0.30),transparent);
    }
    /* 売上カード — ゴールドアクセント */
    /* ── 売上系 Card 1〜4: ゴールド系 ── */
    /* Card1 売上 — ゴールド（最も明るい・主役） */
    .kpi-card:nth-child(1){
      border-color:rgba(212,175,55,0.32);
      box-shadow:0 2px 24px rgba(0,0,0,0.55), inset 0 1px 0 rgba(212,175,55,0.20), 0 0 32px rgba(212,175,55,0.07);
    }
    .kpi-card:nth-child(1)::before{background:linear-gradient(90deg,transparent,rgba(212,175,55,0.38),transparent);}
    .kpi-card:nth-child(1) .kpi-value-num{
      background:linear-gradient(135deg,#f0c040,#ffd966,#e8a800);
      -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    }
    .kpi-card:nth-child(1) .kpi-value-unit{color:#e8a800;}
    /* Card2 粗利 — ホワイト系 */
    .kpi-card:nth-child(2){
      border-color:rgba(212,175,55,0.20);
      box-shadow:0 2px 24px rgba(0,0,0,0.55), inset 0 1px 0 rgba(212,175,55,0.12), 0 0 24px rgba(212,175,55,0.04);
    }
    .kpi-card:nth-child(2)::before{background:linear-gradient(90deg,transparent,rgba(212,175,55,0.22),transparent);}
    .kpi-card:nth-child(2) .kpi-value-num{
      background:linear-gradient(135deg,#e8eef8,#ffffff);
      -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    }
    .kpi-card:nth-child(2) .kpi-value-unit{color:rgba(220,228,244,0.70);}
    /* Card3 粗利率 — ホワイト系 */
    .kpi-card:nth-child(3){
      border-color:rgba(212,175,55,0.15);
      box-shadow:0 2px 24px rgba(0,0,0,0.55), inset 0 1px 0 rgba(212,175,55,0.09), 0 0 20px rgba(212,175,55,0.03);
    }
    .kpi-card:nth-child(3)::before{background:linear-gradient(90deg,transparent,rgba(212,175,55,0.16),transparent);}
    .kpi-card:nth-child(3) .kpi-value-num{
      background:linear-gradient(135deg,#e8eef8,#ffffff);
      -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    }
    .kpi-card:nth-child(3) .kpi-value-unit{color:rgba(220,228,244,0.70);}
    /* Card4 着地見込み — ゴールド最暗（背景に沈む感じ） */
    .kpi-card:nth-child(4){
      border-color:rgba(212,175,55,0.28);
      box-shadow:0 2px 24px rgba(0,0,0,0.55), inset 0 1px 0 rgba(212,175,55,0.16), 0 0 28px rgba(212,175,55,0.05);
    }
    .kpi-card:nth-child(4)::before{background:linear-gradient(90deg,transparent,rgba(212,175,55,0.30),transparent);}
    .kpi-card:nth-child(4) .kpi-value-num{
      background:linear-gradient(135deg,#f0c040,#ffd966,#e8a800);
      -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    }
    .kpi-card:nth-child(4) .kpi-value-unit{color:#e8a800;}
    /* ── 新規系 Card 5: グリーン ── */
    /* Card5 新規案件 — エメラルドグリーン */
    .kpi-card:nth-child(5){
      border-color:rgba(0,220,140,0.25);
      box-shadow:0 2px 24px rgba(0,0,0,0.55), inset 0 1px 0 rgba(0,220,140,0.15), 0 0 30px rgba(0,220,140,0.05);
    }
    .kpi-card:nth-child(5)::before{background:linear-gradient(90deg,transparent,rgba(0,220,140,0.30),transparent);}
    .kpi-card:nth-child(5) .kpi-value-num{
      background:linear-gradient(135deg,#e8eef8,#ffffff);
      -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    }
    .kpi-card:nth-child(5) .kpi-value-unit{color:rgba(220,228,244,0.70);}
    .kpi-label{font-size:19px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:rgba(160,180,220,0.75);margin-bottom:8px;}
    /* 数値＋単位：縦積み・右揃え */
    .kpi-value{display:flex;flex-direction:column;align-items:flex-end;gap:0;}
    .kpi-value-num{font-size:clamp(39px,3.2vw,59px);font-weight:800;letter-spacing:-0.03em;line-height:1.1;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .kpi-value-unit{font-size:clamp(13px,1.1vw,17px);font-weight:600;letter-spacing:0.06em;opacity:0.65;line-height:1.4;margin-top:1px;}
    @media(max-width:900px){.kpi-value-num{font-size:clamp(35px,5.5vw,51px);}}
    @media(max-width:480px){.kpi-value-num{font-size:clamp(39px,10.5vw,52px);}}
    /* スマホ（タッチ端末）KPI：PCと同じサイズ・2列グリッド */
    @media (hover:none) and (pointer:coarse){
      .kpi-strip{grid-template-columns:repeat(3,1fr) !important;}
      .kpi-strip .kpi-card:last-child{grid-column:span 2 !important;}
      .kpi-value-num{font-size:clamp(78px,6.4vw,118px) !important;white-space:nowrap !important;}
      .kpi-value-unit{font-size:clamp(13px,1.1vw,17px) !important;}
      .kpi-label{font-size:19px !important;}
      .kpi-yoy{font-size:clamp(19px,1.8vw,27px) !important;}
      .kpi-yoy-arrow{font-size:clamp(12px,1.1vw,16px) !important;}
      .kpi-sub{font-size:clamp(10px,0.9vw,13px) !important;}
      .kpi-card{padding:15.4px 13.2px 13.2px !important;}
    }

    .kpi-yoy{display:flex;align-items:center;gap:5px;margin-top:8px;font-size:clamp(19px,1.8vw,27px);font-weight:700;}
    .kpi-yoy.up{color:#00e57a;}
    .kpi-yoy.down{color:#ff5a7e;}
    .kpi-yoy.neutral{color:rgba(120,140,180,0.6);}
    .kpi-yoy-arrow{font-size:clamp(12px,1.1vw,16px);}
    .kpi-sub{font-size:clamp(10px,0.9vw,13px);color:rgba(120,140,180,0.5);margin-top:3px;}
    .kpi-dot{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,0.2);transition:background .2s,width .2s;display:inline-block;}
    .kpi-dot.active{background:#4080ff;width:14px;border-radius:3px;}

    /* ─── 異常アラートカード ─── */
    .alert-card{background:linear-gradient(135deg,rgba(255,90,126,0.1),rgba(255,90,126,0.05));border:1px solid rgba(255,90,126,0.3);border-radius:16px;padding:16px;margin-bottom:12px;display:none;}
    .alert-card-head{display:flex;align-items:center;gap:8px;margin-bottom:4px;}
    .alert-card-head.collapsed{margin-bottom:0;}
    .alert-card-icon{width:28px;height:28px;border-radius:8px;background:rgba(255,90,126,0.2);display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;}
    .alert-card-title{font-size:22px;font-weight:700;color:var(--red);}
    .alert-card-count{font-size:10px;font-weight:700;padding:2px 8px;border-radius:6px;background:rgba(255,90,126,0.15);color:var(--red);border:1px solid rgba(255,90,126,0.25);margin-left:auto;}
    .alert-card-toggle{width:24px;height:24px;border-radius:6px;background:rgba(255,90,126,0.15);border:1px solid rgba(255,90,126,0.25);color:var(--red);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0;transition:transform .2s;}
    .alert-card-toggle.collapsed{transform:rotate(-90deg);}
    #alertItems{transition:none;overflow:hidden;}
    .alert-items{display:flex;flex-direction:column;gap:3px;}
    .alert-item{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.06);border-radius:8px;padding:4px 10px;}
    .alert-item-icon{font-size:16px;flex-shrink:0;}
    .alert-item-body{flex:1;min-width:0;}
    .alert-item-name{font-size:12px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .alert-item-detail{font-size:10px;color:var(--text3);margin-top:2px;}
    .alert-item-badge{font-size:20px;font-weight:800;white-space:nowrap;flex-shrink:0;}
    .alert-item-badge.up{color:var(--green);}
    .alert-item-badge.down{color:var(--red);}
    .alert-item-hoverable{position:relative;transition:background .15s;}
    .alert-item-hoverable:hover{background:rgba(255,255,255,0.07);}
    .alert-item-tooltip-box{
      display:none;position:fixed;z-index:9999;
      background:#1a1f2e;border:1px solid rgba(0,229,200,0.2);border-radius:8px;
      padding:16px;font-size:18px;font-weight:400;color:#e2e8f4;
      box-shadow:0 4px 20px rgba(0,0,0,0.6);pointer-events:none;
      max-width:420px;white-space:normal;line-height:1.5;
    }
    .alert-columns{display:flex;gap:12px;align-items:flex-start;}
    .alert-col{flex:1;min-width:0;}

    /* ─── 売上推移カードのタブ（今期/年別） ─── */
    .trend-ytabs{display:flex;gap:6px;margin-bottom:12px;}
    .trend-ytab{padding:5px 14px;border-radius:8px;font-size:11px;font-weight:600;font-family:'Outfit',sans-serif;background:var(--card2);border:1px solid var(--border);color:var(--text2);cursor:pointer;transition:all .15s;}
    .trend-ytab.active{background:var(--teal-dim);border-color:rgba(0,229,200,0.3);color:var(--teal);}

    /* ─── カテゴリ・商品別アラートのセクションタイトル ─── */
    .alert-topn-btn{padding:5px 12px;border-radius:8px;font-size:12px;font-weight:600;font-family:'Outfit',sans-serif;background:rgba(255,255,255,0.05);border:1px solid var(--glass-border);color:var(--text2);cursor:pointer;transition:all .15s;backdrop-filter:blur(8px);line-height:1.4;}
    .alert-topn-btn:hover{border-color:rgba(255,90,126,0.35);color:var(--red);}
    .alert-topn-btn.active{background:rgba(255,90,126,0.15);border-color:rgba(255,90,126,0.4);color:var(--red);font-weight:700;box-shadow:0 0 10px rgba(255,90,126,0.2);}
    .alert-section-title{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;color:var(--text3);margin-bottom:4px;margin-top:6px;display:flex;align-items:center;gap:8px;}
    .alert-section-title::after{content:'';flex:1;height:1px;background:rgba(255,90,126,0.2);}

    /* スライダーのつまみスタイル */
    #catSlider, #catSlider2 {
      -webkit-appearance:none; appearance:none; height:8px; border-radius:4px;
      background:linear-gradient(90deg,#4a9eff,#3dd6b5); outline:none;
      touch-action:pan-x;
      cursor:pointer; width:100%;
    }
    #catSlider::-webkit-slider-thumb, #catSlider2::-webkit-slider-thumb {
      -webkit-appearance:none; width:32px; height:32px;
      border-radius:50%; background:#ffffff; cursor:pointer;
      box-shadow:0 0 10px rgba(74,158,255,0.8);
    }
    #catSlider::-moz-range-thumb, #catSlider2::-moz-range-thumb {
      width:32px; height:32px; border-radius:50%;
      background:#ffffff; cursor:pointer; border:none;
      box-shadow:0 0 10px rgba(74,158,255,0.8);
    }
    /* スマホでは日付ラベルと目盛りを非表示 */
    @media (max-width:700px) {
      #catSliderLabel2, #catSliderTicks2 { display:none !important; }
    }