:root {
    
    --paper-0: #ffffff;   
    --paper-1: #fbf9f5;   
    --paper-2: #f5f2ea;   
    --paper-3: #ece7db;   

    
    --line:        #e4ded1;   
    --line-strong: #d3cbbb;   

    
    --ink-1: #211e1a;   
    --ink-2: #55504a;   
    --ink-3: #6d6558;   
    --ink-4: #a69d90;   

    
    --seal-1: #fcece9;   
    --seal-2: #f2c9c3;   
    --seal-5: #d4261f;   
    --seal-6: #b21d17;   
    --seal-7: #8c160f;   
    --seal-9: #5f0f0a;   

    
    --up:   #c72317;   
    --down: #0b7540;   
    --warn: #a15002;
    --info: #0f6a7a;

    


    --font-sans: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB",
                 "Source Han Sans SC", "Noto Sans CJK SC",
                 system-ui, -apple-system, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif;

    








    --font-display: "Songti SC", "STSong", "SimSun", "Source Han Serif SC",
                    "Noto Serif CJK SC", "Noto Serif SC",
                    Georgia, "Times New Roman", serif;

    
    --fs-2xs: 11px;  --fs-xs: 12px;  --fs-sm: 13px;  --fs-base: 14px;
    --fs-md: 15px;   --fs-lg: 16px;  --fs-xl: 18px;  --fs-2xl: 24px;
    --fs-3xl: 30px;  --fs-4xl: 40px; --fs-5xl: 48px; --fs-6xl: 64px;

    
    --lh-tight: 1.25; --lh-snug: 1.45; --lh-base: 1.6; --lh-read: 1.75;
    --fw-reg: 400; --fw-semi: 600; --fw-bold: 700;

    

    --sp-1: 4px;  --sp-2: 6px;  --sp-3: 8px;  --sp-4: 12px;
    --sp-5: 16px; --sp-6: 20px; --sp-7: 24px; --sp-8: 32px;
    --sp-9: 40px; --sp-10: 56px; --sp-11: 72px;

    
    --r-1: 4px; --r-2: 6px; --r-3: 10px; --r-4: 12px; --r-pill: 999px;

    
    --t-fast: .15s; --t-base: .2s; --ease: cubic-bezier(.4, 0, .2, 1);
}







:root {
    











    --seal-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 516 476' width='516' height='476'%3E%3Cpath fill='%23d6271f' fill-rule='evenodd' d='M438 474 C 434.4 473 419.4 468.1 404.5 463.2 362.9 449.3 339.3 442.9 302.5 435.7 285.4 432.3 230.3 432.4 215.1 435.8 209.4 437.1 203.7 437.9 202.4 437.6 201 437.2 198.4 437.9 195.4 439.5 189.1 442.8 185.4 442.7 169.1 438.5 158 435.6 153.8 435 146.9 435.2 141.2 435.3 136.8 434.8 133 433.6 125.9 431.4 114.8 431.9 102.3 435.1 93.7 437.3 92.8 437.3 85.3 436.1 49.5 429.8 40 429.8 27.8 436.1 20.6 439.7 18.8 439.7 12.2 435.9 1.7 429.9 -0.1 417.9 8 407.5 14.1 399.6 20 400.4 20 409 20 414.6 20.5 415 25.9 415.3 41.3 415.9 43.3 392.6 28 390.6 20.7 389.6 19 387.9 19 381.4 19 376.1 19.6 375 21.6 377 25.4 380.8 30.7 373.8 32.9 362.2 L 34.5 353.5 C 44 348.2 45.1 348 50.5 348.6 65 350.2 65.3 350 67.4 337 70.6 318.1 74.2 302.3 77.2 294.5 81.7 282.8 81.5 281 76 278.3 71.3 276 54.5 276.9 41 280.1 31.8 282.3 31.3 282.3 28.2 280 25.9 278.3 24.3 277.9 22.1 278.3 19.4 278.9 18.9 278.6 18.4 276.3 17.3 271.9 18.9 243.3 21 229.5 23.3 214 23.4 206.1 21.5 187.5 18.9 162.5 19.4 156.6 24.1 158.3 26.2 159.1 28.8 159.1 34.2 158.1 38.2 157.4 44.3 156.5 47.8 156 51.9 155.5 57.3 153.7 62.8 151 75.7 144.8 84.4 144.3 91.7 149.4 94.6 151.4 98.7 153.7 100.8 154.5 103.1 155.5 106.7 158.4 109.4 161.6 112 164.6 115.4 167.7 117.1 168.5 119.2 169.7 120 170.8 120 172.8 119.9 177.7 117.1 179.7 101.5 185.9 80.5 194.2 64 203 62.1 206.9 57.5 216.7 72.4 221.7 85.7 214.7 90.3 212.3 103.6 206.9 111.5 204.2 121.3 200.8 131.2 196.9 135.7 194.6 142.7 191.1 146.3 191.2 150.9 195.1 165.2 207.3 183.4 218.8 196.5 223.9 L 206.6 227.9 C 236.3 225.1 261.3 229.3 266.4 234.9 271.3 240.3 253.4 253.3 235.5 257.4 231.7 258.3 226.3 260.4 223.5 262.1 215.1 267.3 204.1 266 201.2 259.5 195.4 246.3 194.5 250.4 194.5 290.5 194.5 322.8 194.4 323.6 192.4 326.3 189.9 329.4 190.5 335.6 193.4 337.2 195.6 338.4 195.8 365 193.7 365 183.3 365 147.5 338 147.5 330.2 L 147.5 327.5 C 184.2 327.5 186.4 326.7 187.6 318.9 188.9 311.4 186.5 310.3 167.3 309.8 143.6 309.1 139.7 307.3 141.3 297.3 142.2 292.1 142 292.2 159.5 291.4 179.8 290.5 183.9 288.3 181 279.4 179.2 274.1 177.3 273.6 161.4 273.9 L 147.3 274.1 C 144 269.9 143 267.9 143 266.8 143 261.3 138.5 257 132.7 257 128.5 257 127.4 258.2 126.6 264.1 125.4 272.6 116.9 276.2 99.4 275.7 87.5 275.4 85.5 276.6 84.5 284.7 83.4 294.5 84.7 296.4 92.3 295.6 120.4 292.9 123.9 293.5 122.6 300.5 120.7 310.5 95.7 317.5 87.8 310.3 83.4 306.3 76 314.6 75.3 324.2 74.6 332.6 76.7 335 83.1 333.1 89.2 331.3 108.8 328 113.8 328 122.2 328 120.1 333.7 106.5 347.5 90.4 363.9 72.2 373.4 62.9 370.1 53.4 366.8 54.4 379.7 64.5 390.8 72.8 400 78.4 397.2 106.7 369.9 117.6 359.4 118.6 358.8 121.5 362 123.3 364 123.3 386.2 121.4 403.1 120.6 410.1 122.2 412 128.6 412 140.2 412 140.6 410.8 140.2 377.8 139.8 346 140 345.5 148.8 358.8 159.9 375.2 168.6 385.8 174.2 389.4 177.8 391.7 187.1 391.8 190.4 389.6 194.1 387.3 194.8 387.6 195.5 391.8 198 407.7 198.1 408.1 201.3 405.3 202.5 404.2 205 402.5 206.7 401.6 214.8 397.5 240.4 379.7 247.3 373.3 253.5 367.6 262.4 363.4 265.4 364.8 271.8 367.7 269 375.1 257.7 385.1 245.6 395.8 244.9 397.9 252.8 400.3 265.3 404.2 272.4 405.1 289 404.8 298.1 404.6 306.9 404.9 308.7 405.3 316.8 407.4 317.3 403.9 316.7 349.5 316.2 300.1 315.4 295.2 305.5 284.7 298.9 277.7 299.6 277.3 322.5 276.6 344.8 275.9 357.4 272.9 363.9 266.9 368.6 262.5 363.8 255 356.2 255 343.3 255 309.4 260.7 296.3 265.2 286.1 268.6 278 265.1 276.5 256.7 275.1 249.4 279.7 246.3 287.6 249.2 291.9 250.7 299.3 249.1 308.8 244.5 317 240.6 317.5 239.6 317.3 229.1 317 218.8 317.4 219 300 220.7 289.2 221.8 284.7 221.9 282.4 221.1 280.7 220.5 275 220 269.7 220 263.3 220 257.5 219.3 252.8 218.1 239.2 214.5 236.6 214.5 233 218 230.1 220.8 229.5 221 222.1 221 L 214.2 221 C 211.7 215.7 211 213.9 211 213.6 211 211.4 202.4 200.2 198.3 197.2 187.9 189.5 185.2 187.3 178.1 181 174.1 177.4 169.7 173 168.3 171.2 L 165.8 167.9 C 172.1 153 180.6 141.2 183.9 140.5 187.9 139.6 209 148.7 214 153.5 220.4 159.5 240 163.7 249.8 161.1 257.7 158.9 272.3 138.5 273.8 127.7 L 274.3 123.7 C 251.6 127.1 225.6 124.8 201 118.4 183.8 113.9 183.3 113.6 182.5 106.3 180.7 88.6 173.8 80.6 157 77.1 145.5 74.6 145.1 66.6 156.1 59.3 164.6 53.7 196.6 56.5 202.6 63.4 204.4 65.4 204.8 67.5 205.3 77.6 206.3 99 212.5 110.5 218.8 102.5 221.4 99.2 225.6 85 226.4 77 226.8 72.3 227.8 69.2 230 65.7 233.1 60.8 234.7 53 233.6 48.6 232.4 43.7 229.7 43 210.9 42.4 181.7 41.5 170.8 38.4 160.1 28 156.7 24.9 152.3 21.4 150.3 20.5 L 146.5 18.7 C 186.6 11.1 185.9 11.2 196.8 14.8 216.9 21.5 220.8 21.4 236 13.9 247.5 8.3 247.7 8.3 252.2 10.9 261.3 16.1 280.5 16.1 288.5 10.8 L 293.1 7.8 C 323.9 13.2 377.6 9.3 398.4 2.1 405 -0.2 428.3 -1 432.1 1 435.3 2.8 434.6 8.4 430.7 12.4 423.6 19.4 420.1 84.3 425.9 100 429.5 109.8 429.7 124.4 426.4 137 423.5 148.4 423.4 152.4 426 161.5 427.7 167.3 427.8 169.4 427 174.5 426.5 177.8 426 182.7 426 185.3 426 189.9 425.9 190.1 423.8 189.3 419.8 187.9 400.9 188.5 397 190.2 392.9 192 381 202.6 381 204.4 381 210 372.4 213.5 359.8 213.1 351.2 212.8 340 214.4 340 215.9 340 216.3 341.4 217.9 343 219.5 344.7 221.2 346.8 224.7 347.7 227.8 350 234.9 351 235.3 369.5 234.7 390.7 234.1 396.2 231.8 405.9 219.1 411.6 211.5 412.4 211 418 211 422.4 211 430.5 218.9 434.4 227.2 L 436.5 231.5 C 448.9 232.7 459.6 232.9 468.3 232.7 L 484.1 232.3 C 489.9 239.7 488.3 241.6 475.3 246.7 468.6 249.4 468.2 249.4 441.5 249.7 398.7 250.1 394.6 250.8 391.9 257.7 388.8 265.8 404.5 270.2 437 270.4 463.6 270.5 466.6 272.7 458.7 286 451.7 297.7 448.5 311.9 447.5 336.5 447.1 344.2 446.7 352.3 446.5 354.5 446.3 356.7 445.9 365.2 445.5 373.5 444.7 393.8 443.5 400.2 439.9 404.1 436.7 407.5 434.7 407.1 433.6 402.6 431.4 393.7 383.6 390.8 360.1 398.1 356.6 399.1 348.4 400.6 341.9 401.2 319.3 403.5 324.4 413.2 349.5 415.5 373.8 417.8 401.8 423.7 411.6 428.5 431.3 438.3 462.8 434.5 503.7 417.6 517.2 412 519.1 415.3 511.8 431.3 496.3 465.5 467.2 482.3 438 474 Z M346 380 C 349 379.5 354.6 378.5 358.5 377.6 373.8 374.3 397.2 372 416.9 372 430.1 372 433.8 367.7 427.3 359.9 L 424.6 356.7 C 359.4 358.3 338 363.8 333.3 374.9 331.5 379.2 333.8 382.5 338 381.5 339.4 381.1 343 380.4 346 380 Z M209 356.4 C 206.2 349.1 210.1 341 216.3 341 217.5 341 222.1 339.2 226.5 337 236.3 332.1 246.7 329.8 256.9 330.2 269.8 330.7 268.6 332.1 242.5 346.7 235.8 350.5 215.2 359 212.8 359 210.7 359 209.7 358.4 209 356.4 Z M352.4 344.6 C 372.6 337.7 379.5 336.7 412.4 335.4 432.1 334.6 436.2 332 429.6 324.3 L 427.2 321.5 C 364.7 321.7 336 330.3 336 342.7 336 348.4 339.9 348.8 352.4 344.6 Z M35.4 326.4 C 34.5 322.8 35.9 308 37.5 305 41.4 297.4 60 293 61.5 299.3 62.2 302.2 58.6 316.2 55.7 322 52.1 329.1 36.9 332.4 35.4 326.4 Z M353.9 310 C 372 303.4 401.5 300.2 419.9 302.9 431.9 304.7 436.9 300.8 434.6 291.6 432 281.1 365.9 286.8 345.1 299.2 328.2 309.2 334.6 317 353.9 310 Z M207 307.2 C 197.6 302.6 204.8 294.4 224.5 287.3 234.6 283.7 257.1 283.6 261.3 287.2 L 263.5 289 C 247.8 302.3 216.1 311.8 207 307.2 Z M314.5 176.6 C 319.8 173.1 328 155.1 328 147.1 328 145.1 336.9 105 337.5 104 337.8 103.6 338.2 97.9 338.6 91.4 339.4 73.7 339.3 73.9 358.4 70.6 368.8 68.8 371 69.4 371 74.3 371 80.1 366 84 358.6 84 350 84 348.8 85.5 349.5 95.3 349.9 100.3 349.7 105.2 349 108 348.1 111.8 346.8 122.4 345.7 136.4 345.3 141.8 349.3 143.6 356.6 141.1 371.3 136 371.3 136.2 370.9 159.4 L 370.5 178.5 C 381.5 179.3 381.5 179.1 381.1 159.6 380.7 136.7 379.8 138 395.2 138 405.1 138 407.7 137.7 409.2 136.3 411.6 134.1 411.5 128.8 409 126.5 406.6 124.3 406.4 121 408.6 116.8 409.5 115.1 410.8 109.9 411.6 105.2 412.5 99.4 413.8 95.5 415.5 93 421.5 84.3 419.5 82.7 398.5 80.5 381.6 78.6 380.3 77.9 383.1 71.6 384.6 68.5 387.5 67.8 394 69 404.3 70.9 412.1 69.8 413.5 66.2 415.7 60.3 391.5 57.4 362.8 60.1 346.6 61.6 338.2 61.8 335.9 60.7 334.8 60.1 333.3 60.7 331.5 62.2 328.8 64.6 328.7 64.8 328 80.6 327.2 97 324.8 114.3 323.1 116.4 322.5 117 321.1 122.7 319.9 128.9 317.9 139.1 317.2 141 312.6 148 309.8 152.2 306.3 157.8 304.8 160.3 301.6 165.8 298.2 168.2 292.6 169 284.1 170.1 289.4 176 300.8 178 306.7 179.1 311.5 178.6 314.5 176.6 Z M350.9 168.5 C 357.3 165.3 362.4 155.4 360 151 358.8 148.7 358.2 148.6 354.6 150 353.1 150.5 349.2 151.4 345.7 152 338.8 153.1 337 154.7 337 159.4 337.1 167.4 344.2 172 350.9 168.5 Z M413.6 166.9 C 416.5 164.2 421.3 155.2 420.7 153.7 419.4 150.2 393.5 147.6 392.2 150.8 387.2 163.1 404 175.8 413.6 166.9 Z M283.3 153.6 C 295 146.3 297.5 144 301 137.6 305.5 129.1 299.2 130.2 282.5 140.8 279.8 142.5 277 144 276.4 144 272.7 144 268 154.3 270 158 271.5 160.9 272 160.7 283.3 153.6 Z M139 157.1 C 131.8 154.9 121 146.9 121 143.8 121 136.9 140 132.5 150.4 137.1 160.5 141.5 149.8 160.4 139 157.1 Z M356.5 129 C 355.3 127.1 358.1 121.1 361.2 118.9 366.2 115.3 391 112.7 396.5 115.2 400 116.8 399.9 121.1 396.4 123.9 394.1 125.7 392.3 126 382.6 126 374 126 370.1 126.5 365.7 128 359.3 130.3 357.4 130.5 356.5 129 Z M22 117 C 21.9 72.4 16.9 49.2 5.3 39.3 0.6 35.2 -1.6 31 1 31 2.9 31 9.2 24.6 11.1 20.6 20 2.8 24.7 -2 29.9 1.3 38.9 7.1 40.2 7.3 57.9 6.6 73.3 5.9 74.8 5.7 78.3 3.4 82.6 0.6 83 0.7 84.5 5.3 85.8 9.3 89.9 10.2 101.7 9.1 111.6 8.1 114.7 8.6 116.2 11.4 119.2 17.2 120.8 18 130.2 18 135.4 18 139 18.4 139 19 139 19.6 138.6 20 138.2 20 137.2 20 134 26.5 134 28.5 134 36.9 102.3 45.8 75.9 44.6 59.7 43.9 59 44.3 61 51.5 62.6 57.2 61.7 64.7 58.4 72.5 53.5 84 54.5 99.4 60.4 103.2 65.9 106.9 73.7 99.8 81.3 84.3 87.7 71 93.7 65.4 106.8 60.2 125.5 52.8 132.7 61.8 122 79 119.3 83.4 116.3 88.6 115.4 90.5 114.5 92.4 110.6 97.5 106.6 101.7 102.7 106 98.3 110.9 96.9 112.7 92.9 117.5 89.3 118.8 75.4 120.5 59.1 122.5 45.7 124.8 42.2 126.2 40.7 126.8 35.6 127.3 30.8 127.4 L 22 127.6 Z M291.6 119.2 C 299.4 115.2 309.3 102.6 306.2 100.6 305.2 100 289.8 102.6 285.6 104 284 104.6 281.3 105 279.6 105 270 105 263.6 118.6 272 121.2 276.5 122.5 287.2 121.4 291.6 119.2 Z M127.6 113.5 C 120.4 108 142.2 84.3 150.5 88.6 152 89.4 154 90 155 90 158 90 158.9 92.3 159.6 101.1 160.4 111.4 160.2 111.5 149.8 112.3 145.6 112.6 141.3 113.3 140.2 113.9 137.3 115.4 129.9 115.2 127.6 113.5 Z M361.7 104.3 C 360 102.7 361.1 98.1 363.6 96.1 370.5 90.7 402 90 402 95.4 402 100 398.8 101.3 385.9 102.1 379.1 102.5 371.9 103.3 370 103.9 366.1 105.1 362.7 105.3 361.7 104.3 Z M303.6 85.2 C 328.1 72.1 324.5 64 294 63.2 276.8 62.8 275 63.8 275 74.2 275 90.3 286.1 94.6 303.6 85.2 Z'/%3E%3C/svg%3E");

    



    --primary:       #2f2a26;   
    --primary-dark:  #191614;
    --primary-light: #efeae1;

    
    --success: var(--down);
    --warning: var(--warn);
    --danger:  var(--up);
    

    
    --bg:             var(--paper-2);
    --bg-muted:       var(--paper-3);
    --card:           var(--paper-0);
    --border:         var(--line);
    --text:           var(--ink-1);
    --text-secondary: var(--ink-2);
    

    --text-muted:     var(--ink-3);

    
    --sidebar-bg:     #26221d;
    --sidebar-text:   #cfc7ba;   
    --sidebar-hover:  #332e28;
    --sidebar-active: var(--seal-5);   

    --overlay: rgba(33, 30, 26, .48);

    
    --select-bg:        #f0ece4;
    --select-bg-strong: #e4ddd0;
    --select-border:    var(--primary-dark);
    --select-highlight: rgba(47, 42, 38, .32);

    
    --radius:      var(--r-3);
    --radius-sm:   var(--r-2);
    --radius-xs:   var(--r-1);
    --radius-lg:   var(--r-4);
    --radius-pill: var(--r-pill);

    
    --shadow:    0 1px 3px rgba(33, 30, 26, .07), 0 1px 2px rgba(33, 30, 26, .04);
    --shadow-lg: 0 10px 30px rgba(33, 30, 26, .11);

    --sidebar-width: 220px;

    
    --z-sidebar: 40; --z-sidebar-mask: 35; --z-topbar: 30;
    --z-dropdown: 50; --z-modal: 100; --z-toast: 200;

    
    --fs-h3:  var(--fs-md);    
    --fs-h2:  var(--fs-lg);    
    --fs-h1:  var(--fs-xl);    
    --fs-kpi: var(--fs-2xl);   

    

    --ctl-h: 34px;
    --ctl-h-sm: 30px;

    
    --primary-ink: var(--ink-1);
    --primary-bg:  #efeae1;
    --primary-bd:  #ded6c6;

    --success-ink: #0b7540;  --success-bg: #e6f2ea;  --success-bd: #bcdcca;
    --warning-ink: #8a4300;  --warning-bg: #faf0e1;  --warning-bd: #ecd5ae;
    --danger-ink:  #a51b12;  --danger-bg:  #fbeae7;  --danger-bd:  #f0c7c0;
    --info-ink:    #0f6a7a;  --info-bg:    #e4f1f4;  --info-bd:    #b3d8e0;
    --purple-ink:  #6b3fa0;  --purple-bg:  #efe9fa;  --purple-bd:  #d7ccf0;
    --neutral-ink: var(--ink-2); --neutral-bg: #efeae1; --neutral-bd: var(--line);

    --code-bg: #26221d;   
    --code-fg: #ece7db;
}


* { box-sizing: border-box; }



table, .num, .kpi-card, .kpi-extra, .pagination { font-variant-numeric: tabular-nums; }

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
}

body {
    font-family: var(--font-sans);
    background: var(--bg);
    color: var(--text);
    font-size: 14px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

.hidden { display: none !important; }
.muted { color: var(--text-secondary); font-size: var(--fs-sm); font-weight: normal; }











button, input, select, textarea { font-family: inherit; font-size: var(--fs-base); color: inherit; }



input[type="checkbox"],
input[type="radio"] {
    width: 16px;
    height: 16px;
    margin: 0;
    flex-shrink: 0;
    accent-color: var(--primary);
    cursor: pointer;
}



.table-scroll,
.heatmap-wrap,
.pi-w-scroll,
.metric-picker,
.modal-body,
.sidebar-nav,
.sql-preview,
.copy-fallback {
    scrollbar-width: thin;
    scrollbar-color: #c9c1b3 transparent;
}

.table-scroll::-webkit-scrollbar,
.heatmap-wrap::-webkit-scrollbar,
.pi-w-scroll::-webkit-scrollbar,
.metric-picker::-webkit-scrollbar,
.modal-body::-webkit-scrollbar,
.sidebar-nav::-webkit-scrollbar,
.sql-preview::-webkit-scrollbar,
.copy-fallback::-webkit-scrollbar { width: 10px; height: 10px; }

.table-scroll::-webkit-scrollbar-track,
.heatmap-wrap::-webkit-scrollbar-track,
.pi-w-scroll::-webkit-scrollbar-track,
.metric-picker::-webkit-scrollbar-track,
.modal-body::-webkit-scrollbar-track,
.sidebar-nav::-webkit-scrollbar-track,
.sql-preview::-webkit-scrollbar-track,
.copy-fallback::-webkit-scrollbar-track { background: transparent; }

.table-scroll::-webkit-scrollbar-thumb,
.heatmap-wrap::-webkit-scrollbar-thumb,
.pi-w-scroll::-webkit-scrollbar-thumb,
.metric-picker::-webkit-scrollbar-thumb,
.modal-body::-webkit-scrollbar-thumb,
.sidebar-nav::-webkit-scrollbar-thumb,
.sql-preview::-webkit-scrollbar-thumb,
.copy-fallback::-webkit-scrollbar-thumb {
    background: #c9c1b3;
    border: 2px solid transparent;
    background-clip: content-box;
    border-radius: var(--radius-pill);
}

.table-scroll::-webkit-scrollbar-thumb:hover,
.heatmap-wrap::-webkit-scrollbar-thumb:hover,
.pi-w-scroll::-webkit-scrollbar-thumb:hover,
.metric-picker::-webkit-scrollbar-thumb:hover,
.modal-body::-webkit-scrollbar-thumb:hover,
.sidebar-nav::-webkit-scrollbar-thumb:hover { background: #a89f90; background-clip: content-box; }




@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
    


    .page { animation: none !important; }
    .is-busy::before { opacity: .85; }
}







html.auth-ok .login-view { display: none; }



.boot-hint { display: none; }
html.auth-ok .boot-hint {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--text-secondary);
    font-size: 13px;
}
.boot-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--primary);
    opacity: .7;
}
@media (prefers-reduced-motion: no-preference) {
    .boot-dot { animation: busy-pulse 1.1s ease-in-out infinite; }
}


.login-view {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: linear-gradient(150deg, #2b2621 0%, #4a231c 60%, var(--seal-7) 100%);
}

.login-card {
    width: 100%;
    max-width: 400px;
    background: var(--card);
    border-radius: var(--radius-lg);
    padding: 32px;
    box-shadow: var(--shadow-lg);
}

.login-brand {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 26px;
}

















.login-logo {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    background-image: var(--seal-img);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.login-logo.small { width: 32px; height: 32px; }




.login-brand h1 {
    font-family: var(--font-display); font-weight: var(--fw-reg);
    font-size: var(--fs-h1); margin: 0 0 2px;
}


















.legal-foot {
    display: flex;
    flex-direction: column;
    

    gap: var(--sp-1);
    margin: var(--sp-5) 0 0;
    padding-top: var(--sp-4);
    border-top: 1px solid var(--border);
    font-size: var(--fs-xs);
    line-height: 1.5;
    

    color: var(--text-secondary);
    text-align: center;
}

.legal-foot .legal-item { display: block; }


.legal-foot img { width: 16px; height: auto; vertical-align: -0.25em; margin-right: 4px; }
.legal-foot a { color: var(--text-secondary); }
.legal-foot a:hover { color: var(--primary); }


.app-view { display: flex; min-height: 100vh; }

.sidebar {
    width: var(--sidebar-width);
    background: var(--sidebar-bg);
    color: var(--sidebar-text);
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: var(--z-sidebar);
    transition: transform .25s ease;
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 18px;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    



    border-bottom: 2px solid var(--seal-5);
}



.sidebar-brand > span { line-height: 1.3; text-wrap: balance; }

.sidebar-nav { flex: 1; padding: 12px 0; overflow-y: auto; }

.nav-item {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 11px 20px;
    color: var(--sidebar-text);
    text-decoration: none;
    font-size: 14px;
    border-left: 3px solid transparent;
    transition: background-color .15s, color .15s;
}

.nav-item:hover { background: var(--sidebar-hover); color: #fff; }
.nav-item.active {
    background: var(--sidebar-active);
    color: #fff;
    border-left-color: var(--seal-2);
}
.nav-icon { width: 18px; text-align: center; font-size: 15px; }

.sidebar-footer { padding: 12px 18px; border-top: 1px solid rgba(255, 255, 255, .08); }

.service-status {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--fs-xs);
    cursor: pointer;
    color: var(--sidebar-text);
    border-radius: var(--radius-sm);
    transition: color var(--t-fast) var(--ease);
}

.service-status:hover { color: #fff; }

.service-status .dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--success);
    box-shadow: 0 0 0 3px rgba(11, 117, 64, .22);
}

.service-status.degraded .dot { background: var(--danger); box-shadow: 0 0 0 3px rgba(199, 35, 23, .22); }

.main {
    flex: 1;
    margin-left: var(--sidebar-width);
    display: flex;
    flex-direction: column;
    min-width: 0;
}


.topbar {
    height: 56px;
    background: var(--card);
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 20px;
    position: sticky;
    top: 0;
    z-index: var(--z-topbar);
}






.topbar-title {
    font-family: var(--font-display); font-weight: var(--fw-reg);
    font-size: var(--fs-h2); flex: 1;
}
.topbar-right { display: flex; align-items: center; gap: 14px; }




.scope-note {
    margin: 12px 20px 0;
    padding: 8px 12px;
    border-left: 3px solid var(--seal-2);
    background: var(--card);
    border-radius: var(--radius-sm);
    font-size: var(--fs-sm);
    color: var(--text-secondary);
    line-height: var(--lh-snug);
}

.scope-note.warn {
    border-left-color: var(--seal-5);
    color: var(--seal-6);
    background: var(--seal-1);
}
@media (max-width: 768px) {
    .scope-note { margin: 8px 12px 0; }
}


.scope-intro { margin: 0 0 var(--sp-4); line-height: var(--lh-base); }
.scope-intro strong { color: var(--text); }
.scope-all {
    display: flex; align-items: center; gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4); margin-bottom: var(--sp-3);
    border: 1px solid var(--border); border-radius: var(--radius-sm);
    background: var(--paper-2); cursor: pointer;
}
.scope-all .muted { margin-left: var(--sp-2); font-size: var(--fs-xs); }
.scope-search { margin-bottom: var(--sp-3); }
.scope-list {
    max-height: 300px; overflow-y: auto; overscroll-behavior: contain;
    border: 1px solid var(--border); border-radius: var(--radius-sm);
    padding: var(--sp-2) var(--sp-3); background: var(--card);
}
.scope-item {
    display: flex; align-items: center; gap: var(--sp-3);
    padding: 5px 2px; cursor: pointer; border-radius: var(--r-1);
    font-size: var(--fs-base);
}
.scope-item:hover { background: var(--primary-light); }

.scope-item.hidden { display: none; }
.scope-sum { margin-top: var(--sp-3); font-size: var(--fs-xs); }


.role-layout {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: var(--sp-5);
    padding: var(--sp-4) var(--sp-6) var(--sp-6);
}
.role-list { display: flex; flex-direction: column; gap: 2px; }
.role-item {
    display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
    padding: 8px 10px; border: 1px solid transparent; border-radius: var(--radius-sm);
    background: transparent; cursor: pointer; text-align: left; font-size: var(--fs-base);
    color: var(--text);
}
.role-item:hover { background: var(--primary-light); }
.role-item.active {
    background: var(--primary-light);
    border-color: var(--border);
    font-weight: var(--fw-semi);
}
.role-item-meta { font-size: var(--fs-xs); color: var(--text-muted); }
.role-editor { min-width: 0; }
.role-editor-head {
    display: flex; align-items: center; gap: var(--sp-3);
    padding-bottom: var(--sp-3); border-bottom: 1px solid var(--border);
    margin-bottom: var(--sp-4);
}
.role-editor-head #role-delete { margin-left: auto; }
.role-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-6); }
.perm-group-title {
    font-size: var(--fs-sm); font-weight: var(--fw-semi);
    padding-bottom: var(--sp-2); margin-bottom: var(--sp-2);
    border-bottom: 1px dashed var(--border);
}
.perm-group-title .muted { font-weight: var(--fw-reg); margin-left: var(--sp-2); }
.perm-row {
    display: grid;
    grid-template-columns: 18px auto 1fr;
    align-items: center; gap: var(--sp-2);
    padding: 4px 2px; font-size: var(--fs-base); cursor: pointer;
    border-radius: var(--r-1);
}
.perm-row:hover { background: var(--paper-2); }
.perm-need { font-size: var(--fs-xs); color: var(--warn); white-space: nowrap; }
.perm-hint { font-size: var(--fs-xs); text-align: right; }
.role-foot {
    display: flex; align-items: center; gap: var(--sp-4);
    margin-top: var(--sp-5); padding-top: var(--sp-4);
    border-top: 1px solid var(--border);
}
.role-foot .field-error { flex: 1; }
@media (max-width: 1024px) {
    .role-grid { grid-template-columns: 1fr; gap: var(--sp-4); }
}
@media (max-width: 768px) {
    .role-layout { grid-template-columns: 1fr; padding: var(--sp-4); }
    .role-list { flex-direction: row; overflow-x: auto; }
}



.icon-btn {
    display: none;
    width: 34px;
    height: 34px;
    border: 1px solid var(--border);
    background: #fff;
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-size: 16px;
    color: var(--text);
    transition: background-color var(--t-fast) var(--ease),
                border-color var(--t-fast) var(--ease),
                color var(--t-fast) var(--ease);
}

.icon-btn:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-light); }
.icon-btn:active { background: var(--primary-bg); }

.role-badge {
    padding: 3px 10px;
    border-radius: var(--radius-pill);
    font-size: var(--fs-xs);
    background: var(--primary-light);
    color: var(--primary);
    font-weight: 500;
}





.role-badge:empty { display: none; }

.user-menu { position: relative; }

.user-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    border: none;
    background: none;
    cursor: pointer;
    font-size: var(--fs-base);
    color: var(--text);
    padding: 4px 8px;
    border-radius: var(--radius-sm);
    transition: background-color var(--t-fast) var(--ease);
}

.user-btn:hover { background: var(--bg); }

.avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--fs-sm);
    font-weight: 600;
}

.dropdown {
    position: absolute;
    right: 0;
    top: 42px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-lg);
    min-width: 140px;
    overflow: hidden;
    z-index: var(--z-dropdown);
    animation: menuIn var(--t-fast) var(--ease);
}

@keyframes menuIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: none; }
}

.dropdown button {
    display: block;
    width: 100%;
    padding: 10px 16px;
    border: none;
    background: none;
    text-align: left;
    cursor: pointer;
    font-size: var(--fs-base);
    color: var(--text);
    transition: background-color var(--t-fast) var(--ease);
}

.dropdown button:hover { background: var(--bg); }
.dropdown button:last-child { color: var(--danger); }

.content { padding: 20px; flex: 1; }
.page { animation: fadeIn var(--t-base) var(--ease); }

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: none; }
}



.card,
.kpi-card {
    background: var(--card);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 18px;
}

.card { margin-bottom: 18px; }




.drill-back {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}




.card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border);
    flex-wrap: wrap;
}

.card-head h3 { margin: 0; font-size: 15px; font-weight: 600; color: var(--ink-1); }

.card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}



.card-grid .card { margin-bottom: 0; min-width: 0; }
.card-grid .span-2 { grid-column: span 2; }


.kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 18px;
}

.kpi-card {
    border-left: 3px solid var(--primary);
}






.kpi-label {
    font-size: var(--fs-sm); color: var(--text-muted);
    letter-spacing: .04em; margin-bottom: 6px;
}


.kpi-value {
    font-size: var(--fs-kpi); font-weight: 700; line-height: 1.15;
    letter-spacing: -.015em; font-variant-numeric: tabular-nums;
}
.kpi-extra { font-size: var(--fs-xs); color: var(--text-muted); margin-top: 6px; }
.kpi-extra .up { color: var(--danger); }      
.kpi-extra .down { color: var(--success); }   






.chart-box { position: relative; height: 260px; min-width: 0; overflow: hidden; }
.chart-box.tall { height: 320px; }

.chart-box canvas { max-width: 100%; }







.chart-text-layer {
    position: absolute;
    left: 0;
    top: 0;
    overflow: hidden;      
    pointer-events: none;  
}

.chart-text-layer .chart-text {
    position: absolute;
    display: flex;
    align-items: center;
    color: transparent;            
    white-space: nowrap;
    cursor: text;
    user-select: text;
    pointer-events: auto;          
}
.chart-text-layer .chart-text::selection { background: var(--select-highlight); }


.input {
    height: var(--ctl-h);
    padding: 0 10px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: var(--fs-base);
    background: #fff;
    color: var(--text);
    outline: none;
    transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
    max-width: 100%;
}

.input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(47, 42, 38, .12); }
.input-sm { height: var(--ctl-h-sm); font-size: var(--fs-sm); padding: 0 8px; }
select.input { cursor: pointer; }

.form-item { margin-bottom: 16px; }
.form-item > label {
    display: block;
    margin-bottom: 6px;
    font-size: var(--fs-sm);
    font-weight: 500;
}
.form-item > label .req { color: var(--danger); margin-left: 2px; }
.form-item .input { width: 100%; }

.field-error { display: block; color: var(--danger); font-size: var(--fs-xs); margin-top: 4px; min-height: 16px; }
.field-error:empty { min-height: 0; }



.form-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 16px; }
.form-grid .full { grid-column: span 2; }


.form-section { margin-bottom: 20px; }

.form-section-title {
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--primary);
    padding: 6px 10px;
    margin-bottom: 12px;
    background: var(--primary-light);
    border-radius: var(--radius-sm);
    border-left: 3px solid var(--primary);
}




.inline-label {
    display: inline-flex;
    align-items: center;
    min-height: var(--ctl-h-sm);
    font-size: var(--fs-sm);
    color: var(--text-secondary);
}




.btn {
    height: var(--ctl-h);
    padding: 0 14px;
    border: 1px solid var(--border);
    background: #fff;
    color: var(--text);
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-size: var(--fs-base);
    white-space: nowrap;
    transition: background-color var(--t-fast) var(--ease),
                border-color var(--t-fast) var(--ease),
                color var(--t-fast) var(--ease);
}

.btn:hover { border-color: var(--primary); color: var(--primary); }
.btn:active { background: var(--primary-light); }
.btn-primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); color: #fff; }
.btn-primary:active { background: var(--primary-dark); }
.btn-danger-ghost { color: var(--danger); border-color: var(--danger-bd); }
.btn-danger-ghost:hover { background: var(--danger-bg); border-color: var(--danger); color: var(--danger); }

.btn-danger { background: var(--danger); border-color: var(--danger); color: #fff; }
.btn-danger:hover { background: var(--danger); border-color: var(--danger); color: #fff;
  filter: brightness(.92); }
.btn-danger:active { filter: brightness(.85); }
.btn-danger:disabled:hover { background: var(--danger); border-color: var(--danger); color: #fff; }
.btn-sm { height: var(--ctl-h-sm); padding: 0 10px; font-size: var(--fs-sm); }
.btn-block { width: 100%; }
.btn:disabled { opacity: .55; cursor: not-allowed; }

.btn:disabled:hover { border-color: var(--border); color: var(--text); background: #fff; }
.btn-primary:disabled:hover { border-color: var(--primary); color: #fff; background: var(--primary); }





.filter-bar > .input,
.filter-bar > .btn {
    height: var(--ctl-h-sm);
    font-size: var(--fs-sm);
    padding: 0 10px;
}





.btn:focus-visible,
.page-btn:focus-visible,
.page-size:focus-visible,
.date-chip:focus-visible,
.op-link:focus-visible,
.icon-btn:focus-visible,
.modal-close:focus-visible,
.user-btn:focus-visible,
.nav-item:focus-visible,
.sortable:focus-visible,
.saved-chip:focus-visible,
.metric-group-all:focus-visible,
.service-status:focus-visible,
input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 1px;
}


.shop-filter { display: inline-flex; align-items: center; gap: 6px; }
.shop-filter .input { min-width: 150px; }


.filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-bottom: 14px;
}

.filter-bar .input { min-width: 130px; }


.date-range { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.date-chips { display: inline-flex; gap: 4px; }

.date-chip {
    height: var(--ctl-h-sm);
    padding: 0 12px;
    border: 1px solid var(--border);
    background: #fff;
    color: var(--text-secondary);
    border-radius: var(--radius-pill);
    font-size: var(--fs-sm);
    cursor: pointer;
    transition: background-color var(--t-fast) var(--ease),
                border-color var(--t-fast) var(--ease),
                color var(--t-fast) var(--ease);
}

.date-chip:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); }
.date-chip.active { background: var(--primary); border-color: var(--primary); color: #fff; }
.date-chip:disabled { opacity: .55; cursor: not-allowed; }

.date-custom { display: inline-flex; align-items: center; gap: 8px; }
.date-custom .input { min-width: 130px; }



.drp { display: inline-flex; align-items: center; }
.drp > input[type="date"],
.drp > .drp-sep { display: none; }

.drp-trigger {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: var(--ctl-h-sm);
    min-width: 196px;
    padding: 0 10px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: #fff;
    color: var(--text);
    font-size: var(--fs-sm);
    cursor: pointer;
    transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.drp-trigger:hover { border-color: var(--primary); }
.drp-trigger:focus-visible {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(47, 42, 38, .12);
}
.drp-trigger .drp-icon { display: inline-flex; color: var(--ink-3); flex-shrink: 0; }
.drp-trigger .drp-value {
    font-variant-numeric: tabular-nums;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.drp-trigger:not(.is-set) .drp-value { color: var(--text-muted); }

.drp-panel {
    position: fixed;
    z-index: var(--z-dropdown);
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    padding: 12px;
}
.drp-months { display: flex; gap: 16px; }
.drp-month { width: 236px; }
.drp-month__hd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
}
.drp-month__label {
    font-size: var(--fs-sm);
    font-weight: var(--fw-semi);
    font-variant-numeric: tabular-nums;
}
.drp-nav,
.drp-nav-spacer { width: 26px; height: 26px; }
.drp-nav {
    border: 1px solid var(--border);
    border-radius: var(--radius-xs);
    background: #fff;
    color: var(--ink-2);
    line-height: 1;
    cursor: pointer;
}
.drp-nav:hover { border-color: var(--primary); color: var(--primary); }



.drp-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.drp-table th {
    padding: 4px 0;
    font-size: var(--fs-xs);
    font-weight: normal;
    color: var(--ink-3);
    text-align: center;
}

.drp-table td { padding: 0; text-align: center; }

.drp-day {
    width: 100%;
    height: 28px;
    border: 0;
    border-radius: var(--radius-xs);
    background: transparent;
    color: var(--text);
    font-size: var(--fs-sm);
    font-variant-numeric: tabular-nums;
    cursor: pointer;
}
.drp-day:hover { background: var(--select-bg); }
.drp-day.is-out { color: var(--ink-3); }
.drp-day.is-disabled { color: #c9c1b3; cursor: not-allowed; background: transparent; }
.drp-day.is-in { background: var(--select-bg-strong); border-radius: 0; }
.drp-day.is-start,
.drp-day.is-end { background: var(--primary); color: #fff; border-radius: var(--radius-xs); }
.drp-day.is-today { box-shadow: inset 0 0 0 1px var(--primary); }

.drp-foot {
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid var(--border);
    color: var(--ink-3);
    font-size: var(--fs-sm);
}

@media (max-width: 559px) {
    .drp-months { flex-direction: column; gap: 10px; }
    .drp-month { width: auto; }
    .drp-trigger { min-width: 0; width: 100%; }
}







.table-scroll { overflow-x: auto; }








.table-fold > summary {
    padding: var(--sp-2) 2px;
    color: var(--text-secondary);
    font-size: var(--fs-sm);
    cursor: pointer;
    user-select: none;
}
.table-fold > summary:hover { color: var(--primary-ink); }
.table-fold[open] > summary {
    margin-bottom: var(--sp-3);
    border-bottom: 1px dashed var(--border);
}

.table { width: 100%; border-collapse: collapse; font-size: var(--fs-base); }

.table th, .table td {
    padding: 10px 12px;
    text-align: left;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}



.table td { font-variant-numeric: tabular-nums; }

.table th {
    background: var(--bg-muted);
    font-weight: 600;
    color: var(--text-secondary);
    font-size: var(--fs-sm);
    letter-spacing: .02em;
    position: sticky;
    top: 0;
    

    border-bottom: 1px solid var(--line-strong);
}

.table tbody tr:hover { background: var(--bg-muted); }
.table .col-check { width: 40px; }
.table .col-op { width: 130px; }

.sortable { cursor: pointer; user-select: none; }
.sortable:hover { color: var(--primary); }
.sortable::after { content: "⇅"; margin-left: 4px; opacity: .35; font-size: 12px; }
.sortable.asc::after { content: "↑"; opacity: 1; color: var(--primary); }
.sortable.desc::after { content: "↓"; opacity: 1; color: var(--primary); }







.table td.table-empty { text-align: center; padding: 40px; color: var(--text-muted); }



.table th.wrap, .table td.wrap {
    white-space: normal;
    overflow-wrap: anywhere;
    min-width: 120px;
}


.card-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }




.table tbody tr.row-selected {
    background: var(--select-bg);
    box-shadow: inset 3px 0 0 var(--select-border);   
}

.table tbody tr.row-selected,
.table tbody tr.row-selected:hover { background: var(--select-bg); }



.table td.cell-selected {
    position: relative;          
    background: var(--select-bg-strong);
    box-shadow: inset 0 0 0 2px var(--select-border);
}

.table td.cell-selected.range-anchor::after {
    content: "";
    position: absolute;
    left: 0; top: 0;
    width: 0; height: 0;
    border-top: 6px solid var(--select-border);
    border-right: 6px solid transparent;
}
.table td.cell-selected::selection { background: var(--select-highlight); }



.tag {
    display: inline-block;
    padding: 2px 8px;
    border-radius: var(--radius-xs);
    font-size: var(--fs-xs);
    line-height: 18px;
    white-space: nowrap;
}

.tag-gray { background: var(--neutral-bg); color: var(--neutral-ink); }
.tag-blue { background: var(--primary-bg); color: var(--primary-ink); }
.tag-cyan { background: var(--info-bg); color: var(--info-ink); }
.tag-green { background: var(--success-bg); color: var(--success-ink); }
.tag-red { background: var(--danger-bg); color: var(--danger-ink); }
.tag-orange { background: var(--warning-bg); color: var(--warning-ink); }
.tag-purple { background: var(--purple-bg); color: var(--purple-ink); }

.op-link {
    border: none;
    background: none;
    color: var(--primary);
    cursor: pointer;
    font-size: var(--fs-sm);
    padding: 2px 4px;
    border-radius: var(--radius-xs);
    transition: background-color var(--t-fast) var(--ease);
}

.op-link:hover { text-decoration: underline; }
.op-link.danger { color: var(--danger); }


.pagination {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 14px;
    flex-wrap: wrap;
}

.pagination .page-info { color: var(--text-secondary); font-size: var(--fs-sm); margin-right: auto; }


.page-btn {
    min-width: 30px;
    height: var(--ctl-h-sm);
    padding: 0 8px;
    border: 1px solid var(--border);
    background: #fff;
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-size: var(--fs-sm);
    color: var(--text);
    transition: background-color var(--t-fast) var(--ease),
                border-color var(--t-fast) var(--ease),
                color var(--t-fast) var(--ease);
}

.page-btn:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); }
.page-btn.active { background: var(--primary); border-color: var(--primary); color: #fff; }
.page-btn:disabled { opacity: .5; cursor: not-allowed; }



.page-size {
    height: var(--ctl-h-sm);
    padding: 0 6px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: var(--fs-sm);
    color: var(--text);
    background: #fff;
    cursor: pointer;
    transition: border-color var(--t-fast) var(--ease);
}

.page-size:hover { border-color: var(--primary); }


.conditions { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }

.condition-row {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    padding: 10px 12px;
    background: var(--bg-muted);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
}

.condition-row .idx {
    width: 22px;
    height: 22px;
    border-radius: var(--radius-xs);
    background: var(--primary);
    color: #fff;
    font-size: var(--fs-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.condition-row select.input, .condition-row input.input { flex: 1; min-width: 110px; }

.condition-row .drp { flex: 2; min-width: 140px; }
.condition-row .drp-trigger { min-width: 0; flex: 1; }


.condition-row select.input.connector-select { width: 72px; flex: 0 0 72px; min-width: 72px; }
.condition-row .btn-remove { flex-shrink: 0; }

.conditions-empty {
    padding: 22px;
    text-align: center;
    color: var(--text-muted);
    border: 1px dashed var(--border);
    border-radius: var(--radius-sm);
    font-size: var(--fs-sm);
}

.saved-queries { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }




.saved-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: var(--ctl-h-sm);
    padding: 0 10px 0 12px;
    background: var(--primary-light);
    border: 1px solid var(--primary-bd);
    border-radius: var(--radius-pill);
    font-size: var(--fs-sm);
    cursor: pointer;
    transition: background-color var(--t-fast) var(--ease);
}

.saved-chip:hover { background: var(--primary-bg); }


.saved-chip .x {
    color: var(--text-muted);
    font-size: var(--fs-base);
    background: none;
    border: 0;
    padding: 0;
    line-height: 1;
    cursor: pointer;
}
.saved-chip .x:hover { color: var(--danger); }



.metric-picker { max-height: clamp(260px, calc(100vh - 260px), 720px); overflow-y: auto; padding-right: 4px; }

.metric-group { margin-bottom: 18px; }
.metric-group:last-child { margin-bottom: 0; }

.metric-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 10px;
    margin-bottom: 10px;
    background: var(--primary-light);
    border-left: 3px solid var(--primary);
    border-radius: var(--radius-sm);
}

.metric-group-name { font-size: var(--fs-sm); font-weight: 600; color: var(--primary); }

.metric-group-all {
    border: none;
    background: none;
    padding: 0 4px;
    font-size: var(--fs-xs);
    color: var(--primary);
    cursor: pointer;
}
.metric-group-all:hover { text-decoration: underline; }

.metric-items { display: flex; flex-wrap: wrap; gap: 8px 18px; }

.metric-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--fs-sm);
    white-space: nowrap;
    cursor: pointer;
}
.metric-item:hover span { color: var(--primary); }


.metric-item.locked { cursor: default; }
.metric-item.locked input { cursor: not-allowed; }
.metric-item.locked:hover span { color: inherit; }

.metric-hint {
    margin: 0 0 12px;
    padding: 8px 10px;
    font-size: var(--fs-xs);
    line-height: 1.6;
    color: var(--text-secondary);
    background: var(--bg-muted);
    border-left: 3px solid var(--primary);
    border-radius: var(--radius-sm);
}



.cell-sub {
    display: block;
    margin-top: 2px;
    font-size: var(--fs-2xs);
    color: var(--text-muted);
    white-space: normal;
    overflow-wrap: anywhere;
}




.badge-hist {
    margin-left: 4px;
    padding: 0 6px;
    font-size: var(--fs-2xs);
    line-height: 16px;
    color: var(--text-muted);
    background: var(--bg-muted);
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    cursor: pointer;
    white-space: nowrap;
    vertical-align: middle;
    transition: color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}

.badge-hist:hover {
    color: var(--primary);
    border-color: var(--primary);
}

.sql-preview {
    margin-top: 12px;
    padding: 12px;
    background: var(--code-bg);
    color: var(--code-fg);
    border-radius: var(--radius-sm);
    font-family: Consolas, Monaco, monospace;
    font-size: var(--fs-xs);
    overflow-x: auto;
    white-space: pre-wrap;
    word-break: break-all;
}


.modal-mask {
    position: fixed;
    inset: 0;
    background: var(--overlay);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    z-index: var(--z-modal);
    animation: fadeIn var(--t-fast) var(--ease);
}

.modal {
    background: #fff;
    border-radius: var(--radius-lg);
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: var(--shadow-lg);
    animation: modalIn var(--t-base) var(--ease);
}

@keyframes modalIn {
    from { opacity: 0; transform: translateY(8px) scale(.99); }
    to { opacity: 1; transform: none; }
}

.modal-head {
    padding: 16px 20px;
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.modal-head h3 { margin: 0; font-size: var(--fs-h2); }

.modal-close {
    border: none;
    background: none;
    font-size: 20px;
    cursor: pointer;
    color: var(--text-muted);
    line-height: 1;
    border-radius: var(--radius-xs);
    transition: color var(--t-fast) var(--ease);
}

.modal-close:hover { color: var(--text); }
.modal-body { padding: 20px; overflow-y: auto; }


.modal-text { margin: 0; font-size: var(--fs-base); line-height: 1.7; }
.modal-lead { margin: 0 0 10px; }



.modal-sec-title {
    margin: 14px 0 6px;
    font-size: var(--fs-sm);
    font-weight: var(--fw-semi);
}


.copy-fallback {
    width: 100%;
    height: 240px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-family: Consolas, Monaco, monospace;
    font-size: var(--fs-xs);
    line-height: 1.6;
    white-space: pre;
    overflow: auto;
    resize: vertical;
}

.modal-foot {
    padding: 14px 20px;
    border-top: 1px solid var(--border);
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}


.alert {
    padding: 9px 12px;
    border-radius: var(--radius-sm);
    font-size: var(--fs-sm);
    margin-bottom: 14px;
}

.alert-error { background: var(--danger-bg); color: var(--danger-ink); border: 1px solid var(--danger-bd); }
.alert-warn { background: var(--warning-bg); color: var(--warning-ink); border: 1px solid var(--warning-bd); }


.shop-note { margin: -6px 0 12px; font-size: var(--fs-xs); line-height: 1.7; }

.toast-container {
    position: fixed;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: var(--z-toast);
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    pointer-events: none;
}

.toast {
    padding: 10px 18px;
    border-radius: var(--radius-sm);
    background: var(--code-bg);
    color: #fff;
    font-size: var(--fs-base);
    box-shadow: var(--shadow-lg);
    animation: toastIn var(--t-base) var(--ease);
}

.toast.success { background: var(--success); }
.toast.error { background: var(--danger); }
.toast.info { background: var(--primary); }

@keyframes toastIn {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: none; }
}


.sidebar-mask {
    display: none;
    position: fixed;
    inset: 0;
    background: var(--overlay);
    z-index: var(--z-sidebar-mask);
}




.head-controls { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.head-controls > * { min-width: 0; }

.chk-inline {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: var(--fs-sm);
    color: var(--text-secondary);
    white-space: nowrap;
    cursor: pointer;
}
.chk-inline input { margin: 0; cursor: pointer; }


.overview-note { margin: -10px 0 18px; font-size: var(--fs-xs); color: var(--text-muted); }
.overview-note:empty { display: none; }


.funnel { display: flex; flex-direction: column; gap: 14px; }

.funnel-item { display: flex; flex-direction: column; gap: 6px; }

.funnel-head { display: flex; align-items: baseline; justify-content: space-between; }
.funnel-name { font-size: var(--fs-sm); font-weight: 600; }
.funnel-num { font-size: var(--fs-h3); font-weight: 700; font-variant-numeric: tabular-nums; }

.funnel-track {
    height: 26px;
    background: var(--bg-muted);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    overflow: hidden;
}

.funnel-bar { height: 100%; border-radius: var(--radius-sm); transition: width var(--t-base) var(--ease); }

.funnel-foot { display: flex; gap: 16px; flex-wrap: wrap; font-size: var(--fs-xs); color: var(--text-muted); }
.funnel-foot b { color: var(--text-secondary); font-weight: 600; }
.funnel-lost { color: var(--warning); }


.fee-module { display: flex; flex-direction: column; gap: 10px; }


.fee-row { display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; align-items: center; gap: 8px; }
.fee-name { font-size: var(--fs-xs); color: var(--text-secondary); }

.fee-track {
    height: 18px;
    background: var(--bg-muted);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    overflow: hidden;
}
.fee-bar { height: 100%; border-radius: var(--radius-sm); transition: width var(--t-base) var(--ease); }

.fee-amt { font-size: var(--fs-xs); font-variant-numeric: tabular-nums; }

.fee-chips { display: flex; flex-wrap: wrap; gap: 8px; }





.fee-chip {
    flex: 1 1 90px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 10px;
    background: var(--bg-muted);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
}
.fee-chip span { font-size: var(--fs-2xs); color: var(--text-muted); }
.fee-chip strong { font-size: var(--fs-h3); font-variant-numeric: tabular-nums; }
.fee-chip .up { color: var(--danger); }     
.fee-chip .down { color: var(--success); }  

.fee-note { margin: 2px 0 0; font-size: var(--fs-2xs); line-height: 1.6; color: var(--text-muted); }




.heatmap-wrap { overflow-x: auto; }

.hm { display: grid; gap: 3px; min-width: 420px; }

.hm-corner, .hm-date, .hm-shop, .hm-cell {
    font-size: var(--fs-2xs);
    line-height: 1.4;
    border-radius: var(--radius-xs);
}

.hm-corner, .hm-date {
    padding: 4px 6px;
    text-align: center;
    font-weight: 600;
    color: var(--text-secondary);
    background: var(--bg-muted);
}
.hm-corner { text-align: left; }

.hm-shop {
    padding: 4px 6px;
    color: var(--text-secondary);
    white-space: normal;
    overflow-wrap: anywhere;
}

.hm-cell {
    padding: 4px 2px;
    text-align: center;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}







.hm-shop, .hm-cell, tr.drill-row { cursor: pointer; }
.hm-shop:hover { background: var(--bg-muted); border-radius: 4px; }
tr.drill-row:hover > td { background: var(--bg-muted); }
.drill-hint {
    font-size: var(--fs-2xs);
    color: var(--text-muted);
    align-self: center;
    white-space: nowrap;
}




.hm-cell-anomaly {
    box-shadow: inset 0 0 0 2px var(--danger);
    font-weight: 600;
}
.dir-high { color: var(--danger); font-weight: 600; }
.dir-low { color: var(--success); font-weight: 600; }






[data-copy="selected"].no-selection { visibility: hidden; }



.kpi-delta { font-size: var(--fs-xs); margin-top: 4px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.kpi-delta.up { color: var(--danger); }
.kpi-delta.down { color: var(--success); }




.kpi-flag {
    display: inline-block;
    margin-left: 6px;
    padding: 0 6px;
    border-radius: var(--radius-xs);
    font-size: var(--fs-xs);
    font-weight: 400;
    vertical-align: 3px;
    background: var(--danger-bg);
    color: var(--danger);
    border: 1px solid var(--danger-bd);
}


.pi-advice {
    margin: 6px 0 0;
    padding: 6px 9px;
    border-left: 3px solid var(--info);
    background: var(--bg-muted);
    border-radius: 0 var(--radius-xs) var(--radius-xs) 0;
    font-size: var(--fs-sm);
    color: var(--text-secondary);
    line-height: 1.6;
}
.pi-advice b { color: var(--text); }


.pi-acts { margin: 2px 0 0; padding-left: 18px; }
.pi-acts li { margin: 1px 0; }


.funnel-note, .heatmap-note {
    margin: 10px 0 0;
    font-size: var(--fs-2xs);
    line-height: 1.7;
    color: var(--text-muted);
}
.heatmap-note:empty { display: none; }


.page-foot { margin: 14px 0 0; font-size: var(--fs-xs); text-align: right; }
.page-foot:empty { display: none; }


.pd-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    margin-bottom: 12px;
}
.pd-meta-item { display: flex; flex-direction: column; gap: 2px; }
.pd-meta-item span { font-size: var(--fs-2xs); color: var(--text-muted); }
.pd-meta-item b { font-size: var(--fs-base); font-variant-numeric: tabular-nums; }
.pd-chart-box { height: 260px; }




@media (max-width: 1024px) {
    .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .card-grid { grid-template-columns: minmax(0, 1fr); }
    .card-grid .span-2 { grid-column: span 1; }
    .chart-box { height: 240px; }
}




@media (max-width: 768px) {
    .sidebar { transform: translateX(-100%); box-shadow: var(--shadow-lg); }
    .sidebar.open { transform: translateX(0); }
    .sidebar-mask.show { display: block; }
    .main { margin-left: 0; }
    .icon-btn { display: flex; align-items: center; justify-content: center; }
    .content { padding: 12px; }
    .topbar { padding: 0 12px; gap: 10px; }
    .topbar-title { font-size: var(--fs-h3); }
    .role-badge { display: none; }
    #user-name { display: none; }

    




    .btn,
    .input,
    .date-chip,
    .page-btn,
    .page-size,
    .op-link {
        min-height: var(--ctl-h);
    }

    



    .icon-btn {
        width: 44px;
        height: 44px;
    }

    .chk-inline,
    .metric-item {
        min-height: 32px;
    }

    .table td.col-check {
        min-height: 40px;
    }

    
    .kpi-grid { gap: 10px; }
    .kpi-card { padding: 14px; }
    .kpi-value { font-size: 20px; }

    .card { padding: 14px; }

    .filter-bar { gap: 8px; }
    .filter-bar .input { flex: 1 1 calc(50% - 4px); min-width: 0; }
    .filter-bar .btn { flex: 0 0 auto; }

    

    
    .table thead { display: none; }
    .table, .table tbody, .table tr, .table td { display: block; width: 100%; }

    .table tr {
        border: 1px solid var(--border);
        border-radius: var(--radius-sm);
        margin-bottom: 10px;
        padding: 8px 4px;
        background: #fff;
    }

    .table td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        border: none;
        padding: 6px 12px;
        white-space: normal;
        text-align: right;
    }

    .table td::before {
        content: attr(data-label);
        color: var(--text-secondary);
        font-size: var(--fs-sm);
        text-align: left;
        flex-shrink: 0;
    }

    .table td.col-check, .table td.col-op { width: auto; }
    .table td.col-op { justify-content: flex-end; gap: 12px; }
    .table td[data-label=""]::before { content: "操作"; }

    .form-grid { grid-template-columns: minmax(0, 1fr); }
    .form-grid .full { grid-column: span 1; }

    .card-head { flex-direction: column; align-items: flex-start; }
    .modal { max-width: 100%; }
    .pagination { justify-content: center; }
    .pagination .page-info { margin-right: 0; width: 100%; text-align: center; }
    .condition-row { flex-wrap: wrap; }
    .condition-row select.input, .condition-row input.input { flex: 1 1 100%; }
}

@media (max-width: 480px) {
    .kpi-grid { grid-template-columns: 1fr; }
    .login-card { padding: 24px 20px; }
}






.load-error {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 16px;
    padding: 10px 12px;
    border: 1px solid var(--danger-bd);
    border-left: 3px solid var(--danger);
    border-radius: var(--radius-sm);
    background: var(--danger-bg);
    color: var(--danger-ink);
    font-size: var(--fs-sm);
    line-height: 1.6;
}

.load-error .btn { margin-left: auto; flex-shrink: 0; }


.is-busy { position: relative; }
.is-busy::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -4px;
    height: 3px;
    border-radius: 2px;
    background: var(--primary);
    opacity: .7;
}
.is-busy > * { opacity: .5; }

.is-busy > .load-error { opacity: 1; }

@media (prefers-reduced-motion: no-preference) {
    .is-busy::before { animation: busy-pulse 1.1s ease-in-out infinite; }
}

@keyframes busy-pulse {
    0%, 100% { opacity: .3; }
    50% { opacity: .9; }
}


.picker-btn {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
}





.pi-pick-note { margin: 0; font-size: var(--fs-xs); }
.pi-pick-note:empty { display: none; }


.pi-id-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.pi-id-title h3 { margin: 0; font-size: 17px; line-height: 1.4; word-break: break-word; }
.pi-id-sub { margin-top: 4px; font-size: 12px; color: var(--text-secondary); }


.pi-warn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: var(--radius-sm);
    border-left: 3px solid var(--text-muted);
    background: var(--bg-muted);
    flex-shrink: 0;
}
.pi-warn-label { font-size: var(--fs-base); font-weight: 700; }
.pi-warn-tag { font-size: var(--fs-2xs); color: var(--text-muted); }
.pi-warn-green { border-left-color: var(--success); background: var(--success-bg); }
.pi-warn-green .pi-warn-label { color: var(--success-ink); }
.pi-warn-yellow { border-left-color: var(--warning); background: var(--warning-bg); }
.pi-warn-yellow .pi-warn-label { color: var(--warning-ink); }
.pi-warn-red { border-left-color: var(--danger); background: var(--danger-bg); }
.pi-warn-red .pi-warn-label { color: var(--danger-ink); }
.pi-warn-unknown { border-left-color: var(--text-muted); }
.pi-warn-unknown .pi-warn-label { color: var(--text-secondary); }

.pi-id-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 20px;
    margin-top: 12px;
    font-size: 12px;
    color: var(--text-secondary);
}
.pi-id-meta b { color: var(--text); font-variant-numeric: tabular-nums; }

.pi-warn-reasons {
    margin: 12px 0 0;
    padding-left: 18px;
    font-size: var(--fs-sm);
    color: var(--text-secondary);
}
.pi-warn-reasons li { margin: 3px 0; }
.pi-basis { margin: 8px 0 0; font-size: var(--fs-xs); }

.pi-slope {
    margin: 8px 0 0;
    font-size: 12px;
    color: var(--text-secondary);
}
.pi-slope b { color: var(--text); font-variant-numeric: tabular-nums; }

.pi-caliber { margin: 6px 0 0; padding-left: 18px; font-size: var(--fs-xs); line-height: 1.8; }
.pi-caliber li { margin: 2px 0; }


.pi-group { margin-bottom: 18px; }
.pi-group-name {
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 8px;
    padding-left: 8px;
    border-left: 3px solid var(--primary);
}
.pi-group .kpi-grid { margin-bottom: 0; }
.pi-group-note { margin: 8px 0 0; font-size: var(--fs-xs); }


.pi-missing { margin-top: 12px; display: grid; gap: 10px; }
.pi-missing-item {
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 10px 12px;
    background: var(--bg-muted);
}
.pi-missing-name { font-size: var(--fs-sm); font-weight: 600; }
.pi-missing-why {
    margin-left: 8px;
    font-size: var(--fs-xs);
    font-weight: 400;
    color: var(--danger);
}
.pi-missing-note { margin-top: 4px; font-size: var(--fs-xs); color: var(--text-secondary); }




.pi-w-scroll { max-height: 520px; overflow-y: auto; }
.pi-w-scroll thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--bg-muted);
    box-shadow: inset 0 -1px 0 var(--border);
}





.pi-w-scroll .table th, .pi-w-scroll .table td {
    padding-left: 8px;
    padding-right: 8px;
}

.pi-w-head { margin-left: 8px; font-size: var(--fs-xs); font-weight: 400; }
.pi-w-head b { color: var(--text); font-variant-numeric: tabular-nums; }
.pi-w-head b.pi-w-risk { color: var(--danger); }




.pi-w-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.pi-w-chips .date-chip { display: inline-flex; align-items: center; gap: 6px; }
.pi-w-chips .date-chip b { font-variant-numeric: tabular-nums; }
.pi-w-chips .date-chip.is-zero { opacity: .5; }
.pi-w-chips .date-chip.is-zero:hover { opacity: .8; }
.pi-w-chips .date-chip.lv-info.active { background: var(--info); border-color: var(--info); }
.pi-w-chips .date-chip.lv-muted.active { background: var(--text-muted); border-color: var(--text-muted); }


.pi-w-chips .date-chip.pi-w-toggle { margin-left: 10px; }


.pi-w-chips .date-chip.lv-green.active { background: var(--success); border-color: var(--success); }

.pi-w-note { margin: 0 0 10px; font-size: var(--fs-xs); }
.pi-w-note:empty { display: none; }



.pi-w-row { cursor: pointer; }
.pi-w-row:hover td { background: var(--primary-light); }
.pi-w-row:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
.pi-w-row.lv-red > td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
.pi-w-row.lv-info > td:first-child { box-shadow: inset 3px 0 0 var(--info); }
.pi-w-row.lv-muted > td:first-child { box-shadow: inset 3px 0 0 var(--text-muted); }




.pi-w-name {
    font-weight: 600;
    white-space: normal;
    word-break: break-word;
    min-width: 140px;
    max-width: 200px;
}
.pi-w-shop {
    margin-top: 2px;
    font-size: var(--fs-2xs);
    color: var(--text-secondary);
    white-space: normal;
    word-break: break-all;
}
.pi-w-tag {
    display: inline-block;
    margin: 1px 3px 1px 0;
    padding: 1px 7px;
    border-radius: var(--radius-pill);
    font-size: var(--fs-2xs);
    background: var(--bg-muted);
    color: var(--text-secondary);
    border: 1px solid var(--border);
}
.pi-w-tag.lv-red { background: var(--danger-bg); color: var(--danger-ink); border-color: var(--danger-bd); }
.pi-w-tag.lv-info { background: var(--info-bg); color: var(--info-ink); border-color: var(--info-bd); }
.pi-w-tag.lv-muted { background: var(--bg-muted); color: var(--text-secondary); }




.pi-w-tag.lv-green { background: var(--success-bg); color: var(--success-ink); border-color: var(--success-bd); }
.pi-w-tag.lv-warning { background: var(--warning-bg); color: var(--warning-ink); border-color: var(--warning-bd); }

.pi-w-tag.is-primary { font-weight: 700; }


.pi-w-flag {
    display: inline-block;
    margin-left: 4px;
    padding: 0 4px;
    border-radius: var(--radius-xs);
    font-size: var(--fs-2xs);
    background: var(--danger-bg);
    color: var(--danger);
    border: 1px solid var(--danger-bd);
}




.table td.pi-w-up { white-space: normal; min-width: 66px; max-width: 110px; }



.table td.pi-w-trend { white-space: normal; max-width: 132px; }

.pi-w-advice {
    margin-top: 3px;
    padding-top: 3px;
    border-top: 1px dashed var(--border);
    color: var(--text-secondary);
    line-height: 1.5;
}
.pi-w-advice b { color: var(--text); font-weight: 600; }


.pi-w-acts { margin: 2px 0 0; padding-left: 14px; }
.pi-w-acts li { margin: 0; }



.table td.pi-w-invest { white-space: normal; min-width: 110px; max-width: 240px; }
.pi-w-tag.pi-w-verdict { white-space: nowrap; }


.table td.pi-w-span { white-space: normal; min-width: 96px; max-width: 150px; }


.table td.pi-w-tags { white-space: normal; max-width: 120px; }

.pi-w-tier {
    display: inline-block;
    padding: 0 6px;
    border-radius: var(--radius-xs);
    font-size: var(--fs-2xs);
    font-weight: 600;
    background: var(--bg-muted);
    color: var(--text-secondary);
    border: 1px solid var(--border);
}
.pi-w-tier.lv-info { background: var(--info-bg); color: var(--info-ink); border-color: var(--info-bd); }

.pi-w-dir { font-size: var(--fs-2xs); color: var(--text-secondary); white-space: nowrap; }
.pi-w-dir.is-up, .pi-w-dir.is-down { color: var(--text); font-weight: 600; }
.pi-w-dir.is-unknown { color: var(--text-muted); }

.pi-w-muted { color: var(--text-muted); }

.pi-w-row td .up { color: var(--danger); }
.pi-w-row td .down { color: var(--success); }


.pi-w-row td.num { text-align: right; font-variant-numeric: tabular-nums; }




.pi-w-sub { margin-top: 2px; font-size: var(--fs-2xs); color: var(--text-muted); white-space: normal; }























.table td.pi-w-why { white-space: normal; min-width: 200px; max-width: 560px; }
.pi-w-reason {
    display: flex;
    gap: 6px;
    font-size: var(--fs-xs);
    line-height: 1.5;
    color: var(--text-secondary);
}
.pi-w-reason + .pi-w-reason { margin-top: 3px; }
.pi-w-no { flex: none; color: var(--text-muted); }

.pi-w-criteria { margin-top: 10px; font-size: var(--fs-xs); color: var(--text-secondary); }
.pi-w-criteria:empty { display: none; }
.pi-w-criteria-title { font-weight: 600; color: var(--text); }
.pi-w-criteria ul { margin: 6px 0 0; padding-left: 18px; }
.pi-w-criteria li { margin: 2px 0; line-height: 1.5; }


.pi-w-criteria .pi-w-tier-item { margin: 7px 0; }
.pi-w-trunc { margin: 8px 0 0; font-size: var(--fs-xs); }

@media (max-width: 768px) {
    .pi-w-name { max-width: none; }
    





    .table td.pi-w-why {
        display: block;
        min-width: 0;
        max-width: none;
        text-align: left;
    }
    .table td.pi-w-why::before { display: block; margin-bottom: 4px; }
}
















.sb-topbar { margin: 0 0 14px; }
.sb-topbar h2 {
    margin: 0 0 4px;
    font-size: 20px;
    font-weight: 600;
    color: var(--text);
}
.sb-subtitle {
    margin: 0;
    font-size: var(--fs-xs);
    line-height: 1.7;
    color: var(--text-muted);
}




.sb-tabs {
    display: flex;
    gap: 6px;
    margin: 0 0 16px;
    border-bottom: 1px solid var(--border);
}
.sb-tab {
    padding: 9px 22px;
    background: transparent;
    border: 1px solid var(--border);
    border-bottom: none;
    border-radius: var(--radius-sm) var(--radius-sm) 0 0;
    font-size: var(--fs-sm);
    color: var(--text-secondary);
    cursor: pointer;
    transition: color var(--t-base) var(--ease);
}
.sb-tab:hover { color: var(--primary); }
.sb-tab.active {
    color: var(--primary);
    border-color: var(--primary);
    font-weight: 600;
    box-shadow: inset 0 -2px 0 var(--primary);
    background: var(--card);
}
.sb-pane { display: none; }
.sb-pane.active { display: grid; }



.sb-empty .sb-tabs { display: none; }



.sb-sub { min-height: 220px; box-sizing: border-box; }

.sb-note {
    margin: 14px 0 0;
    font-size: var(--fs-2xs);
    line-height: 1.7;
    color: var(--text-muted);
}
.sb-note:empty { display: none; }

.sb-subgrid {
    display: grid;
    
    grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr));
    gap: 14px;
}

.sb-sub {
    min-width: 0;
    padding: 12px;
    background: var(--bg-muted);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
}

.sb-sub-head {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px dashed var(--border);
}
.sb-sub-head b {
    font-size: var(--fs-xs);
    overflow-wrap: anywhere;   
}
.sb-sub-head .muted { font-size: var(--fs-2xs); }



.sb-sub-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 68px 46px;
    align-items: center;
    gap: 6px;
    font-size: var(--fs-2xs);
}
.sb-sub-row + .sb-sub-row { margin-top: 5px; }

.sb-sub-name {
    min-width: 0;
    overflow-wrap: anywhere;
    line-height: 1.35;
    color: var(--text-secondary);
}

.sb-sub-track {
    height: 12px;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xs);
    overflow: hidden;
}
.sb-sub-fill {
    display: block;
    height: 100%;
    background: var(--primary);
    border-radius: var(--radius-xs);
    transition: width var(--t-base) var(--ease);
}

.sb-sub-val {
    text-align: right;
    font-variant-numeric: tabular-nums;
    color: var(--text);
}

@media (max-width: 768px) {
    
    .sb-subgrid { grid-template-columns: minmax(0, 1fr); }
}






.range-empty {
    margin: 0 0 16px;
    padding: 10px 12px;
    border: 1px solid var(--warning-bd);
    border-left: 3px solid var(--warning);
    border-radius: var(--radius-sm);
    background: var(--warning-bg);
    color: var(--warning-ink);
    font-size: var(--fs-sm);
    line-height: 1.7;
}
.range-empty strong { font-weight: 600; }




.sb-empty .card-grid { display: none; }









.nr-version {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
    padding: 10px 14px; margin-bottom: 12px;
    border: 1px solid var(--line); border-radius: var(--radius-sm);
    background: var(--paper-2); font-size: var(--fs-sm); color: var(--ink-2);
}
.nr-version .nr-vitem { display: inline-flex; align-items: center; gap: 6px; }
.nr-version code {
    padding: 1px 6px; border: 1px solid var(--line); border-radius: 4px;
    background: var(--paper-0); color: var(--ink-1); font-size: var(--fs-xs);
}
.nr-vspacer { flex: 1 1 auto; }

.nr-progress { margin: 4px 0 10px; }
.nr-bar { height: 6px; border-radius: 99px; background: var(--paper-3); overflow: hidden; }
.nr-bar > span {
    display: block; width: 35%; height: 100%; border-radius: 99px;
    background: var(--seal-5); animation: nr-flow 1.2s ease-in-out infinite;
}
@keyframes nr-flow {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(300%); }
}
.nr-log {
    max-height: 200px; overflow: auto; margin: 8px 0 0; padding: 10px;
    border: 1px solid var(--line); border-radius: var(--radius-sm);
    background: var(--paper-2); color: var(--ink-2);
    font-size: var(--fs-xs); line-height: 1.6; white-space: pre-wrap; word-break: break-all;
}
#nr-fail { margin-top: 10px; }
#nr-fail .op-link { margin-left: 8px; }
#nr-error:empty { display: none; }


.nr-detail > td { background: var(--paper-2); padding: 12px 14px; }
.nr-detail-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 8px 20px;
}
.nr-di { display: flex; gap: 8px; font-size: var(--fs-sm); line-height: 1.6; }
.nr-di-l { flex: 0 0 84px; color: var(--ink-3); }
.nr-di-v { color: var(--ink-1); word-break: break-all; }


@keyframes nr-flash {
    0%   { background: var(--seal-1); }
    100% { background: transparent; }
}
.table tbody tr.nr-flash > td { animation: nr-flash 1.8s ease-out; }


.drawer-mask {
    position: fixed; inset: 0; z-index: 90;
    display: flex; justify-content: flex-end;
    background: var(--overlay);
}
.drawer {
    width: min(560px, 100%); height: 100%;
    display: flex; flex-direction: column;
    background: var(--paper-0); box-shadow: var(--shadow-lg);
    animation: nr-slide-in .18s ease-out;
}
@keyframes nr-slide-in {
    from { transform: translateX(28px); opacity: .55; }
    to   { transform: none; opacity: 1; }
}
.drawer-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 18px; border-bottom: 1px solid var(--line);
}
.drawer-head h3 { margin: 0; font-size: var(--fs-h2); }
.drawer-body { flex: 1 1 auto; overflow-y: auto; padding: 18px; }
.drawer-foot {
    display: flex; justify-content: flex-end; gap: 10px;
    padding: 12px 18px; border-top: 1px solid var(--line);
    background: var(--paper-1);
}
body.nr-drawer-open { overflow: hidden; }


.nr-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.nr-hint { display: block; margin-top: 4px; font-size: var(--fs-xs); color: var(--ink-3); }
.nr-hint code { padding: 0 2px; }
.nr-hint.nr-bad, .nr-bad { color: var(--danger); }
.nr-form-note { margin: 4px 0 0; }


.nr-counts { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
.nr-count {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--radius-sm);
    background: var(--paper-2);
}
.nr-count strong { font-size: var(--fs-h2); font-variant-numeric: tabular-nums; }
.nr-prune { display: block; margin: 10px 0; font-size: var(--fs-sm); }
.nr-prune input { margin-right: 6px; }
.nr-conflicts { margin: 10px 0; font-size: var(--fs-sm); }
.nr-conflicts summary { cursor: pointer; color: var(--primary-ink); }

.nr-confirm-kv { line-height: 1.9; }
.nr-warn { color: var(--warning-ink); }

@media (max-width: 768px) {
    .drawer { width: 100%; }
    .nr-row { grid-template-columns: 1fr; }
    .nr-version { font-size: var(--fs-xs); }
}








.promo-scope{ margin-left:8px; font-size:var(--fs-xs); font-weight:400; }
.promo-scope b{ color:var(--text); font-variant-numeric:tabular-nums; }
.promo-check{ display:inline-flex; align-items:center; gap:6px; font-size:var(--fs-sm); color:var(--text-secondary); white-space:nowrap; }
.promo-check input{ accent-color:var(--seal-5); }





#page-promo .promo-table tbody td{ white-space: normal; }



#page-promo .promo-table tbody td .promo-cellv{ display:block; min-width:0; }




.promo-delist{
    display:inline-block; margin-left:4px; padding:0 4px;
    font-size:var(--fs-2xs); line-height:1.6;
    color:var(--danger-ink); background:var(--danger-bg);
    border:1px solid var(--danger-bd); border-radius:3px;
    white-space:nowrap; vertical-align:1px;
}
.promo-row-act{ display:block; margin-top:2px; font-size:var(--fs-2xs); color:var(--seal-5);
               background:var(--paper-2); border-radius:4px; padding:0 4px;
               overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.promo-code-text{ display:block; font-weight:600; color:var(--ink-1);
                  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.promo-count{ font-size:var(--fs-xs); padding:6px 2px 8px; }




.promo-selbar{ display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap;
  position:fixed; left:50%; bottom:var(--sp-5); transform:translateX(-50%);
  z-index:45; width:min(560px, calc(100vw - 2 * var(--sp-5)));
  padding:var(--sp-2) var(--sp-4); background:var(--card);
  border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow-lg); }
.promo-selbar.hidden{ display:none; }
.promo-sel-text{ margin-right:auto; font-size:var(--fs-xs); color:var(--text-secondary); }
.promo-sel-text b{ color:var(--text); font-variant-numeric:tabular-nums; }

#promo-panel-list.has-sel, #promo-panel-deleted.has-sel{
  padding-bottom:calc(var(--sp-10) + var(--sp-4)); }
@media (max-width:640px){
  .promo-selbar{ left:var(--sp-4); right:var(--sp-4); transform:none; width:auto; }
}



.promo-pick-table-wrap{ margin:var(--sp-3) 0; max-height:320px; overflow:auto;
  border:1px solid var(--border); border-radius:var(--radius-sm); }
.promo-pick-table-wrap:focus-visible{ outline:2px solid var(--select-border); outline-offset:2px; }
.promo-pick-table{ width:100%; min-width:680px; border-collapse:separate; border-spacing:0;
  font-size:var(--fs-xs); }
.promo-pick-table th{ position:sticky; top:0; z-index:1; background:var(--card);
  text-align:left; font-weight:var(--fw-semi); color:var(--text-secondary);
  padding:var(--sp-2) var(--sp-3); border-bottom:1px solid var(--border); white-space:nowrap; }

.promo-pick-table td{ padding:var(--sp-2) var(--sp-3); border-bottom:1px solid var(--line);
  vertical-align:top; }
.promo-pick-table tbody tr:last-child td{ border-bottom:0; }
.promo-pick-table .num{ text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.promo-pick-table .promo-pick-code,
.promo-pick-table .promo-pick-sku{ max-width:200px; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; }
.promo-pick-ack{ display:flex; align-items:center; gap:var(--sp-2);
  margin:var(--sp-4) 0 var(--sp-2); font-size:var(--fs-sm); color:var(--text); }
.promo-pick-reason{ display:block; font-size:var(--fs-xs); color:var(--text-secondary); }
.promo-pick-reason .input{ display:block; width:100%; margin-top:var(--sp-1); }
.promo-row{ cursor:pointer; }
.promo-row:hover{ background:var(--paper-1); }
.promo-row.is-open{ background:var(--paper-1); }
.promo-row.is-open .promo-caret{ transform:rotate(180deg); }
.promo-caret{ display:inline-block; color:var(--ink-3); transition:transform .15s; }
.promo-min-store{ display:block; margin-top:1px; font-size:var(--fs-2xs); color:var(--text-secondary);
                  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.promo-min-store.tie{ color:var(--warning-ink); font-weight:600; }
.promo-spread{ color:var(--danger-ink); font-size:var(--fs-xs); font-variant-numeric:tabular-nums; }
.promo-same{ color:var(--text-secondary); font-size:var(--fs-xs); }


.promo-spread-sub{ display:block; font-size:var(--fs-2xs); color:var(--ink-3); font-variant-numeric:tabular-nums; }

.promo-price{ font-variant-numeric:tabular-nums; font-weight:700; }
.promo-st{ margin:0 4px 2px 0; }
.promo-status-cell{ line-height:2; }
.promo-detail > td{ padding:0 !important; background:var(--paper-1); }
.promo-detail-body{ padding:10px 14px 14px; }
.promo-detail-head{ font-size:var(--fs-xs); color:var(--text-secondary); margin:2px 0 6px; }
.promo-stores{ background:var(--paper-0); }
.promo-stores th{ font-size:var(--fs-2xs); }
.promo-stores td{ font-size:var(--fs-sm); vertical-align:top; }
.promo-stores tr.is-min td{ background:var(--warning-bg); }
.promo-stores tr.is-min td:first-child{ box-shadow:inset 3px 0 0 var(--warning-ink); }



.promo-stores tr.is-delist td{ background:var(--danger-bg); }
.promo-stores tr.is-delist td:first-child{ box-shadow:inset 3px 0 0 var(--danger-ink); }
.promo-delist-head{
    margin:0 0 var(--sp-2); padding:var(--sp-1) var(--sp-2);
    font-size:var(--fs-xs); line-height:1.6;
    color:var(--danger-ink); background:var(--danger-bg);
    border-left:3px solid var(--danger-ink);
}
.promo-store-name{ font-weight:600; display:inline-block; max-width:150px; overflow:hidden;
                   text-overflow:ellipsis; white-space:nowrap; vertical-align:bottom; }


.promo-store-name.rep{ font-weight:400; color:var(--text-secondary); }
.promo-act{ display:inline-block; max-width:110px; overflow:hidden; text-overflow:ellipsis;
            white-space:nowrap; font-size:var(--fs-2xs); color:var(--text-secondary);
            background:var(--paper-2); border-radius:4px; padding:0 5px; }
.promo-sku{ display:block; font-size:var(--fs-xs); color:var(--ink-2); max-width:220px;
            overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.promo-sku-id{ display:block; font-size:var(--fs-2xs); color:var(--ink-3);
               font-variant-numeric:tabular-nums; }
.promo-reason{ display:block; font-size:var(--fs-2xs); color:var(--danger-ink); max-width:200px;
               overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.promo-code-sub{ display:block; margin-top:2px; font-size:var(--fs-2xs); color:var(--text-secondary); font-weight:400; }
.promo-code-sub b{ color:var(--warning-ink); }
.promo-goods{ max-width:380px; }
.promo-title{ font-size:var(--fs-sm); line-height:1.4; }
.promo-goods-sub{ font-size:var(--fs-2xs); color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.promo-spec{ display:inline-block; margin-left:6px; padding:0 5px; border-radius:4px; background:var(--paper-2);
             color:var(--ink-3); font-size:var(--fs-2xs); font-weight:400; vertical-align:1px; white-space:nowrap; }
.promo-land{ font-variant-numeric:tabular-nums; font-weight:700; }
.promo-land.low{ color:var(--warning-ink); }



#page-promo .promo-table td[data-label="最低到手"] .promo-land.low{ color:var(--ink-2); font-weight:600; }
.promo-low{ display:inline-block; background:var(--warning-bg); color:var(--warning-ink);
            border:1px solid var(--warning-bd); border-radius:4px; padding:0 6px;
            font-size:var(--fs-2xs); font-weight:600; line-height:1.7; white-space:nowrap; }
.promo-gap{ font-size:var(--fs-xs); color:var(--text-secondary); font-variant-numeric:tabular-nums; }

.promo-cmp-head{ font-size:var(--fs-sm); color:var(--text-secondary); margin-bottom:8px; }
.promo-cmp td{ vertical-align:top; }
.promo-cmp tr.is-min td{ background:var(--warning-bg); }
.promo-cmp tr.is-min td:first-child{ box-shadow:inset 3px 0 0 var(--warning-ink); }
.promo-cmp-store{ display:flex; align-items:center; gap:6px; font-weight:600; white-space:nowrap; }


mark{ background:#fbe7b8; color:inherit; border-radius:2px; padding:0 1px; }









#page-promo .promo-table th.num,
#page-promo .promo-table td.num{ text-align:right; }








@media (max-width:1279px){
    #page-promo .promo-table thead th{ white-space: normal; line-height: 1.35; }
}
@media (min-width:1280px){
    


    #page-promo .table-scroll{ overflow:visible; }
    #page-promo .promo-table thead th{ z-index:5; }
}



#page-promo .promo-table .tag{ font-size:var(--fs-2xs); }
.promo-spread{ font-size:var(--fs-sm); }
.promo-same{ font-size:var(--fs-sm); }



.promo-row-act{ color:var(--ink-3); background:transparent; border-radius:0;
                padding:0; font-weight:400; }


#page-promo .promo-table tbody tr.promo-row.is-zebra{ background:var(--paper-1); }
#page-promo .promo-table tbody tr.promo-row:hover{ background:var(--paper-2); }


#page-promo .promo-title{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.promo-th-hint{ display:inline-block; margin-left:3px; color:var(--ink-3);
                font-size:var(--fs-2xs); font-weight:400; cursor:help; }








.promo-status-cell{ line-height:1.6; }
.promo-st-n{ font-size:var(--fs-2xs); color:var(--text-secondary);
             font-variant-numeric:tabular-nums; }
.promo-st-n.is-bad{ color:var(--danger-ink); font-weight:600; }
.promo-st-sep{ margin:0 4px; color:var(--line-strong); font-size:var(--fs-2xs); }

@media (max-width:768px){
    

    #page-promo #promo-q{ flex:1 1 100%; }
    #page-promo .date-chips{ flex:1 1 100%; flex-wrap:wrap; }
    #page-promo .filter-bar > .input,
    #page-promo .filter-bar > .btn{ flex:1 1 auto; min-width:0; }
    #page-promo .table-scroll{ overflow:visible; }
    #page-promo .promo-table,
    #page-promo .promo-table tbody,
    #page-promo .promo-table tr,
    #page-promo .promo-table td{ display:block; }
    #page-promo .promo-table thead{ display:none; }
    #page-promo .promo-table tbody tr{
        border:1px solid var(--line); border-radius:10px; margin:10px 0; padding:8px 12px; background:var(--paper-0);
    }
    


    #page-promo .promo-table tbody td{
        display:flex; align-items:baseline; justify-content:space-between; gap:12px;
        border:0; padding:4px 0; font-size:var(--fs-sm);
    }
    #page-promo .promo-table tbody td::before{
        content:attr(data-label); color:var(--text-secondary); font-size:var(--fs-xs); flex:0 0 auto;
    }
    #page-promo .promo-table tbody td:first-child{
        display:block; padding:2px 0 7px; margin-bottom:4px; border-bottom:1px dashed var(--line);
    }
    #page-promo .promo-table tbody td:first-child::before{ display:none; }
    #page-promo .promo-goods{ display:block; max-width:none; }
    #page-promo .promo-goods::before{ display:block; margin-bottom:3px; }
    #page-promo .promo-title,
    #page-promo .promo-goods-sub{ text-align:left; white-space:normal; }
    #page-promo .promo-code-text{ font-size:var(--fs-md); }
    
    #page-promo .promo-table tr.promo-detail{ border:0; background:transparent; padding:0; margin:-4px 0 12px; }
    #page-promo .promo-table tr.promo-detail > td{ display:block; padding:0; }
    #page-promo .promo-detail-body{ padding:8px 10px 12px; }
    
    #page-promo .promo-stores,
    #page-promo .promo-stores tbody,
    #page-promo .promo-stores tr,
    #page-promo .promo-stores td{ display:block; }
    #page-promo .promo-stores thead{ display:none; }
    #page-promo .promo-stores tr{ border:1px solid var(--line); border-radius:8px; margin:6px 0; padding:6px 10px; }
    #page-promo .promo-stores td{ display:flex; justify-content:space-between; gap:12px; border:0; padding:3px 0; }
    #page-promo .promo-stores td::before{ content:attr(data-label); color:var(--text-secondary); font-size:var(--fs-xs); }
}


#promo-table{ table-layout:fixed; }



#promo-table th, #promo-table td{ padding-left:8px; padding-right:8px; }



#promo-table td[data-label="总库存"]{ padding-left:2px; }
#promo-table .promo-code-sub{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#promo-table td:nth-child(2){ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#promo-table .promo-goods{ max-width:none; }




@media (max-width:768px){
    #page-promo .promo-table tbody td.promo-goods{ display:block; text-align:left; }
    #page-promo .promo-table tbody td:first-child{ text-align:left; }
    #page-promo .promo-table tbody td.promo-goods .promo-title,
    #page-promo .promo-table tbody td.promo-goods .promo-goods-sub{ display:block; }
}



.promo-cellv{ display:inline-block; }
.promo-min-wrap{ text-align:left; }
@media (max-width:768px){
    #page-promo .promo-table tbody td .promo-cellv{ text-align:right; }
    #page-promo .promo-table tbody td .promo-min-store{ text-align:right; }
    #page-promo .promo-table tbody td .promo-st{ display:inline-block; }
}








:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}
.sidebar :where(a, button):focus-visible { outline-color: #fff; }




.nav-item.active { border-left-width: 6px; padding-left: 17px; }
.nav-icon { width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; }
.nav-icon svg { width: 18px; height: 18px; display: block; }





#kpi-grid { display: flex; flex-direction: column; gap: 10px; }
#kpi-grid .kpi-card.is-primary { padding: 16px 20px; }
#kpi-grid .kpi-card.is-primary .kpi-value { font-size: var(--fs-3xl); }
#kpi-grid .kpi-compact { display: flex; flex-wrap: wrap; gap: 10px; min-width: 0; }
#kpi-grid .kpi-compact .kpi-card { flex: 1 1 0; min-width: 0; padding: 11px 13px; }
#kpi-grid .kpi-compact .kpi-label { font-size: var(--fs-xs); margin-bottom: 3px; }
#kpi-grid .kpi-compact .kpi-value { font-size: var(--fs-xl); }
#kpi-grid .kpi-compact .kpi-extra { margin-top: 2px; }





.kpi-more { display: none; }
@media (max-width: 768px) {
    #kpi-grid.is-collapsed .kpi-compact .kpi-card:nth-child(n+5) { display: none; }
    .kpi-more {
        display: block; width: 100%; height: 40px; margin-top: 10px;
        border: 1px solid var(--line); border-radius: var(--r-2);
        background: var(--paper); color: var(--text-2);
        font-size: var(--fs-sm); cursor: pointer;
    }
    .kpi-more:hover { color: var(--text); border-color: var(--primary); }
}




#sb-ob-kpi, #sb-od-kpi { display: flex; flex-wrap: wrap; }
#sb-ob-kpi .kpi-card, #sb-od-kpi .kpi-card { flex: 1 1 170px; min-width: 0; }


.input[type="file"] { height: auto; padding: 6px 8px; }
.input[type="file"]::file-selector-button {
    margin-right: 10px; padding: 5px 12px; border: 1px solid var(--line-strong);
    border-radius: var(--r-2); background: var(--paper-2); color: var(--text);
    font-size: var(--fs-sm); cursor: pointer;
}
.input[type="file"]::file-selector-button:hover { background: var(--select-bg); }


.cell-clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; overflow-wrap: anywhere; }
.table th.col-name, .table td.col-name { min-width: 220px; max-width: 340px; }
.table td.nr-key, .table td.nr-base { max-width: 260px; }


.copy-menu { position: relative; display: inline-flex; }
.copy-toggle { display: inline-flex; align-items: center; gap: 4px; }
.copy-menu.open .copy-toggle { background: var(--select-bg); }
.copy-dd { display: none; position: absolute; right: 0; top: calc(100% + 4px);
    z-index: var(--z-dropdown); min-width: 132px; padding: 4px; background: var(--card);
    border: 1px solid var(--line-strong); border-radius: var(--r-2); box-shadow: var(--shadow-lg); }
.copy-menu.open .copy-dd { display: block; }
.copy-dd button { display: block; width: 100%; padding: 7px 10px; border: 0; border-radius: var(--r-1);
    background: none; color: var(--text); font-size: var(--fs-sm); text-align: left; cursor: pointer; }
.copy-dd button:hover { background: var(--paper-2); }

@media (max-width: 1024px) {
    #kpi-grid .kpi-compact .kpi-card { flex: 1 1 140px; }
}
@media (max-width: 768px) {
    .filter-bar .date-chip { height: 40px; }
    #kpi-grid .kpi-compact .kpi-card { flex: 1 1 45%; }
}






.pd-spine-wrap { margin-bottom: var(--sp-4); }


.pd-spine { display: flex; gap: var(--sp-2); overflow-x: auto; padding-bottom: 2px; }
.pd-day { flex: 0 0 auto; min-width: 148px; padding: 9px 12px 8px; text-align: left;
    background: var(--card); border: 1px solid var(--line); border-radius: var(--r-2); }
.pd-day-date { display: block; font-size: var(--fs-sm); font-weight: var(--fw-semi); color: var(--ink-1);
    font-variant-numeric: tabular-nums; }
.pd-day-num { display: block; margin-top: 2px; font-size: var(--fs-xs); color: var(--ink-2);
    font-variant-numeric: tabular-nums; }
.pd-day-sub { display: block; font-size: var(--fs-2xs); color: var(--ink-3); }
.pd-spine-note { margin-top: 6px; font-size: var(--fs-xs); color: var(--ink-3); }
.pd-spine-note strong { color: var(--ink-2); }










.pd-range-bar { margin-bottom: var(--sp-3); align-items: center; }

.pd-scope { margin-left: 8px; font-weight: 400; font-size: var(--fs-sm);
    font-variant-numeric: tabular-nums; }


.pd-chart-box { position: relative; height: 280px; padding: 4px 2px 0; }
.pd-chart-box canvas { max-width: 100%; }
.pd-chart-empty { position: absolute; inset: 0; display: flex; align-items: center;
    justify-content: center; color: var(--ink-3); font-size: var(--fs-sm);
    background: var(--card); text-align: center; padding: 0 var(--sp-4); }
.pd-kpis-empty { grid-column: 1 / -1; }
.pd-sku-note { margin: 6px 0 0; font-size: var(--fs-2xs); }

.pd-kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-bottom: var(--sp-4); border: 1px solid var(--line); border-radius: var(--r-2);
    background: var(--card); overflow: hidden; }
.pd-kpi { padding: 12px 14px 11px; border-right: 1px solid var(--line); min-width: 0; }
.pd-kpi:last-child { border-right: 0; }
.pd-kpi-label { display: block; font-size: var(--fs-2xs); color: var(--ink-3); letter-spacing: .02em; }
.pd-kpi-value { display: block; margin-top: 2px; font-size: var(--fs-2xl); font-weight: var(--fw-semi);
    color: var(--ink-1); font-variant-numeric: tabular-nums; line-height: var(--lh-tight);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pd-kpi-sub { display: block; margin-top: 1px; font-size: var(--fs-2xs); color: var(--ink-3);
    font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.pd-table { table-layout: fixed; width: 100%; }

.pd-shop-scroll { max-height: 430px; overflow-y: auto; }
.pd-shop-scroll thead th { position: sticky; top: 0; z-index: 2; background: var(--paper-2); }
.pd-table th { white-space: nowrap; }
.pd-table td, .pd-table th { overflow: hidden; }
.pd-table td { font-variant-numeric: tabular-nums; }
.pd-table .pd-store { font-weight: var(--fw-semi); color: var(--ink-1); }
.pd-shop-row { cursor: pointer; }
.pd-shop-row:hover td { background: var(--paper-1); }
.pd-shop-row.active td { background: var(--seal-1); }
.pd-shop-row.active .pd-store { color: var(--seal-6); }
.pd-hint { margin-left: 3px; font-size: var(--fs-2xs); color: var(--ink-4); cursor: help; }
.pd-warn { color: var(--seal-6); font-weight: var(--fw-semi); }
.pd-muted { color: var(--ink-3); }

.pd-goods { min-width: 0; }
.pd-goods-title { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; color: var(--ink-1); }
.pd-goods-sub { display: block; margin-top: 1px; font-size: var(--fs-2xs); color: var(--ink-3);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-sub { font-size: var(--fs-2xs); color: var(--ink-3); }

.pd-prod-row { cursor: pointer; }
.pd-prod-row:hover td { background: var(--paper-1); }
.pd-prod-row.open td { background: var(--paper-2); }
.pd-skuwrap > td { padding: 0 !important; background: var(--paper-1); }
.pd-sku-box { padding: 6px 14px 12px; border-left: 3px solid var(--seal-2); }


.pd-sku-table { font-size: var(--fs-xs); background: transparent; }

.pd-sku-table th { font-size: var(--fs-2xs); color: var(--ink-3); background: transparent; }

.pd-sku-table td { font-size: var(--fs-xs); }

.pd-state { display: inline-flex; align-items: center; padding: 0 7px; border-radius: 999px;
    border: 1px solid var(--line-strong); font-size: var(--fs-2xs); line-height: 18px;
    color: var(--ink-2); background: var(--paper-1); white-space: nowrap; }
.pd-state.ok { color: var(--ink-2); }
.pd-state.zero_order { color: var(--warn); border-color: var(--line-strong); background: var(--paper-2); }
.pd-state.zero_click { color: var(--info); border-color: var(--line-strong); background: var(--paper-2); }
.pd-state.zero_exposure { color: var(--seal-6); border-color: var(--seal-2); background: var(--seal-1); }
.pd-legend { display: inline-flex; gap: 6px; align-items: center; }

.pd-base-label { font-size: var(--fs-xs); color: var(--ink-3); }
.pd-base-range { display: inline-flex; gap: 4px; align-items: center; }
.pd-base-range input { width: 132px; }
.pd-change-meta { margin: 0 0 8px; font-size: var(--fs-xs); color: var(--ink-3);
    font-variant-numeric: tabular-nums; }
.pd-change-sum { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 0 10px; }
.pd-chip { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 999px;
    border: 1px solid var(--line); background: var(--paper-1); font-size: var(--fs-2xs);
    color: var(--ink-2); white-space: nowrap; }
.pd-chip b { font-variant-numeric: tabular-nums; color: var(--ink-1); }
.pd-chip-up { color: var(--up); border-color: var(--seal-2); background: var(--seal-1); }
.pd-chip-down { color: var(--down); border-color: var(--line-strong); background: var(--paper-2); }
.pd-chip-new { color: var(--seal-6); border-color: var(--seal-2); background: var(--seal-1); }
.pd-chip-gone { color: var(--ink-3); }
.pd-chip-zero_to_order { color: var(--down); border-color: var(--line-strong); background: var(--paper-2); }
.pd-chip-order_to_zero { color: var(--up); border-color: var(--seal-2); background: var(--seal-1); }

.pd-empty { padding: 26px 16px; text-align: center; color: var(--ink-3); font-size: var(--fs-sm); }
.pd-empty-tall { padding: 44px 16px; }
.pd-defs { margin-top: var(--sp-4); line-height: var(--lh-read); }
.pd-defs strong { color: var(--ink-2); }

@media (max-width: 1200px) { .pd-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .pd-kpi:nth-child(3n) { border-right: 0; } }
@media (max-width: 768px) { .pd-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pd-kpi:nth-child(2n) { border-right: 0; }
    .pd-kpi-value { font-size: var(--fs-xl); } }


#pd-change-table td:last-child { overflow: visible; white-space: normal; line-height: 1.5; }
#pd-change-table td:nth-child(3) { overflow: hidden; }


.pd-shop-row.missing td { color: var(--ink-3); background: var(--paper-1); }
.pd-shop-row.missing .pd-store { font-weight: var(--fw-reg); color: var(--ink-3); }
.pd-state.missing { color: var(--ink-3); border-style: dashed; background: transparent; }










.nr-top { padding: 14px 16px; }
.nr-top-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
.nr-top .nr-version { flex: 1 1 520px; min-width: 0; padding: 0; margin: 0; border: 0; background: none; }
.nr-top-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.nr-kicker {
    font-size: var(--fs-2xs); letter-spacing: .08em; color: var(--ink-3);
    text-transform: uppercase; white-space: nowrap;
}
.nr-note { margin-top: 8px; }
.nr-note summary { cursor: pointer; color: var(--ink-3); font-size: var(--fs-xs); }
.nr-note p { margin: 6px 0 0; font-size: var(--fs-xs); line-height: 1.6; max-width: 96ch; }


.nr-views { display: flex; gap: 2px; margin: 4px 0 12px; border-bottom: 1px solid var(--line); }
.nr-view-tab {
    font: inherit; font-size: var(--fs-sm); color: var(--ink-2);
    padding: 9px 14px; border: 0; border-bottom: 2px solid transparent;
    background: none; cursor: pointer;
}
.nr-view-tab:hover { color: var(--ink-1); }
.nr-view-tab.active { color: var(--seal-6); border-bottom-color: var(--seal-5); font-weight: var(--fw-semi); }
.nr-view-tab { white-space: nowrap; }
.nr-count {
    display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 4px;
    border-radius: var(--r-pill); background: var(--paper-2); color: var(--ink-3);
    font-size: var(--fs-2xs); line-height: 18px; text-align: center;
}
.nr-view-tab.active .nr-count { background: var(--seal-1); color: var(--seal-7); }


.nr-split {
    display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
    gap: 12px; align-items: start;
}
.nr-rail { padding: 0; overflow: hidden; }
.nr-rail-head { display: flex; gap: 8px; padding: 10px; border-bottom: 1px solid var(--line); }
.nr-rail-head .input:first-child { flex: 1 1 auto; min-width: 0; }
.nr-rail-head .input:last-child { flex: 0 0 112px; }
.nr-groups { max-height: calc(100vh - 330px); min-height: 240px; overflow: auto; }
.nr-group {
    display: block; width: 100%; text-align: left; font: inherit;
    padding: 10px 12px; border: 0; border-left: 3px solid transparent;
    border-bottom: 1px solid var(--line); background: none; cursor: pointer;
}
.nr-group:hover { background: var(--paper-1); }
.nr-group.active { background: var(--seal-1); border-left-color: var(--seal-5); }
.nr-group-base {
    display: block; font-size: var(--fs-sm); font-weight: var(--fw-semi); line-height: 1.4;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.nr-group-meta { display: block; margin-top: 2px; color: var(--ink-3); font-size: var(--fs-2xs); }
.nr-group-modes { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.nr-rail-foot {
    padding: 8px 12px; border-top: 1px solid var(--line);
    color: var(--ink-4); font-size: var(--fs-2xs);
}
.nr-chip {
    display: inline-block; padding: 1px 7px; border: 1px solid var(--line);
    border-radius: var(--r-pill); background: var(--paper-2); color: var(--ink-3);
    font-size: var(--fs-2xs); white-space: nowrap;
}
.nr-detail { padding: 14px 16px; min-width: 0; }
.nr-detail-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: flex-start; }
.nr-detail-back { display: none; margin-bottom: 8px; }
.nr-base { font-size: var(--fs-xl); font-weight: var(--fw-semi); line-height: 1.35; word-break: break-all; }
.nr-meta { margin-top: 3px; color: var(--ink-3); font-size: var(--fs-sm); }
.nr-detail-actions { display: flex; flex-wrap: wrap; gap: 8px; }


.nr-editor {
    margin: 14px 0 16px; padding: 12px 14px;
    border: 1px solid var(--line-strong); border-radius: var(--r-3); background: var(--paper-2);
}
.nr-editor .nr-hint, #nr-view-inbox .nr-hint, .nr-detail .nr-hint { display: inline; margin: 0; }
.nr-editor-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; align-items: baseline; }
.nr-editor-target { color: var(--ink-3); font-size: var(--fs-xs); min-width: 0; }
.nr-editor-target b { color: var(--ink-1); font-weight: var(--fw-semi); }
.nr-formula-grid { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 4px; margin-top: 8px; }
.nr-token {
    display: flex; flex-direction: column; gap: 2px; min-width: 0;
    padding: 4px 8px; border: 1px dashed var(--line-strong); border-radius: var(--r-2);
    background: var(--paper-0);
}
.nr-token > span { font-size: var(--fs-2xs); color: var(--ink-4); }
.nr-token .input { border: 0; padding: 2px 0; font-size: var(--fs-md); font-weight: var(--fw-semi); min-width: 0; }
.nr-token .input:focus { outline: 1px solid var(--primary); outline-offset: 2px; }
.nr-token-base { flex: 1 1 240px; }
.nr-token-sep { flex: 0 1 110px; }
.nr-token-qty { flex: 1 1 190px; }
.nr-token-unit { flex: 0 1 120px; }
.nr-op { flex: 0 0 16px; padding-bottom: 12px; text-align: center; color: var(--ink-4); }
.nr-sep-quick { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; }
.nr-qbtn {
    font: inherit; font-size: var(--fs-2xs); padding: 2px 8px; cursor: pointer;
    border: 1px solid var(--line-strong); border-radius: var(--r-pill);
    background: var(--paper-0); color: var(--ink-2);
}
.nr-qbtn:hover { border-color: var(--primary); color: var(--ink-1); }
.nr-params { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; margin-top: 8px; }
.nr-param { display: flex; align-items: center; gap: 6px; font-size: var(--fs-xs); color: var(--ink-3); }
.nr-param .input { width: 84px; padding: 3px 6px; font-size: var(--fs-sm); }
.nr-samples { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.nr-sample { min-width: 0; padding: 7px 10px; border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper-0); }
.nr-sample-q { display: block; color: var(--ink-4); font-size: var(--fs-2xs); }
.nr-sample-v {
    display: block; margin-top: 2px; font-size: var(--fs-sm); font-weight: var(--fw-semi);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.nr-editor-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: center; margin-top: 10px; }
.nr-empty {
    padding: 26px 12px; text-align: center; color: var(--ink-3); font-size: var(--fs-sm);
    background: var(--paper-1); border-radius: var(--r-2);
}
.nr-empty .btn { margin-left: 8px; }


.nr-members-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: center; margin: 4px 0 8px; }
.nr-bulk { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: var(--fs-xs); color: var(--ink-2); }
.nr-members-wrap { border: 1px solid var(--line); border-radius: var(--r-2); }
.nr-members { font-size: var(--fs-sm); }
.nr-members th { white-space: nowrap; }
.nr-members .nr-cb, .nr-table .nr-cb { width: 34px; text-align: center; }
.nr-members td.nr-raw { max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nr-members td.nr-out { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-variant-numeric: tabular-nums; }
.nr-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.nr-members tr.nr-row-focus > td { background: var(--seal-1); }
.nr-members td.nr-opcell, .nr-table td.nr-opcell { white-space: nowrap; text-align: right; }


.nr-inbox-lead { margin: 0 0 10px; color: var(--ink-2); font-size: var(--fs-sm); }
.nr-inbox-row {
    display: grid; grid-template-columns: minmax(0, 1.5fr) 112px minmax(0, 1.1fr) 152px;
    gap: 10px 14px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line);
}
.nr-inbox-main { min-width: 0; }
.nr-inbox-name {
    font-size: var(--fs-sm); font-weight: var(--fw-semi);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.nr-inbox-board { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 3px; }
.nr-mini { color: var(--ink-4); font-size: var(--fs-2xs); margin-right: 2px; }
.nr-inbox-num { text-align: right; font-variant-numeric: tabular-nums; }
.nr-inbox-num b { display: block; font-size: var(--fs-md); }
.nr-inbox-num span { display: block; color: var(--ink-4); font-size: var(--fs-2xs); }
.nr-inbox-sug { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.nr-sug {
    display: block; text-align: left; font: inherit; cursor: pointer;
    padding: 3px 7px; border: 1px solid var(--line-strong); border-radius: var(--r-2);
    background: var(--paper-0); color: var(--ink-1);
}
.nr-sug:first-of-type { background: var(--seal-1); border-color: var(--seal-2); color: var(--seal-7); }
.nr-sug span { display: block; font-size: var(--fs-2xs); font-weight: var(--fw-semi); }
.nr-sug em { display: block; font-style: normal; color: var(--ink-3); font-size: var(--fs-2xs); }
.nr-inbox-act { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }


.nr-bfields { display: grid; gap: 6px; margin: 10px 0; }
.nr-bfield { display: grid; grid-template-columns: 176px minmax(0, 1fr); gap: 8px; align-items: center; }
.nr-bcheck { display: flex; gap: 6px; align-items: center; font-size: var(--fs-sm); color: var(--ink-2); }
.nr-bfield .input { min-width: 0; }
.nr-batch-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 6px; }
.nr-batch-preview { margin-top: 8px; }
.nr-diff-sum { padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper-2); font-size: var(--fs-sm); }
.nr-diff-list { margin-top: 6px; max-height: 260px; overflow: auto; }
.nr-diff-row {
    display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline;
    padding: 5px 0; border-bottom: 1px solid var(--line); font-size: var(--fs-xs);
}
.nr-diff-row .nr-raw { max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nr-diff { color: var(--ink-2); }
.nr-diff b { color: var(--ink-3); font-weight: var(--fw-semi); }
.nr-impact-hint {
    margin: 0 0 10px; padding: 7px 10px; border: 1px solid var(--seal-2);
    border-radius: var(--r-2); background: var(--seal-1); color: var(--seal-7); font-size: var(--fs-xs);
}


@media (max-width: 1180px) {
    .nr-split { grid-template-columns: minmax(0, 280px) minmax(0, 1fr); }
    .nr-inbox-row { grid-template-columns: minmax(0, 1.4fr) 100px minmax(0, 1fr); }
    .nr-inbox-act { grid-column: 1 / -1; justify-content: flex-start; }
}
@media (max-width: 1024px) {
    .nr-token-base { flex: 1 1 200px; }
    .nr-token-qty { flex: 1 1 160px; }
}
@media (max-width: 768px) {
    .nr-views { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .nr-top { padding: 12px; }
    .nr-top .nr-version { flex: 1 1 100%; }
    .nr-split { grid-template-columns: minmax(0, 1fr); }
    .nr-split > .nr-detail { display: none; }
    .nr-split.nr-mobile-detail > .nr-rail { display: none; }
    .nr-split.nr-mobile-detail > .nr-detail { display: block; }
    .nr-detail-back { display: block; }
    .nr-groups { max-height: none; }
    .nr-op { display: none; }
    .nr-token, .nr-token-base, .nr-token-sep, .nr-token-qty, .nr-token-unit { flex: 1 1 100%; }
    .nr-samples { grid-template-columns: minmax(0, 1fr); }
    .nr-inbox-row { grid-template-columns: minmax(0, 1fr); }
    .nr-inbox-num { text-align: left; }
    .nr-inbox-act { justify-content: flex-start; }
    .nr-bfield { grid-template-columns: minmax(0, 1fr); }
    .nr-view-tab { padding: 8px 10px; }
}


.nr-drawer-preview {
    margin: 10px 0 0; padding: 8px 10px; min-height: 30px;
    border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper-2);
}
.nr-preview-title { font-size: var(--fs-2xs); color: var(--ink-3); margin-bottom: 4px; }
.nr-preview-row { display: flex; gap: 8px; align-items: baseline; font-size: var(--fs-xs); line-height: 1.7; }
.nr-preview-row > span { flex: 0 0 34px; color: var(--ink-4); font-variant-numeric: tabular-nums; }
.nr-preview-row > b {
    min-width: 0; font-weight: var(--fw-semi); color: var(--ink-1);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}






.nr-inbox-row { grid-template-columns: 28px minmax(0, 1.5fr) 112px minmax(0, 1.1fr) 152px; }
.nr-inbox-cb { display: flex; align-items: center; justify-content: center; }
.nr-inbox-row.picked { background: var(--seal-1); }
.nr-inbox-src { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 3px; }
.nr-batchbar {
    display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
    margin: 8px 0; padding: 8px 10px; border: 1px solid var(--seal-2);
    border-radius: var(--r-2); background: var(--seal-1); color: var(--seal-7);
    font-size: var(--fs-xs);
}
.nr-batchbar b { font-variant-numeric: tabular-nums; }


.nr-wz-steps {
    display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
    padding: 4px 0 12px; color: var(--ink-3); font-size: var(--fs-xs);
}
.nr-wz-step { display: inline-flex; gap: 6px; align-items: center; }
.nr-wz-step b {
    display: inline-flex; width: 20px; height: 20px; border-radius: 50%;
    align-items: center; justify-content: center; background: var(--paper-3);
    font-size: var(--fs-2xs); color: var(--ink-2);
}
.nr-wz-step.active { color: var(--seal-7); }
.nr-wz-step.active b { background: var(--seal-5); color: #fff; }
.nr-wz-step.done b { background: var(--ink-3); color: #fff; }
.nr-wz-steps i { font-style: normal; color: var(--ink-4); }
.nr-wz-title { font-size: var(--fs-xl); font-weight: var(--fw-semi); margin-bottom: 6px; }
.nr-wz-sub { margin: 0 0 12px; color: var(--ink-3); font-size: var(--fs-xs); line-height: 1.6; }
.nr-wz-items { display: grid; gap: 8px; max-height: 300px; overflow: auto; }
.nr-wz-item { padding: 9px 11px; border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper-1); }
.nr-wz-raw { font-size: var(--fs-sm); font-weight: var(--fw-semi); line-height: 1.5; word-break: break-all; }
.nr-wz-meta { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 3px; color: var(--ink-3); font-size: var(--fs-2xs); }
.nr-wz-note {
    margin: 12px 0 0; padding: 8px 10px; border: 1px solid var(--seal-2);
    border-radius: var(--r-2); background: var(--seal-1); color: var(--seal-7); font-size: var(--fs-xs);
}
.nr-wz-sugs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.nr-wz-sug {
    text-align: left; padding: 7px 10px; border: 1px solid var(--line-strong);
    border-radius: var(--r-2); background: var(--paper-0); cursor: pointer; font: inherit;
}
.nr-wz-sug.active { border-color: var(--seal-5); background: var(--seal-1); }
.nr-wz-sug b { display: block; font-size: var(--fs-sm); }
.nr-wz-sug em { display: block; font-style: normal; color: var(--ink-3); font-size: var(--fs-2xs); }
.nr-wz-field { display: flex; gap: 10px; align-items: center; margin: 10px 0; }
.nr-wz-field > span { flex: 0 0 60px; color: var(--ink-3); font-size: var(--fs-xs); }
.nr-wz-field .input { flex: 1 1 auto; min-width: 0; }
.nr-wz-adv { margin-top: 10px; border-top: 1px dashed var(--line); padding-top: 8px; }
.nr-wz-adv summary { cursor: pointer; color: var(--ink-3); font-size: var(--fs-xs); line-height: 1.6; }
.nr-wz-adv-sum { color: var(--ink-4); font-size: var(--fs-2xs); }
.nr-wz-adv-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; margin-top: 10px; }
.nr-wz-adv-grid .nr-wz-adv-field { display: flex; flex-direction: column; gap: 3px; align-items: stretch; font-size: var(--fs-xs); color: var(--ink-3); }
.nr-wz-adv-field > span:first-child { color: var(--ink-4); font-size: var(--fs-2xs); }
.nr-wz-adv-grid .input { width: 100%; min-width: 0; }
.nr-wz-help { display: block; color: var(--ink-3); font-size: var(--fs-2xs); line-height: 1.45; }
.nr-wz-formula { margin: 12px 0 0; color: var(--ink-3); font-size: var(--fs-xs); line-height: 1.6; }
.nr-wz-preview { display: grid; gap: 6px; max-height: 320px; overflow: auto; }
.nr-wz-prev {
    display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline;
    padding: 7px 9px; border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper-1);
}
.nr-wz-prev .nr-wz-raw { flex: 1 1 240px; }
.nr-wz-out { font-size: var(--fs-xs); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.nr-wz-foot {
    display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: center;
    position: sticky; bottom: -1px; margin-top: 14px; padding: 10px 0 2px;
    border-top: 1px solid var(--line); background: var(--paper-0);
}
.nr-wz-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.nr-wz-done { padding: 18px 4px 6px; text-align: center; }
.nr-wz-check {
    width: 44px; height: 44px; margin: 0 auto 10px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: var(--paper-2); color: var(--down); font-size: var(--fs-2xl);
}
.nr-wz-done-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 14px; }


.nr-set-table td.nr-raw { max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nr-set-table tr.nr-set-off td { color: var(--ink-3); background: var(--paper-1); }
.nr-set-check { display: inline-flex; gap: 6px; align-items: center; font-size: var(--fs-xs); white-space: nowrap; }


.sd-excluded {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 3px 9px; border: 1px solid var(--seal-2); border-radius: var(--r-pill);
    background: var(--seal-1); color: var(--seal-7); font-size: var(--fs-2xs);
}
.sd-excluded-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--seal-5); }
.nr-ex-link { color: var(--seal-7); text-decoration: underline; }

@media (max-width: 1180px) {
    .nr-inbox-row { grid-template-columns: 28px minmax(0, 1.4fr) 100px minmax(0, 1fr); }
    .nr-inbox-act { grid-column: 2 / -1; justify-content: flex-start; }
}
@media (max-width: 768px) {
    .nr-inbox-row { grid-template-columns: 28px minmax(0, 1fr); }
    .nr-inbox-main { grid-column: 2; }
    .nr-inbox-num, .nr-inbox-sug, .nr-inbox-act { grid-column: 1 / -1; }
    .nr-wz-adv-grid { grid-template-columns: minmax(0, 1fr); }
    .nr-wz-field { align-items: flex-start; flex-direction: column; gap: 4px; }
    .nr-wz-field > span { flex: none; }
}





.nr-wz-spec {
    margin-top: 10px; padding: 10px 12px;
    border: 1px solid var(--line-strong); border-radius: var(--r-2); background: var(--paper-1);
}
.nr-wz-spec-head { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.nr-wz-k { flex: 0 0 auto; color: var(--ink-4); font-size: var(--fs-2xs); }
.nr-wz-raw-hl {
    min-width: 0; font-size: var(--fs-sm); font-weight: var(--fw-semi);
    line-height: 1.7; word-break: break-all;
}
.nr-wz-mk { border-radius: 2px; padding: 0 2px; }
.nr-wz-mk-pack { background: var(--seal-2); color: var(--seal-8); }
.nr-wz-mk-cap { background: var(--paper-3); color: var(--ink-2); }
.nr-wz-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.nr-wz-chip {
    padding: 2px 8px; border: 1px solid var(--line); border-radius: var(--r-pill);
    background: var(--paper-0); color: var(--ink-2); font-size: var(--fs-2xs); white-space: nowrap;
}
.nr-wz-chip-k { border-color: var(--seal-3); background: var(--seal-1); color: var(--seal-8); }
.nr-wz-chip-q { font-variant-numeric: tabular-nums; }
.nr-wz-fill {
    margin-top: 9px; padding: 4px 11px; font: inherit; font-size: var(--fs-xs); cursor: pointer;
    border: 1px solid var(--seal-5); border-radius: var(--r-pill);
    background: var(--paper-0); color: var(--seal-8);
}
.nr-wz-fill:hover { background: var(--seal-1); }
.nr-wz-fillnote { margin-left: 8px; color: var(--ink-3); font-size: var(--fs-2xs); }
.nr-wz-warn {
    margin: 8px 0 0; padding: 6px 9px; border: 1px solid var(--warn-line, var(--line-strong));
    border-radius: var(--r-2); background: var(--paper-2); color: var(--ink-2);
    font-size: var(--fs-xs); line-height: 1.6;
}
.nr-wz-warn-block { margin-top: 10px; }
.nr-wz-ack { display: flex; gap: 6px; align-items: center; margin-top: 6px; font-size: var(--fs-xs); }
.nr-wz-calc { margin-top: 9px; padding-top: 7px; border-top: 1px dashed var(--line); }
.nr-wz-crow {
    display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 8px;
    padding: 2px 0; font-size: var(--fs-xs); color: var(--ink-2);
}
.nr-wz-crow > span { padding-top: 1px; color: var(--ink-4); font-size: var(--fs-2xs); }
.nr-wz-crow b { color: var(--ink-1); }
.nr-wz-qty { margin-top: 8px; }
.nr-wz-qs-title { margin-top: 4px; color: var(--ink-4); font-size: var(--fs-2xs); }
.nr-wz-qrow {
    display: grid; grid-template-columns: 48px 92px minmax(0, 1fr) 52px; gap: 8px;
    align-items: baseline; padding: 4px 0; border-top: 1px solid var(--line);
    font-size: var(--fs-xs);
}
.nr-wz-qrow b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: var(--fw-semi); }
.nr-wz-qrow .nr-wz-b { text-align: right; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.nr-wz-qs { color: var(--ink-3); font-size: var(--fs-2xs); font-variant-numeric: tabular-nums; }
.nr-wz-spec-line { margin-top: 4px; }
.nr-wz-spec-line .nr-wz-chip { margin-right: 4px; }
.nr-wz-prevt {
    display: grid; grid-template-columns: 48px 92px minmax(0, 1fr) 52px;
    gap: 8px; align-items: baseline;
}
.nr-wz-prevt .nr-wz-q { color: var(--ink-2); font-variant-numeric: tabular-nums; }
.nr-wz-prevt .nr-wz-b { text-align: right; color: var(--ink-2); font-size: var(--fs-2xs); }
.nr-wz-prev-head { color: var(--ink-4); font-size: var(--fs-2xs); border-bottom: 1px solid var(--line); }
.nr-wz-total { margin: 8px 0 0; color: var(--ink-2); font-size: var(--fs-xs); }
.nr-wz-before {
    display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline;
    margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--line);
}
.nr-wz-before-v { color: var(--ink-2); font-size: var(--fs-xs); word-break: break-all; }

@media (max-width: 768px) {
    .nr-wz-qrow, .nr-wz-prevt { grid-template-columns: 44px 84px minmax(0, 1fr); }
    .nr-wz-qrow .nr-wz-b, .nr-wz-prevt .nr-wz-b { grid-column: 2 / -1; text-align: left; }
}


.nr-inbox-hint {
    display: flex; width: 100%; align-items: center; justify-content: space-between;
    gap: 8px; margin: 0 0 10px; padding: 8px 12px; cursor: pointer;
    border: 1px solid var(--seal-2); border-radius: var(--r-2);
    background: var(--seal-1); color: var(--seal-7);
    font: inherit; font-size: var(--fs-xs); text-align: left;
}
.nr-inbox-hint b { font-variant-numeric: tabular-nums; }
.nr-inbox-hint span { color: var(--seal-8); }