/* THE BILLING SCREEN, generated from _preview/billing-mockup.html by scratchpad/gift/mkbillcss.py.
   DO NOT EDIT BY HAND: change the mockup (scratchpad/gift/mkbilling.py) and run both scripts.
   Scoped under .bla; the mockup's body.phone is .bla.ph here. */
.bla.bla.bla{--ease:cubic-bezier(.2,.8,.2,1);--panel3:#1b2331}
.bla.bla.bla .cc > svg{fill:none;stroke:none}
@keyframes bl_blIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.bla.bla.bla .subhead{margin:0 0 18px;font-size:21px;line-height:27px;font-weight:800;letter-spacing:-.5px}
.bla.bla.bla .sec{display:flex;align-items:center;gap:10px;margin:28px 0 10px;font-size:11px;font-weight:800;letter-spacing:.6px;color:var(--dim)}
.bla.bla.bla .sec::after{content:"";flex:1;height:1px;background:var(--line)}
.bla.bla.bla .panel{border-radius:16px;background:var(--panel);box-shadow:0 0 0 1px var(--line)}
.bla.bla.bla .hero{--c1:#dfe4ec;--c2:#8e97a5;position:relative;overflow:hidden;border-radius:20px;padding:24px 26px;
    display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 22px;align-items:center;
    background:
      radial-gradient(60% 120% at 0% 0%, color-mix(in srgb,var(--c1) 16%,transparent), transparent 70%),
      linear-gradient(150deg,#141b25,#0b0f16 80%);
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c1) 26%,transparent), 0 30px 60px -34px #000}
.bla.bla.bla .hero[data-k="free"]{--c1:#9aa3af;--c2:#6b7280}
.bla.bla.bla .hero[data-k="medium"]{--c1:#f0c74d;--c2:#a8740c}
.bla.bla.bla .hero[data-k="large"]{--c1:#8fd0ff;--c2:#3a8fe0}
.bla.bla.bla .hero .wm{position:absolute;right:-50px;top:-70px;width:280px;height:280px;opacity:.14;pointer-events:none;transform:rotate(12deg);
    -webkit-mask-image:linear-gradient(205deg,#000 20%,transparent 68%);mask-image:linear-gradient(205deg,#000 20%,transparent 68%)}
.bla.bla.bla .hero .bdg{position:relative;width:72px;height:72px;grid-row:1/4;
    filter:drop-shadow(0 10px 22px color-mix(in srgb,var(--c1) 40%,transparent))}
.bla.bla.bla .hero .bdg svg{width:100%;height:100%}
.bla.bla.bla .hero .name{position:relative;font-size:12px;font-weight:800;letter-spacing:1.1px;color:color-mix(in srgb,var(--c1) 78%,#fff)}
.bla.bla.bla .hero .price{position:relative;display:flex;align-items:flex-start;gap:2px;font-weight:800;letter-spacing:-1px;line-height:1;margin-top:4px}
.bla.bla.bla .hero .price .c{font-size:16px;margin-top:5px;color:var(--mid);letter-spacing:0}
.bla.bla.bla .hero .price .w{font-size:40px}
.bla.bla.bla .hero .price .d{font-size:16px;margin-top:5px;letter-spacing:0}
.bla.bla.bla .hero .price .p{align-self:flex-end;margin:0 0 5px 8px;font-size:13px;font-weight:600;letter-spacing:0;color:var(--dim)}
.bla.bla.bla .hero .since{position:relative;grid-column:2;display:flex;align-items:center;gap:7px;color:var(--mid);font-size:12.5px}
.bla.bla.bla .hero .since svg{width:15px;height:15px}
.bla.bla.bla .hero .pside{display:contents}
.bla.bla.bla .hero .facts{position:relative;grid-column:2;display:flex;align-items:center;flex-wrap:wrap;row-gap:8px;margin-top:14px}
.bla.bla.bla .hero .f{display:flex;align-items:center;gap:10px;padding:0 18px;white-space:nowrap}
.bla.bla.bla .hero .f:first-child{padding-left:0}
.bla.bla.bla .hero .f + .f{box-shadow:inset 1px 0 0 var(--line)}
.bla.bla.bla .hero .pside small{font-size:10.5px;font-weight:800;letter-spacing:.8px;color:var(--dim)}
.bla.bla.bla .hero .pside b{display:inline-flex;align-items:center;font-size:14px}
.bla.bla.bla .pill{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;font-size:11.5px;font-weight:700;white-space:nowrap}
.bla.bla.bla .pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.bla.bla.bla .pill.good{color:var(--good);background:color-mix(in srgb,var(--good) 13%,transparent)}
.bla.bla.bla .pill.bad{color:#ff8f86;background:color-mix(in srgb,var(--bad) 15%,transparent)}
.bla.bla.bla .pill.dim{color:var(--mid);background:color-mix(in srgb,var(--fg) 8%,transparent)}
.bla.bla.bla .hero .acts{position:relative;grid-column:3;grid-row:1/4;align-self:end;display:flex;gap:10px}
.bla.bla.bla .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:38px;padding:0 16px;border:0;border-radius:11px;font-weight:700;font-size:13px;cursor:pointer;white-space:nowrap}
.bla.bla.bla .btn svg{width:16px;height:16px}
.bla.bla.bla .btn.quiet{background:var(--panel2);color:var(--fg);box-shadow:inset 0 0 0 1px var(--line2)}
.bla.bla.bla .btn.quiet:hover{background:var(--panel3)}
.bla.bla.bla .btn.blue{background:linear-gradient(180deg,#5b9bf8,#3b82f6);color:#fff;box-shadow:inset 0 0 0 1px rgba(160,200,255,.35),0 8px 22px -12px rgba(59,130,246,.7)}
.bla.bla.bla .btn.blue:hover{filter:brightness(1.06)}
.bla.bla.bla .btn.link{background:none;color:var(--accent-lt);padding:0 4px;height:auto}
.bla.bla.bla .is-bad{--sc:#ff6b61;--sc2:#ff968d}
.bla.bla.bla .is-end{--sc:#f5b400;--sc2:#f7ca4f}
.bla.bla.bla .alert{position:relative;overflow:hidden;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:0 18px;align-items:center;margin-bottom:14px;
    padding:18px 20px;border-radius:20px;
    
    background:radial-gradient(55% 150% at 0% 0%,color-mix(in srgb,var(--sc) 8%,transparent),transparent 70%),linear-gradient(150deg,#151a22,#0d1117 80%);
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sc) 24%,transparent)}
.bla.bla.bla .alert .ab{position:relative;width:50px;height:50px}
.bla.bla.bla .alert .ab svg.pb{display:block;width:100%;height:100%}
.bla.bla.bla .sd{position:absolute;right:-5px;bottom:-5px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--sc);color:#140d0b;box-shadow:0 0 0 3px #12161e}
.bla.bla.bla .sd svg{width:13px;height:13px}
.bla.bla.bla .atxt .ey{display:block;font-size:10.5px;font-weight:800;letter-spacing:.9px;color:var(--sc2)}
.bla.bla.bla .atxt b{display:block;margin-top:3px;font-size:15.5px;font-weight:800;letter-spacing:-.2px}
.bla.bla.bla .atxt small{display:block;margin-top:3px;color:var(--mid);font-size:12.5px}
.bla.bla.bla .dl{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:11.5px;font-weight:700;color:var(--sc2)}
.bla.bla.bla .tb{width:180px;height:5px;border-radius:99px;background:color-mix(in srgb,var(--fg) 9%,transparent);overflow:hidden}
.bla.bla.bla .tb i{display:block;height:100%;border-radius:99px;background:var(--sc)}
.bla.bla.bla .aacts2{display:flex;gap:8px}
.bla.bla.bla .is-bad .btn.sbtn{background:linear-gradient(180deg,#ef6f65,#d9463c);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,200,195,.22)}
.bla.bla.bla .is-end .btn.sbtn{background:linear-gradient(180deg,#fbd06a,#e9a92a);color:#221703;box-shadow:inset 0 0 0 1px rgba(255,236,180,.35)}
.bla.bla.bla .btn.sbtn:hover{filter:brightness(1.06)}
.bla.bla.bla .btn.ghost2{background:transparent;color:var(--fg);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--fg) 20%,transparent)}
.bla.bla.bla .btn.ghost2:hover{background:color-mix(in srgb,var(--fg) 6%,transparent)}
.bla.bla.bla .land{animation:bl_land 1.8s ease}
@keyframes bl_land{25%,55%{box-shadow:0 0 0 2px var(--accent),0 0 34px -6px color-mix(in srgb,var(--accent) 70%,transparent)}}
.bla.bla.bla .use{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;align-items:center;padding:18px 20px}
.bla.bla.bla .use b{font-size:13.5px}
.bla.bla.bla .use .num{font-weight:800;font-size:13.5px;font-variant-numeric:tabular-nums}
.bla.bla.bla .use .num span{color:var(--dim);font-weight:700}
.bla.bla.bla .bar{grid-column:1/-1;position:relative;height:8px;margin-top:10px;border-radius:999px;background:var(--panel3);overflow:hidden}
.bla.bla.bla .bar i{position:absolute;inset:0 auto 0 0;width:0;border-radius:999px;
    background:linear-gradient(90deg,color-mix(in srgb,var(--c1,#8fd0ff) 70%,#3b82f6),var(--c1,#8fd0ff));
    box-shadow:0 0 14px color-mix(in srgb,var(--c1,#8fd0ff) 55%,transparent);transition:width .55s var(--ease)}
.bla.bla.bla .use small{grid-column:1/-1;margin-top:8px;color:var(--dim);font-size:12.5px}
.bla.bla.bla .more{display:flex;align-items:center;gap:12px;padding:14px 20px;box-shadow:inset 0 1px 0 var(--line)}
.bla.bla.bla .more b{display:block;font-size:13.5px}
.bla.bla.bla .more small{color:var(--dim);font-size:12.5px}
.bla.bla.bla .more .btn{margin-left:auto}
.bla.bla.bla .pm{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px;align-items:center;padding:18px 20px}
.bla.bla.bla .cc{position:relative;width:160px;aspect-ratio:1.586;flex:none;border-radius:8.5px;overflow:hidden;
    box-shadow:0 14px 28px -14px #000,0 0 0 1px rgba(255,255,255,.07)}
.bla.bla.bla .cc > svg{display:block;width:100%;height:100%}
.bla.bla.bla .cc.sm{width:62px;border-radius:3.5px;box-shadow:0 6px 14px -8px #000,0 0 0 1px rgba(255,255,255,.08)}
.bla.bla.bla .bt{display:block;flex:none;width:34px;height:22px;border-radius:4px;box-shadow:0 0 0 1px rgba(0,0,0,.3)}
.bla.bla.bla .pm b{display:block;font-size:13.5px}
.bla.bla.bla .pm small{display:block;color:var(--dim);font-size:12.5px;margin-top:2px}
.bla.bla.bla .pm + .crow{box-shadow:inset 0 1px 0 var(--line)}
.bla.bla.bla .fine{margin:10px 2px 0;color:var(--dim);font-size:11.5px;line-height:16px;display:flex;align-items:center;gap:7px}
.bla.bla.bla .fine svg{width:14px;height:14px;flex:none}
.bla.bla.bla .rows > div{display:flex;align-items:center;gap:14px;padding:13px 20px}
.bla.bla.bla .rows > div + div{box-shadow:inset 0 1px 0 var(--line)}
.bla.bla.bla .rows .k{width:150px;flex:none;color:var(--dim);font-size:12.5px}
.bla.bla.bla .rows .v{flex:1;min-width:0;font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bla.bla.bla .rows .v.unset{color:var(--dim);font-weight:500}
.bla.bla.bla .empty{padding:22px;text-align:center;color:var(--dim);font-size:12.5px}
.bla.bla.bla .more{display:flex;align-items:center;gap:14px;padding:14px 20px;box-shadow:inset 0 1px 0 var(--line)}
.bla.bla.bla .more .nb{width:34px;height:34px;flex:none}
.bla.bla.bla .more .nb svg{width:100%;height:100%}
.bla.bla.bla .cc.slot{background:repeating-linear-gradient(135deg,transparent 0 9px,color-mix(in srgb,var(--fg) 2.5%,transparent) 9px 10px);
    box-shadow:inset 0 0 0 1.5px var(--line2);border-radius:10px}
.bla.bla.bla .cc.slot .cchip{position:absolute;left:16px;top:28%;width:22px;height:16px;border-radius:4px;box-shadow:inset 0 0 0 1.5px var(--line2)}
.bla.bla.bla .cc.slot .ln{position:absolute;left:16px;right:54px;bottom:18px;height:6px;border-radius:3px;background:var(--line2);opacity:.6}
.bla.bla.bla .cc.slot .plusc{position:absolute;right:12px;bottom:11px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
    background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent-lt)}
.bla.bla.bla .cc.slot .plusc svg{width:15px;height:15px}
.bla.bla.bla .cc.slot.sm{border-radius:5px}
.bla.bla.bla .cc.slot.sm .plusc{right:auto;bottom:auto;left:50%;top:50%;transform:translate(-50%,-50%);width:22px;height:22px}
.bla.bla.bla .cc.slot.sm .plusc svg{width:12px;height:12px}
.bla.bla.bla .crow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:13px 20px;width:100%;
    border:0;background:none;color:inherit;text-align:left;font:inherit}
.bla.bla.bla .crow + .crow{box-shadow:inset 0 1px 0 var(--line)}
.bla.bla.bla .crow b{display:block;font-size:13.5px}
.bla.bla.bla .crow small{display:block;color:var(--dim);font-size:12.5px;margin-top:2px}
.bla.bla.bla .cacts{display:flex;gap:14px}
.bla.bla.bla .btn.link.dim{color:var(--dim)}
.bla.bla.bla .crow.addc{cursor:pointer;grid-template-columns:auto minmax(0,1fr)}
.bla.bla.bla .crow.addc b{color:var(--accent-lt)}
.bla.bla.bla .crow.addc:hover{background:color-mix(in srgb,var(--fg) 3%,transparent)}
.bla.bla.bla .inv > .empty{display:block}
.bla.bla.bla .ir + .ir{box-shadow:inset 0 1px 0 var(--line)}
.bla.bla.bla .ir .ihead{display:grid;grid-template-columns:auto minmax(0,1fr) auto 18px;gap:0 14px;align-items:center;width:100%;
    padding:14px 20px;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.bla.bla.bla .ir .ihead:hover{background:color-mix(in srgb,var(--fg) 3%,transparent)}
.bla.bla.bla .ir .ihead svg.pb{width:30px;height:30px}
.bla.bla.bla .ir .t{display:block;min-width:0}
.bla.bla.bla .ir .t b{display:block;font-size:13.5px;font-weight:700}
.bla.bla.bla .ir .t small{display:flex;gap:10px;margin-top:2px;color:var(--dim);font-size:12px;font-variant-numeric:tabular-nums}
.bla.bla.bla .ir .t em{font-style:normal;font-weight:700;color:#ff8f86}
.bla.bla.bla .ir .amt{font-weight:800;font-variant-numeric:tabular-nums}
.bla.bla.bla .ir .chev{width:18px;height:18px;color:var(--dim);transition:transform .18s var(--ease)}
.bla.bla.bla .ir.on .chev{transform:rotate(180deg)}
.bla.bla.bla .ir .ibody{display:grid;grid-template-rows:0fr;transition:grid-template-rows .18s var(--ease)}
.bla.bla.bla .ir.on .ibody{grid-template-rows:1fr}
.bla.bla.bla .ir .iin{overflow:hidden;min-height:0}
.bla.bla.bla .ir.on .iin{padding:12px 20px 20px}
.bla.bla.bla .rc{border-radius:14px;background:var(--panel2);box-shadow:inset 0 0 0 1px var(--line)}
.bla.bla.bla .rc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:18px 20px 16px}
.bla.bla.bla .rc-top b{display:block;font-size:15px;font-weight:800;letter-spacing:-.1px}
.bla.bla.bla .rc-top small{display:block;margin-top:4px;color:var(--dim);font-size:12.5px}
.bla.bla.bla .rc-top .rtot{flex:none;text-align:right;font-size:24px;font-weight:800;letter-spacing:-.6px;line-height:1;font-variant-numeric:tabular-nums}
.bla.bla.bla .rc-top .rtot small{margin-top:7px;font-size:10.5px;font-weight:800;letter-spacing:.8px}
.bla.bla.bla .rc-top .rtot small.paid{color:var(--good)}
.bla.bla.bla .rc-top .rtot small.unpaid{color:#ff8f86}
.bla.bla.bla .rc-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:16px 20px 18px;box-shadow:inset 0 1px 0 var(--line)}
.bla.bla.bla .rc-facts small{display:block;margin-bottom:8px;font-size:10.5px;font-weight:800;letter-spacing:.7px;color:var(--dim)}
.bla.bla.bla .rc-facts b{display:flex;align-items:center;gap:10px;min-width:0;font-size:13px;font-weight:650}
.bla.bla.bla .rc-facts b.mono{display:block;font-family:ui-monospace,Consolas,monospace;font-size:12.5px;font-weight:500;color:var(--mid);overflow-wrap:anywhere}
.bla.bla.bla .rc-facts i{display:block;margin-top:4px;font-style:normal;color:var(--dim);font-size:12px}
.bla.bla.bla .cc.xs{width:38px;border-radius:3px;box-shadow:0 0 0 1px rgba(255,255,255,.1)}
.bla.bla.bla .rc .inote{margin:0 20px 16px}
.bla.bla.bla .rc-foot{display:flex;align-items:center;gap:14px;padding:12px 16px 12px 20px;border-radius:0 0 14px 14px;
    background:color-mix(in srgb,var(--bg) 40%,transparent);box-shadow:inset 0 1px 0 var(--line)}
.bla.bla.bla .rc-foot .btn.quiet, .bla.bla.bla .rc-foot .btn.blue{height:34px;padding:0 14px}
.bla.bla.bla .rc-foot .q{margin-left:auto;color:var(--dim);font-size:12.5px}
.bla.bla.bla .inote{display:flex;align-items:center;gap:12px;margin-top:12px;padding:11px 14px;border-radius:12px;font-size:12.5px;color:var(--mid)}
.bla.bla.bla .inote.bad{background:color-mix(in srgb,var(--bad) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bad) 28%,transparent)}
.bla.bla.bla .inote b{color:#ff8f86}
.bla.bla.bla .inote .btn{margin-left:auto}
.bla.bla.bla .mback{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:20px;
    background:rgba(2,4,8,.7);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:bl_mIn .18s ease both}
.bla.bla.bla .mback.out{animation:bl_mOut .14s ease both}
.bla.bla.bla .bmodal{position:relative;width:min(460px,100%);max-height:calc(100vh - 40px);display:flex;flex-direction:column;border-radius:16px;overflow:hidden;
    background:var(--panel);box-shadow:0 0 0 1px var(--line2),0 40px 90px -30px #000;animation:bl_mPop .2s var(--ease) both}
.bla.bla.bla .mback.out .bmodal{animation:bl_mDrop .14s ease both}
@keyframes bl_mIn{from{opacity:0}}
@keyframes bl_mOut{to{opacity:0}}
@keyframes bl_mPop{from{opacity:0;transform:scale(.96)}}
@keyframes bl_mDrop{to{opacity:0;transform:scale(.97)}}
.bla.bla.bla .bmodal.wide{width:min(540px,100%)}
.bla.bla.bla .mhead{padding:22px 60px 0 24px}
.bla.bla.bla .mhead h3{margin:0;font-size:19px;font-weight:800;letter-spacing:-.3px}
.bla.bla.bla .mhead p{margin:6px 0 0;color:var(--mid);font-size:13px;line-height:19px}
.bla.bla.bla .mx{position:absolute;right:14px;top:14px;width:32px;height:32px;border:0;border-radius:9px;background:none;color:var(--dim);cursor:pointer;display:grid;place-items:center}
.bla.bla.bla .mx:hover{background:color-mix(in srgb,var(--fg) 8%,transparent);color:var(--fg)}
.bla.bla.bla .mx svg{width:18px;height:18px}
.bla.bla.bla .mbody{padding:18px 24px 22px;overflow:auto}
.bla.bla.bla .mfoot{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:14px 18px;
    background:color-mix(in srgb,var(--bg) 55%,var(--panel));box-shadow:inset 0 1px 0 var(--line)}
.bla.bla.bla .btn.red{background:linear-gradient(180deg,#ef6b61,#d9463c);color:#fff}
.bla.bla.bla .btn.red:hover{filter:brightness(1.06)}
.bla.bla.bla .btn[disabled]{opacity:.42;pointer-events:none}
.bla.bla.bla .btn.busy{pointer-events:none}
.bla.bla.bla .spin{width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:bl_spin .7s linear infinite}
@keyframes bl_spin{to{transform:rotate(360deg)}}
.bla.bla.bla .fl{display:block;margin-top:14px}
.bla.bla.bla .mbody > :first-child{margin-top:0}
.bla.bla.bla .fl > span:first-child, .bla.bla.bla .lab{display:block;margin-bottom:7px;font-size:11px;font-weight:800;letter-spacing:.6px;color:var(--dim)}
.bla.bla.bla .in{display:flex;align-items:center;gap:8px;height:42px;padding:0 12px;border-radius:10px;background:var(--bg);
    box-shadow:inset 0 0 0 1px var(--line2);transition:box-shadow .15s}
.bla.bla.bla .in:focus-within{box-shadow:inset 0 0 0 1.5px var(--accent)}
.bla.bla.bla .in input{flex:1;min-width:0;height:100%;padding:0;border:0;outline:0;background:none;color:var(--fg);font:inherit;font-size:14px;box-shadow:none}
.bla.bla.bla .in input::placeholder{color:var(--dim)}
.bla.bla.bla .in input:disabled{cursor:default;color:var(--fg)}
.bla.bla.bla .in > svg{width:20px;height:20px;flex:none;color:var(--dim)}
.bla.bla.bla .in .pre{align-self:stretch;display:flex;align-items:center;padding-right:10px;color:var(--mid);font-weight:700;font-size:13.5px;box-shadow:inset -1px 0 0 var(--line2)}
.bla.bla.bla .hint{display:block;margin-top:6px;color:var(--dim);font-size:11.5px}
.bla.bla.bla .hint:empty{display:none}
.bla.bla.bla .fl.bad .in{box-shadow:inset 0 0 0 1.5px var(--bad);animation:bl_shake .3s}
.bla.bla.bla .fl.bad .hint{color:#ff8f86}
@keyframes bl_shake{20%,60%{transform:translateX(-4px)}40%,80%{transform:translateX(4px)}}
.bla.bla.bla .two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 12px}
.bla.bla.bla .two.pc{grid-template-columns:130px minmax(0,1fr)}
.bla.bla.bla .stripe{padding:14px 14px 12px;border-radius:12px;background:color-mix(in srgb,var(--bg) 60%,var(--panel));box-shadow:inset 0 0 0 1px var(--line)}
.bla.bla.bla .stripe > .fl:first-child{margin-top:0}
.bla.bla.bla .brs{display:flex;gap:4px}
.bla.bla.bla .brs .bt{width:27px;height:18px;border-radius:3.5px}
.bla.bla.bla .by{display:flex;align-items:center;gap:7px;margin:12px 0 0;color:var(--dim);font-size:11.5px;line-height:16px}
.bla.bla.bla .by svg{width:14px;height:14px;flex:none}
.bla.bla.bla .chk{display:flex;align-items:center;gap:10px;margin-top:16px;font-size:13px;cursor:pointer}
.bla.bla.bla .chk input, .bla.bla.bla .opt input{appearance:none;-webkit-appearance:none;flex:none;margin:0;cursor:pointer}
.bla.bla.bla .chk input{width:18px;height:18px;border-radius:5px;box-shadow:inset 0 0 0 1.5px var(--line2);display:grid;place-items:center}
.bla.bla.bla .chk input:checked{background:var(--accent);box-shadow:none}
.bla.bla.bla .chk input:checked::after{content:"";width:5px;height:9px;margin-top:-2px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.bla.bla.bla .rmc{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:12px;background:var(--panel2);box-shadow:inset 0 0 0 1px var(--line)}
.bla.bla.bla .rmc b{display:block;font-size:13.5px}
.bla.bla.bla .rmc small{display:block;color:var(--dim);font-size:12.5px;margin-top:2px}
.bla.bla.bla .mnote{margin:14px 0 0;color:var(--mid);font-size:13px;line-height:19px}
.bla.bla.bla .psum{display:flex;align-items:center;gap:12px;margin-bottom:18px;padding:12px 14px;border-radius:12px;background:var(--panel2);box-shadow:inset 0 0 0 1px var(--line)}
.bla.bla.bla .psum svg.pb{width:30px;height:30px;flex:none}
.bla.bla.bla .psum b{display:block;font-size:13.5px}
.bla.bla.bla .psum small{display:block;margin-top:2px;color:var(--dim);font-size:12px}
.bla.bla.bla .mono{font-family:ui-monospace,Consolas,monospace}
.bla.bla.bla .opts{display:grid;gap:6px}
.bla.bla.bla .opt{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:10px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;font-size:13.5px}
.bla.bla.bla .opt:hover{background:var(--panel2)}
.bla.bla.bla .opt input{width:18px;height:18px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--line2);transition:box-shadow .12s}
.bla.bla.bla .opt input:checked{box-shadow:inset 0 0 0 5px var(--accent)}
.bla.bla.bla .opt:has(input:checked){background:color-mix(in srgb,var(--accent) 9%,var(--bg));box-shadow:inset 0 0 0 1.5px var(--accent)}
.bla.bla.bla .ta{display:block;width:100%;min-height:86px;resize:vertical;padding:10px 12px;border:0;border-radius:10px;background:var(--bg);
    box-shadow:inset 0 0 0 1px var(--line2);color:var(--fg);font:inherit;font-size:13.5px;line-height:19px;outline:0}
.bla.bla.bla .ta:focus{box-shadow:inset 0 0 0 1.5px var(--accent)}
.bla.bla.bla .ta::placeholder{color:var(--dim)}
.bla.bla.bla .done{display:grid;justify-items:center;text-align:center;padding:14px 0 6px;animation:bl_mPop .2s var(--ease) both}
.bla.bla.bla .done .okc{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--good) 16%,transparent);color:var(--good)}
.bla.bla.bla .done .okc svg{width:26px;height:26px}
.bla.bla.bla .done b{margin-top:14px;font-size:17px}
.bla.bla.bla .done p{margin:6px 0 0;max-width:36ch;color:var(--mid);font-size:13px;line-height:19px}
@keyframes bl_tIn{from{opacity:0;transform:translate(-50%,8px)}}
.bla.bla.bla .crow.new, .bla.bla.bla .pm.new{animation:bl_blIn .3s var(--ease) backwards}
.bla.bla.bla .pill.amber{color:#f5c451;background:color-mix(in srgb,#f5b400 14%,transparent)}
.bla.bla.bla .more .mchev{display:none}
@keyframes bl_alrPop{from{opacity:0;transform:translateY(-6px)}}
.bla.bla.bla .ptabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:14px}
.bla.bla.bla .mlist{display:grid;gap:8px}
.bla.bla.bla .mrow{display:flex;align-items:center;gap:12px;width:100%;padding:12px;border:0;border-radius:10px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line2);
    color:inherit;font:inherit;text-align:left;cursor:pointer}
.bla.bla.bla .mrow.info{cursor:default;box-shadow:inset 0 0 0 1px var(--line)}
.bla.bla.bla .mrow.on{background:color-mix(in srgb,var(--accent) 8%,var(--bg));box-shadow:inset 0 0 0 1.5px var(--accent)}
.bla.bla.bla .mrow .rdo{width:18px;height:18px;flex:none;border-radius:50%;box-shadow:inset 0 0 0 2px var(--line2)}
.bla.bla.bla .mrow.on .rdo{box-shadow:inset 0 0 0 5px var(--accent)}
.bla.bla.bla .mrow svg.bt{width:34px;height:22px}
.bla.bla.bla .mrow b{display:block;font-size:13.5px}
.bla.bla.bla .mrow small{display:block;margin-top:2px;color:var(--mid);font-size:12px;line-height:17px}
.bla.bla.bla .mt2{display:flex;gap:4px;flex:none}
.bla.bla.bla.ph .ptab{padding:10px 8px;font-size:12px}
.bla.bla.bla .ptab{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:10px 12px;border:0;border-radius:10px;background:var(--bg);
    box-shadow:inset 0 0 0 1px var(--line2);color:var(--mid);font:inherit;font-size:12.5px;font-weight:700;text-align:left;cursor:pointer}
.bla.bla.bla .ptab:hover{color:var(--fg)}
.bla.bla.bla .ptab.on{color:var(--fg);background:color-mix(in srgb,var(--accent) 8%,var(--bg));box-shadow:inset 0 0 0 1.5px var(--accent)}
.bla.bla.bla .ptab svg{width:20px;height:20px}
.bla.bla.bla .ptab svg.bt{width:27px;height:18px}
.bla.bla.bla .ptabs + .fl{margin-top:0}
.bla.bla.bla .ppgo{display:flex;align-items:center;gap:14px;padding:14px;border-radius:10px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line)}
.bla.bla.bla .ppgo svg.bt{width:46px;height:30px}
.bla.bla.bla .ppgo b{display:block;font-size:13.5px}
.bla.bla.bla .ppgo small{display:block;margin-top:3px;color:var(--mid);font-size:12.5px;line-height:18px}
.bla.bla.bla .mandate{margin-top:14px;padding:12px;border-radius:10px;border:1px dashed var(--line2);color:var(--dim);font-size:12px;line-height:17px}
.bla.bla.bla .snote{margin:0;padding:14px;border-radius:10px;background:var(--bg);color:var(--mid);font-size:13px}
.bla.bla.bla.ph .hero{grid-template-columns:auto minmax(0,1fr);gap:4px 16px;padding:20px 18px 18px}
.bla.bla.bla.ph .hero .bdg{width:52px;height:52px;filter:drop-shadow(0 6px 12px color-mix(in srgb,var(--c1) 18%,transparent))}
.bla.bla.bla.ph .hero .wm{width:210px;height:210px;right:-54px;top:-44px;opacity:.1}
.bla.bla.bla.ph .hero .price .w{font-size:32px}
.bla.bla.bla.ph .hero .bdg{grid-row:1/3}
.bla.bla.bla.ph .hero .pside{display:block;grid-column:1/-1;margin-top:16px;padding-top:14px;box-shadow:inset 0 1px 0 color-mix(in srgb,var(--c1) 14%,var(--line))}
.bla.bla.bla.ph .hero .facts{display:grid;grid-template-columns:repeat(var(--nf),minmax(0,1fr));margin:0}
.bla.bla.bla.ph .hero .f{display:block;padding:0;text-align:center}
.bla.bla.bla.ph .hero .pside small{display:block}
.bla.bla.bla.ph .hero .pside b{display:flex;justify-content:center;margin-top:2px}
.bla.bla.bla.ph .hero .acts{margin-top:16px}
.bla.bla.bla.ph .hero .acts .btn{flex:1}
.bla.bla.bla.ph .pm{grid-template-columns:auto minmax(0,1fr)}
.bla.bla.bla.ph .pm .btn{grid-column:1/-1}
.bla.bla.bla.ph .rows > div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:14px 16px}
.bla.bla.bla.ph .rows .k{width:auto;grid-column:1;grid-row:1;font-size:12px}
.bla.bla.bla.ph .rows .v{grid-column:1;grid-row:2;white-space:normal;overflow-wrap:anywhere}
.bla.bla.bla.ph .rows .btn{grid-column:2;grid-row:1/3;align-self:center}
.bla.bla.bla.ph .alert{grid-template-columns:auto minmax(0,1fr);gap:0 14px;align-items:start;padding:16px}
.bla.bla.bla.ph .alert .ab{width:42px;height:42px}
.bla.bla.bla.ph .dl{margin-top:12px}
.bla.bla.bla.ph .tb{flex:1;width:auto}
.bla.bla.bla.ph .aacts2{grid-column:1/-1;margin-top:14px}
.bla.bla.bla.ph .aacts2 .btn{flex:1;height:42px}
.bla.bla.bla.ph .ir .ihead{padding:14px 16px}
.bla.bla.bla.ph .ir.on .iin{padding:10px 12px 14px}
.bla.bla.bla.ph .rc-top{flex-direction:column-reverse;align-items:stretch;gap:12px;padding:16px 16px 14px}
.bla.bla.bla.ph .rc-top .rtot{display:flex;align-items:center;gap:10px;text-align:left;font-size:26px}
.bla.bla.bla.ph .rc-top .rtot small{margin:0;padding:4px 8px;border-radius:6px;background:color-mix(in srgb,currentColor 14%,transparent)}
.bla.bla.bla.ph .rc-facts{grid-template-columns:1fr 1fr;gap:18px 14px;padding:16px}
.bla.bla.bla.ph .rc-facts > .pidf{grid-column:1/-1;padding-top:16px;box-shadow:inset 0 1px 0 var(--line)}
.bla.bla.bla.ph .rc .inote{margin:0 16px 14px}
.bla.bla.bla.ph .rc-foot{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px}
.bla.bla.bla.ph .rc-foot .q{display:none}
.bla.bla.bla.ph .rc-foot .btn{width:100%;height:40px;margin:0;padding:0 10px}
.bla.bla.bla.ph .rc-foot .btn.link{border-radius:11px;background:var(--panel2);color:var(--fg);box-shadow:inset 0 0 0 1px var(--line2)}
.bla.bla.bla.ph .inote{flex-wrap:wrap}
.bla.bla.bla.ph .inote .btn{margin-left:0}
.bla.bla.bla.ph .pm .cc{width:128px}
.bla.bla.bla.ph .mback{place-items:end center;padding:0}
.bla.bla.bla.ph .bmodal{width:390px;max-width:100%;max-height:92vh;border-radius:20px 20px 0 0;animation:bl_mSheet .24s var(--ease) both}
.bla.bla.bla.ph .mback.out .bmodal{animation:bl_mSheetOut .16s ease both}
@keyframes bl_mSheet{from{transform:translateY(100%)}}
@keyframes bl_mSheetOut{to{transform:translateY(100%)}}
.bla.bla.bla.ph .bmodal::before{content:"";position:absolute;top:8px;left:50%;width:36px;height:4px;margin-left:-18px;border-radius:2px;background:var(--line2)}
.bla.bla.bla.ph .mhead{padding:24px 56px 0 18px}
.bla.bla.bla.ph .mbody{padding:16px 18px 18px}
.bla.bla.bla.ph .mfoot{flex-direction:column-reverse;align-items:stretch;padding:12px 16px 20px}
.bla.bla.bla.ph .mfoot .btn{width:100%;height:44px}
.bla.bla.bla.ph .two.pc{grid-template-columns:110px minmax(0,1fr)}
.bla.bla.bla.ph .more{cursor:pointer;padding:14px 16px}
.bla.bla.bla.ph .more .btn{display:none}
.bla.bla.bla.ph .more .mchev{display:block;flex:none;margin-left:auto;color:var(--dim)}
.bla.bla.bla.ph .more .mchev svg{display:block;width:18px;height:18px}
.bla.bla.bla.ph .use{padding:16px}
.bla.bla.bla.ph .crow{grid-template-columns:auto minmax(0,1fr)}
.bla.bla.bla.ph .crow > .pill, .bla.bla.bla.ph .crow > .cacts{grid-column:2;justify-self:start}