:root{--ink-deep: #08060e;--ink0: #0e0d14;--ink1: #12111a;--ink2: #1a1824;--ink3: #242232;--ink4: #302d44;--line: #4a4560;--line-dim: #322e42;--line-hot: #8a7fc0;--gold: #e8c84a;--gold-light: #f5e07a;--gold-dark: #a8892a;--gold-warm: #ffd24a;--text: #ded9e8;--text-dim: #9a94ab;--text-faint: #8b8499;--hp: #4ad06a;--hp-low: #e8503c;--xp: #5aa8e8;--rage: #f5a04a;--ok: #7ee08a;--bad: #e87070;--warn: #f5a04a;--harden: #8ab4e8;--floor-a: #292b36;--floor-b: #303340;--map-wall: #735740;--font: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", sans-serif;--ease: cubic-bezier(.2, .7, .3, 1)}*{box-sizing:border-box}body{font-family:var(--font);color:var(--text)}.btn{font:inherit;font-size:13px;color:var(--text);background:linear-gradient(180deg,var(--ink3),var(--ink2));border:1px solid var(--line);border-radius:4px;padding:7px 12px;cursor:pointer;transition:transform .08s var(--ease),border-color .12s,background .12s;user-select:none;white-space:nowrap}.btn:hover:not(:disabled){border-color:var(--line-hot);background:linear-gradient(180deg,var(--ink4),var(--ink3))}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.42;cursor:not-allowed}.btn.gold{color:var(--ink0);background:linear-gradient(180deg,var(--gold-light),var(--gold));border-color:var(--gold-dark);font-weight:700}.btn.danger{color:#ffdede;border-color:#7a3a3a;background:linear-gradient(180deg,#4a1f24,#2a1418)}.btn.wide{width:100%;text-align:center}.hud{position:relative;width:100%;height:var(--hud-h, 48px);min-height:48px;display:flex;align-items:center;gap:10px;padding:0 10px;background:linear-gradient(180deg,var(--ink2),var(--ink0));border-bottom:1px solid var(--line-dim);font-size:12px;color:var(--text-dim);z-index:5;overflow:hidden}.hud .bar{position:relative;width:120px;height:12px;border:1px solid var(--line-dim);border-radius:3px;background:var(--ink0);overflow:hidden}.hud .bar>i{display:block;height:100%;width:0;transition:width .18s var(--ease)}.hud .bar.hp>i{background:linear-gradient(90deg,#2f9a4a,var(--hp))}.hud .bar.hp.low>i{background:linear-gradient(90deg,#a12c1e,var(--hp-low))}.hud .bar.rage>i{background:linear-gradient(90deg,#a85a10,var(--rage))}.hud .bar.sta>i{background:linear-gradient(90deg,#365a8a,var(--xp))}.hud .val{min-width:64px;color:var(--text);font-variant-numeric:tabular-nums}.hud .gold{color:var(--gold)}.hud .mats{color:var(--text-faint);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:250px}.hud .hud-spacer{flex:1 1 auto;min-width:0}.hud .hud-menu{flex:0 0 auto;display:grid;place-items:center;width:32px;height:32px;padding:0;font:inherit;font-size:15px;line-height:1;color:var(--text);background:linear-gradient(180deg,var(--ink3),var(--ink2));border:1px solid var(--line);border-radius:4px;cursor:pointer;transition:border-color .12s,background .12s,transform .08s var(--ease)}.hud .hud-menu:hover{border-color:var(--line-hot);background:linear-gradient(180deg,var(--ink4),var(--ink3))}.hud .hud-menu:active{transform:translateY(1px)}.hud .hud-menu:focus-visible{outline:2px solid var(--line-hot);outline-offset:1px}.toast-area{position:absolute;left:0;bottom:0;width:100%;padding:0 12px max(10px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:4px;pointer-events:none}.toast{align-self:flex-start;max-width:100%;padding:5px 10px;border-radius:4px;font-size:12px;line-height:1.5;background:#0a0810db;border:1px solid var(--line-dim);color:var(--text);animation:toast-in .16s var(--ease);white-space:pre-wrap}.toast.tutorial{border-color:var(--gold-dark);color:var(--gold-light)}@keyframes toast-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.modal-scrim{position:absolute;inset:0;background:#040308b8;display:grid;place-items:center;z-index:30}.modal{width:min(520px,calc(100% - 24px));max-width:calc(100% - 24px);max-height:calc(100% - 24px);display:flex;flex-direction:column;background:linear-gradient(180deg,var(--ink2),var(--ink0));border:1px solid var(--line);border-radius:6px;box-shadow:0 18px 48px #0009,inset 0 1px #ffffff0f;overflow:hidden}.modal.wide{width:min(640px,calc(100% - 24px))}.modal.card{width:min(560px,calc(100% - 24px))}.modal>header{padding:10px 14px;font-size:14px;color:var(--gold-light);border-bottom:1px solid var(--line-dim);background:linear-gradient(180deg,var(--ink3),var(--ink2))}.modal>.body{padding:12px 14px;overflow-y:auto;font-size:13px;line-height:1.7;color:var(--text);min-height:0}.modal>.body .row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px dashed var(--line-dim)}.modal>.body .row:last-child{border-bottom:none}.modal>.body .row .grow{flex:1;min-width:0}.modal>.body .row .sub{color:var(--text-dim);font-size:12px}.modal>footer{padding:10px 14px;display:flex;gap:8px;justify-content:flex-end;border-top:1px solid var(--line-dim);background:var(--ink1)}.menu-item{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;margin-bottom:6px;padding:8px 12px;font:inherit;font-size:13px;text-align:left;color:var(--text);background:var(--ink1);border:1px solid var(--line-dim);border-radius:4px;cursor:pointer;transition:border-color .12s,background .12s,transform .08s var(--ease)}.menu-item:hover{border-color:var(--line-hot);background:var(--ink2)}.menu-item:active{transform:translateY(1px)}.menu-item:focus-visible{outline:2px solid var(--line-hot);outline-offset:1px}.menu-item .menu-label{flex:0 0 auto;font-weight:700}.menu-item .sub{flex:1 1 auto;min-width:0;text-align:right;color:var(--text-dim);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.menu-summary{margin-top:10px;padding-top:8px;border-top:1px dashed var(--line-dim);color:var(--text-dim);font-size:12px;line-height:1.8}.battle{position:absolute;inset:0;padding:calc(var(--hud-h, 48px) + 8px) 12px 10px;display:flex;flex-direction:column;gap:6px;background:radial-gradient(circle at 50% 22%,#1b1526 0%,var(--ink-deep) 62%)}.battle .foe-row{display:flex;align-items:center;gap:12px;height:150px}.battle .foe-art{width:144px;height:144px;image-rendering:pixelated;filter:drop-shadow(0 6px 12px rgba(0,0,0,.6))}.battle .foe-art.hit{animation:flash .16s linear}@keyframes flash{0%{filter:brightness(3) saturate(0)}to{filter:none}}.battle .foe-info{flex:1;min-width:0}.battle .foe-name{font-size:15px;color:var(--gold-light);margin-bottom:4px}.battle .foe-name .tier{margin-left:8px;font-size:11px;color:var(--text-faint)}.battle .intent{display:inline-flex;align-items:center;gap:6px;margin-top:6px;padding:3px 8px;border:1px solid var(--line-dim);border-radius:3px;font-size:12px;color:var(--text-dim);background:var(--ink1)}.battle .intent.charge{color:var(--warn);border-color:#7a5220}.battle .intent.multi{color:var(--harden);border-color:#2f4a6a}.battle .dmg-float{position:absolute;font-size:20px;font-weight:700;color:var(--gold-warm);text-shadow:0 2px 6px #000;animation:float-up .7s var(--ease) forwards;pointer-events:none}@keyframes float-up{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-34px) scale(1.15)}}.battle .log{flex:1;min-height:0;overflow-y:auto;padding:6px 8px;border:1px solid var(--line-dim);border-radius:4px;background:#08060ea8;font-size:12px;line-height:1.6;color:var(--text-dim);white-space:pre-wrap}.battle .log b{color:var(--text)}.battle .actions{display:flex;flex-wrap:wrap;gap:6px}.battle .actions .btn{flex:1 1 auto;min-width:96px}.battle .hint{font-size:11px;color:var(--text-faint);text-align:center}.title{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:42px;gap:8px;background-color:var(--ink-deep);background-size:cover;background-position:center}.title:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#08060e1a,#08060eeb 68%)}.title>*{position:relative;z-index:1}.title h1{margin:0 0 6px;font-size:34px;letter-spacing:6px;color:var(--gold-light);text-shadow:0 3px 0 var(--gold-dark),0 10px 24px rgba(0,0,0,.8)}.title .sub{margin-bottom:14px;font-size:12px;color:var(--text-dim);letter-spacing:2px}.title .slot{width:min(360px,88vw)}.victory{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:radial-gradient(circle at 50% 40%,#241a2e,var(--ink-deep) 70%);text-align:center;padding:40px}.victory h1{margin:0;font-size:30px;letter-spacing:4px;color:var(--gold-light)}.victory h1.lose{color:var(--bad)}.victory .stats{font-size:13px;line-height:2;color:var(--text-dim)}.victory .stats b{color:var(--text)}[data-layout=tablet] .hud .mats,[data-layout=mobile] .hud .mats{display:none}[data-layout=mobile] .hud{height:auto;min-height:48px;flex-wrap:wrap;gap:6px 8px;padding:6px 8px;font-size:11px;overflow:visible}[data-layout=mobile] #stage{align-items:flex-start;padding-top:8px}[data-layout=mobile] .hud .bar{width:clamp(68px,26vw,96px);height:10px}[data-layout=mobile] .hud .val{min-width:0;font-size:11px}[data-layout=mobile] .hud .hud-menu{width:40px;height:40px;font-size:17px}[data-layout=mobile] .menu-item{min-height:48px}[data-layout=mobile] .toast{font-size:11.5px;padding:4px 8px}[data-layout=mobile] .modal{width:calc(100% - 16px);max-width:calc(100% - 16px);max-height:calc(100% - 16px)}[data-layout=mobile] .modal>.body{padding:10px 12px;font-size:12.5px}[data-layout=mobile] .modal>footer{flex-wrap:wrap}[data-layout=mobile] .btn{min-height:40px;padding:8px 10px}[data-layout=mobile] .battle{overflow-y:auto;padding:calc(var(--hud-h, 48px) + 6px) 8px 8px}[data-layout=mobile] .battle .foe-row{height:auto;min-height:96px;gap:10px}[data-layout=mobile] .battle .foe-art{width:88px;height:88px;flex:0 0 88px}[data-layout=mobile] .battle .foe-name{font-size:14px}[data-layout=mobile] .battle .log{flex:1 1 auto;min-height:72px;font-size:11.5px}[data-layout=mobile] .battle .actions .btn{flex:1 1 calc(50% - 6px);min-width:0;min-height:40px;white-space:normal}[data-layout=mobile] .battle .hint{display:none}[data-layout=mobile] .title{padding-bottom:max(24px,env(safe-area-inset-bottom))}[data-layout=mobile] .title h1{font-size:clamp(24px,9vw,32px);letter-spacing:3px}[data-layout=mobile] .title .sub{font-size:11px;letter-spacing:1px;text-align:center;padding:0 12px}[data-layout=mobile] .victory{padding:clamp(16px,5vw,28px);overflow-y:auto}[data-layout=mobile] .victory h1{font-size:24px}[data-layout=mobile] .victory .stats{font-size:12px;line-height:1.8;overflow-wrap:anywhere}[data-layout=mobile] .victory>div[style*="display:flex"]{flex-wrap:wrap;justify-content:center}.reduced-motion *,.reduced-motion *:before,.reduced-motion *:after{animation-duration:1ms!important;transition-duration:1ms!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;transition-duration:1ms!important}}:root{--font: "ArkPixel12", "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", sans-serif;--font-system: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", sans-serif;--frame: 4px;--hi: #3a3650;--lo: #0a0810;--shadow-hard: 0 2px 0 #000}body.ui-system-font{font-family:var(--font-system)}*{border-radius:0!important}.btn{font-size:12px;padding:4px 10px;border:var(--frame) solid transparent;border-image:url(/art/ui_frame.png) 4 / var(--frame) stretch;background:none;background-color:var(--ink2);box-shadow:none;transition:transform .08s steps(1),border-image-source 0s,background-color .12s}.btn:hover:not(:disabled){border-image-source:url(/art/ui_frame_hot.png);background-color:var(--ink3)}.btn:active:not(:disabled){transform:translateY(1px);border-image-source:url(/art/ui_frame_press.png)}.btn.gold{color:#1a1508;border-image-source:url(/art/ui_frame_gold.png);background-color:#e8c84a;background-image:none;font-weight:400}.btn.gold:hover:not(:disabled){background-color:#f5e07a}.btn.danger{color:#ffdede;border-image-source:url(/art/ui_frame.png);background-color:#4a1f24;background-image:none}.hud{background:var(--ink1);background-image:none;border-bottom:2px solid var(--line-dim);font-size:12px;color:var(--text-dim);letter-spacing:0}.hud .val{color:var(--text);font-variant-numeric:tabular-nums}.hud .bar{height:12px;border:1px solid var(--line-dim);background:var(--lo);background-image:none}.hud .bar>i{transition:width .18s steps(6)}.hud .bar.hp>i{background:var(--hp);background-image:repeating-linear-gradient(90deg,transparent 0 5px,rgba(0,0,0,.55) 5px 6px)}.hud .bar.hp.low>i{background:var(--hp-low);background-image:repeating-linear-gradient(90deg,transparent 0 5px,rgba(0,0,0,.55) 5px 6px)}.hud .bar.rage>i{background:var(--rage);background-image:repeating-linear-gradient(90deg,transparent 0 5px,rgba(0,0,0,.55) 5px 6px)}.hud .bar.sta>i{background:var(--xp);background-image:repeating-linear-gradient(90deg,transparent 0 5px,rgba(0,0,0,.55) 5px 6px)}.hud .mats{font-size:12px}.hud .hud-menu{border:var(--frame) solid transparent;border-image:url(/art/ui_frame.png) 4 / var(--frame) stretch;background:none;background-color:var(--ink2);font-size:12px}.hud .hud-menu:hover{border-image-source:url(/art/ui_frame_hot.png);background-color:var(--ink3)}.menu-item{font-size:12px;padding:6px 10px;border:var(--frame) solid transparent;border-image:url(/art/ui_frame.png) 4 / var(--frame) stretch;background:none;background-color:var(--ink1)}.menu-item:hover{border-image-source:url(/art/ui_frame_hot.png);background-color:var(--ink2)}.menu-item .sub,.menu-summary{font-size:12px}.toast{font-size:12px;padding:3px 8px;border:2px solid var(--line-dim);background:#0a0810f0;box-shadow:var(--shadow-hard)}.toast.tutorial{border-color:var(--gold-dark)}.modal{border:var(--frame) solid transparent;border-image:url(/art/ui_frame.png) 4 / var(--frame) stretch;background:none;background-color:var(--ink1);box-shadow:var(--shadow-hard)}.modal>header{font-size:12px;padding:6px 10px;color:var(--gold-light);border-bottom:2px solid var(--line-dim);background:var(--ink2);background-image:none;letter-spacing:1px}.modal>.body{font-size:12px;line-height:1.6;padding:10px 12px}.modal>.body .row{padding:5px 0;border-bottom:1px dashed var(--line-dim)}.modal>.body .row .sub{font-size:12px}.modal>footer{padding:8px 10px;border-top:2px solid var(--line-dim);background:var(--ink0)}.modal textarea,.modal input[type=text]{font-family:inherit;font-size:12px;border:1px solid var(--line)!important;background:var(--lo)!important;color:var(--text)!important}.battle{background:var(--ink-deep);background-image:none}.battle .foe-name,.battle .foe-name .tier{font-size:12px}.battle .foe-art{filter:none}.battle .intent{display:flex;align-items:center;gap:8px;margin-top:6px;padding:4px 8px;border:2px solid var(--line-dim);background:var(--ink1);--intent: var(--text-faint)}.battle .intent-badge{font-size:24px;line-height:1;min-width:26px;text-align:center;color:var(--intent)}.battle .intent-text{font-size:12px;color:var(--text-dim)}.battle .intent[data-tier="0"] .intent-badge,.battle .intent[data-tier="1"] .intent-badge{color:var(--text-faint)}.battle .intent[data-tier="2"][data-intent=attack]{border-color:#7a3a3a;--intent: #e87070}.battle .intent[data-tier="2"][data-intent=chargeStrike]{border-color:#7a5220;--intent: #f5a04a}.battle .intent[data-tier="2"][data-intent=multiHit]{border-color:#2f4a6a;--intent: #5aa8e8}.battle .intent[data-tier="2"][data-intent=heal]{border-color:#2e5a38;--intent: #7ee08a}.battle .intent[data-tier="2"][data-intent=buff]{border-color:#4a3a6a;--intent: #a87ad0}.battle .foe-family{margin-left:8px;font-size:12px;color:var(--text-dim);border:1px solid var(--line-dim);padding:0 4px}.battle .foe-bar{width:100%;height:14px;border:1px solid var(--line-dim);background:var(--lo);overflow:hidden}.battle .foe-bar>i{display:block;height:100%;background:#e8503c;background-image:repeating-linear-gradient(90deg,transparent 0 5px,rgba(0,0,0,.55) 5px 6px);transition:width .18s steps(6)}.battle .log{font-size:12px;padding:4px 6px;border:2px solid var(--line-dim);background:var(--lo)}.battle .hint{font-size:12px}.battle .dmg-float{text-shadow:2px 2px 0 #000}.battle .actions .btn{min-width:92px}.title h1{font-size:24px;letter-spacing:4px;text-shadow:0 2px 0 var(--gold-dark)}.title .sub{font-size:12px;letter-spacing:1px}.victory{background:var(--ink-deep);background-image:none}.victory h1{font-size:24px;letter-spacing:3px;text-shadow:0 2px 0 var(--lo)}.victory .stats{font-size:12px;line-height:1.9}[data-layout=mobile] .hud,[data-layout=mobile] .hud .val,[data-layout=mobile] .toast,[data-layout=mobile] .battle .log,[data-layout=mobile] .modal>.body,[data-layout=mobile] .victory .stats{font-size:12px}[data-layout=mobile] .hud .bar{height:10px}[data-layout=mobile] .title h1{font-size:24px;letter-spacing:2px}[data-layout=mobile] .title .sub{font-size:12px;letter-spacing:1px}[data-layout=mobile] .btn{font-size:12px}.btn:focus-visible,.menu-item:focus-visible,.hud .hud-menu:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.slot-cell,.slot-card{--rarity: var(--line);position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:4px;font:inherit;color:var(--text);background:var(--ink1);border:2px solid var(--rarity);box-shadow:inset 0 0 0 1px #0000008c;cursor:pointer;min-height:56px}.slot-cell:hover,.slot-card:hover{background:var(--ink2)}.slot-cell:active{transform:translateY(1px)}.slot-cell.sel{outline:2px solid var(--gold);outline-offset:1px;background:var(--ink3)}.title-slot-row{display:flex;gap:6px;align-items:stretch}.title-slot-row .btn.slot{flex:1;min-width:0}.slot-del{flex:0 0 auto}.slot-card.picked{outline:2px solid var(--gold);outline-offset:1px;background:var(--ink3)}.slot-cell.sel:after{content:"";position:absolute;top:0;right:0;border:6px solid transparent;border-top-color:var(--gold);border-right-color:var(--gold)}.slot-cell:disabled,.slot-cell.empty{opacity:.55;cursor:default}.item-icon{width:32px;height:32px;image-rendering:pixelated;pointer-events:none}.item-icon-lg{width:64px;height:64px;image-rendering:pixelated;pointer-events:none}.item-icon-sm{width:16px;height:16px;image-rendering:pixelated;pointer-events:none}.goal-bar{position:fixed;top:52px;left:50%;transform:translate(-50%);z-index:6;padding:4px 10px;font-size:12px;color:var(--gold-light);background:var(--ink1);border:2px solid var(--gold);max-width:calc(100% - 24px);pointer-events:none}.goal-bar-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.goal-bar-detail{margin-top:2px;font-size:12px;color:var(--text-dim);white-space:normal;line-height:1.35}.coin-icon{width:12px;height:12px;image-rendering:pixelated;vertical-align:-1px;margin-right:2px}.coin-line{display:inline-flex;align-items:center;gap:3px;color:var(--gold)}.coin-line .item-icon-sm{width:16px;height:16px}.item-icon-missing{width:32px;height:32px;border:1px dashed var(--line-dim);background:var(--lo)}.item-icon-missing.lg{width:64px;height:64px}.slot-name{max-width:100%;font-size:12px;line-height:1.2;color:var(--text-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slot-count{position:absolute;right:2px;bottom:1px;font-size:12px;color:var(--text);text-shadow:1px 1px 0 #000;pointer-events:none}.slot-plus{position:absolute;left:2px;top:1px;font-size:12px;color:var(--gold-light);text-shadow:1px 1px 0 #000;pointer-events:none}.gear-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;margin-bottom:8px}.slot-card{flex-direction:row;justify-content:flex-start;gap:8px;padding:6px 8px;min-height:76px;cursor:default}.slot-card .card-body{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;text-align:left}.slot-card .card-title{font-size:12px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slot-card .card-sub{font-size:12px;color:var(--text-dim)}.slot-card .card-actions{display:flex;gap:4px;margin-top:2px}.bag-grid,.mat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:6px}.mat-grid{grid-template-columns:repeat(auto-fill,minmax(52px,1fr))}.slot-actions{display:flex;gap:6px;margin-top:8px;min-height:40px;align-items:center}.section-title{margin:10px 0 6px;font-size:12px;color:var(--text-dim);border-bottom:1px solid var(--line-dim);padding-bottom:3px}.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}.shop-card{display:flex;gap:8px;padding:6px 8px;background:var(--ink1);border:2px solid var(--line-dim);align-items:center}.shop-card .card-body{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}.shop-card .price{font-size:12px;color:var(--gold)}.cost-row{display:flex;flex-wrap:wrap;gap:4px;align-items:center}.cost-chip{display:inline-flex;align-items:center;gap:2px;font-size:12px;color:var(--text-dim);border:1px solid var(--line-dim);padding:1px 4px 1px 2px}.cost-chip img{width:16px;height:16px;image-rendering:pixelated}.rarity-common{--rarity: #8b8499}.rarity-uncommon{--rarity: #5aa8e8}.rarity-rare{--rarity: #a87ad0}.rarity-legendary{--rarity: #e8c84a}#stage{background-color:#0d0a14;background-image:url(/art/bg-dungeon.png);background-repeat:repeat;background-size:256px 256px;image-rendering:pixelated}[data-layout=mobile] .shop-grid{grid-template-columns:1fr}[data-layout=mobile] .bag-grid{grid-template-columns:repeat(auto-fill,minmax(56px,1fr))}
