:root { --ink:#0b0b0b; --paper:#f9f0dd; --rust:#833823; --teal:#3f6461; --red:#d72d24; }
* { box-sizing:border-box; }
html { background:#000; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Arial,sans-serif; letter-spacing:0; }
a { color:inherit; } button,input { font:inherit; } button { cursor:pointer; } button:focus-visible,a:focus-visible,input:focus-visible { outline:3px solid var(--rust); outline-offset:5px; }
.page { position:relative; min-height:100vh; overflow:hidden; background:var(--paper); }
.page::before { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:url('assets/Kapital Krushers/SVGs/Background.svg') center top / min(100%,980px) auto; opacity:.92; }
.shell,.footer { position:relative; z-index:1; }
.shell {
  --frame-side-width: clamp(5px, .58vw, 8px);
  --frame-top-left-width: clamp(40px, 5.1vw, 62px);
  --frame-top-right-width: clamp(46px, 5.9vw, 72px);
  --frame-bottom-left-width: clamp(31px, 4.2vw, 48px);
  --frame-bottom-right-width: clamp(29px, 3.8vw, 44px);
  --frame-top-left-height: clamp(42px, 5.3vw, 64px);
  --frame-top-right-height: clamp(46px, 5.9vw, 72px);
  --frame-bottom-left-height: clamp(32px, 4.3vw, 49px);
  --frame-bottom-right-height: clamp(28px, 3.6vw, 42px);
  --frame-bottom-corner-lift: 6px;
  --frame-bottom-center-drop: 5px;
  --main-top-center-height: clamp(8px, .62vw, 12px);
  --main-bottom-center-height: 9.45px;
  position:relative;
  overflow:hidden;
  padding-bottom:clamp(7px, .9vw, 12px);
}
.frame-piece { position:absolute; z-index:3; pointer-events:none; display:block; }
.frame-top-left { top:0; left:0; width:var(--frame-top-left-width); }.frame-top-right { top:1.5px; right:0; width:var(--frame-top-right-width); }
.frame-top-center { left:calc(var(--frame-top-left-width) - 2px); top:0; z-index:3; width:calc(100% - var(--frame-top-left-width) - var(--frame-top-right-width) + 4px); height:var(--main-top-center-height); }
.frame-left,.frame-right { top:calc(var(--frame-top-left-height) - 2px); width:var(--frame-side-width); object-fit:fill; z-index:3; }.frame-left{left:0;height:calc(100% - var(--frame-top-left-height) - var(--frame-bottom-left-height) - var(--frame-bottom-corner-lift) + 4px)}.frame-right{right:0;top:calc(var(--frame-top-right-height) - 2px);height:calc(100% - var(--frame-top-right-height) - var(--frame-bottom-right-height) - var(--frame-bottom-corner-lift) + 4px)}
.frame-bottom-left { bottom:var(--frame-bottom-corner-lift); left:0; width:var(--frame-bottom-left-width); }.frame-bottom-right { right:2px; bottom:var(--frame-bottom-corner-lift); width:var(--frame-bottom-right-width); }
.frame-bottom-center { left:calc(var(--frame-bottom-left-width) - 2px); bottom:calc(var(--frame-bottom-corner-lift) - var(--frame-bottom-center-drop)); z-index:5; width:calc(100% - var(--frame-bottom-left-width) - var(--frame-bottom-right-width) + 4px); height:var(--main-bottom-center-height); }
.topbar { position:relative; z-index:2; height:clamp(48px,7.2vw,86px); }
.topbar::before { content:none; }
.nav { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:clamp(10px,2vw,28px); height:100%; padding:0 clamp(24px,4.2vw,64px); }
.mark { width:clamp(44px,6.2vw,66px); display:block; transition:transform 120ms ease; }
.nav-links { display:flex; align-items:center; justify-content:center; gap:clamp(16px,3.5vw,48px); }
.back { display:inline-flex; align-items:center; width:min(16vw,96px); min-width:78px; }.back svg{width:100%;height:auto;display:block;overflow:hidden}
.divider { width:2px; height:clamp(20px,3vw,31px); object-fit:fill; }.lore { width:auto;height:clamp(14px,1.61vw,24px);display:block;transition:transform 120ms ease; }.cart { width:clamp(29px,4.7vw,50px);display:block;transform:rotate(4deg);transition:transform 120ms ease; }.sun{width:clamp(46px,7.4vw,78px);display:block;transform:translateY(clamp(15px,2vw,26px));transition:transform 160ms ease}
.back:hover,.back:focus-visible{transform:translateX(-3px) rotate(-2deg);outline:none}.lore-link:hover .lore,.lore-link:focus-visible .lore{transform:rotate(5deg) translateY(-2px) scale(1.06)}.cart-link:hover .cart,.cart-link:focus-visible .cart{transform:rotate(13deg) translateY(-2px) scale(1.08)}.mark,.sun{transition:transform 160ms ease}.mark:hover{transform:translateX(-3px) rotate(-2deg)}.sun:hover{transform:rotate(18deg) scale(1.04)}.sun-link:hover .sun,.sun-link:focus-visible .sun{transform:rotate(18deg) scale(1.04)}
.sun-link{display:block;transform:translateY(clamp(15px,2vw,26px))}.sun{transform:none}.sun-link:hover .sun{transform:rotate(18deg) scale(1.04)}
.brand { position:relative; z-index:1; display:grid; place-items:center; gap:8px; padding:clamp(24px,3vw,46px) 20px 12px; }.brand-logo { width:min(74vw,700px); max-height:240px; object-fit:contain; animation:ft-logo-float 5s linear infinite; }.line-logo { width:min(56vw,360px); height:clamp(54px,8vw,92px); object-fit:contain; }@keyframes ft-logo-float{0%{translate:0 0}10%{translate:0 -2.35px}20%{translate:0 -3.8px}25%{translate:0 -4px}30%{translate:0 -3.8px}40%{translate:0 -2.35px}50%{translate:0 0}60%{translate:0 2.35px}70%{translate:0 3.8px}75%{translate:0 4px}80%{translate:0 3.8px}90%{translate:0 2.35px}100%{translate:0 0}}
.wrap { position:relative; z-index:1; width:min(1200px,100%); margin:0 auto; padding:8px 46px 56px; }.back-link { display:inline-block; margin-bottom:24px; font-family:Impact,'Arial Black',sans-serif; font-size:16px; text-transform:uppercase; text-underline-offset:4px; }
.browser { margin-bottom:38px; padding-bottom:20px; border-bottom:3px solid var(--ink); }.browser-head { display:flex; align-items:end; justify-content:space-between; gap:20px; }.browser h2,.summary h1,.details h2 { font-family:Impact,'Arial Black',sans-serif; text-transform:uppercase; }.browser h2 { margin:0; font-size:34px; }.browser-count { margin:0; font-weight:bold; white-space:nowrap; }
.larvae-list { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); grid-template-rows:repeat(2,auto); gap:clamp(2px,.7vw,9px); margin-top:20px; }.larvae-choice { position:relative; min-width:0; padding:2px; border:2px solid transparent; background:var(--paper); cursor:pointer; }.larvae-choice:hover,.larvae-choice:focus-visible{border-color:var(--teal);transform:translateY(-2px) rotate(-1deg)}.larvae-choice[aria-pressed=true]{border-color:var(--ink)}.larvae-choice img{display:block;width:100%;aspect-ratio:1;object-fit:cover;background:#eee3cf}.larvae-choice{transition:transform 120ms ease,border-color 120ms ease}.larvae-choice.is-sold-out{border-color:var(--red)}.larvae-choice.is-sold-out::before,.larvae-choice.is-sold-out::after{content:"";position:absolute;z-index:1;top:50%;left:-12%;width:124%;height:7px;border-radius:999px;background:var(--red);box-shadow:0 0 0 1px rgb(249 240 221 / 70%);pointer-events:none}.larvae-choice.is-sold-out::before{transform:rotate(45deg)}.larvae-choice.is-sold-out::after{transform:rotate(-45deg)}.larvae-choice.is-sold-out img{opacity:.58}
.product { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(360px,1fr); gap:56px; align-items:start; }.stage { position:relative; aspect-ratio:1; overflow:hidden; background:#eee3cf; border:0; }.stage img{display:block;width:100%;height:100%;object-fit:contain}.arrow{position:absolute;top:50%;z-index:1;width:44px;height:44px;border:2px solid var(--ink);background:var(--paper);font-size:28px;line-height:1;transform:translateY(-50%);transition:transform 120ms ease}.arrow:hover,.arrow:focus-visible{transform:translateY(calc(-50% - 2px)) rotate(-1deg)}.prev{left:12px}.next{right:12px}.photo-count{margin:10px 0 0;font-size:13px;text-align:right}.thumbs{display:flex;justify-content:center;gap:10px;min-height:86px;margin-top:14px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}.thumbs button{flex:0 0 76px;width:76px;height:76px;padding:3px;border:2px solid transparent;background:var(--paper)}.thumbs button[aria-pressed=true]{border-color:transparent;background:#eee3cf}.thumbs img{display:block;width:100%;height:100%;object-fit:cover}
.summary{padding:12px 0}.series{margin:4px 0 12px;font-family:Impact,'Arial Black',sans-serif;font-size:16px;text-transform:uppercase}.summary h1{margin:0 0 14px;font-size:clamp(44px,5vw,62px);line-height:1.03;overflow-wrap:anywhere}.selection{display:inline-block;padding:6px 0;border-bottom:2px solid var(--ink);font-weight:800}.intro{margin:24px 0;font-size:18px;line-height:1.65}.price{margin:24px 0 16px;font-size:17px;font-weight:bold}.buy{display:flex;align-items:stretch;gap:14px}.qty{display:flex;min-height:54px;border:2px solid var(--ink);align-items:center}.qty button{width:32px;border:0;background:var(--paper);font-size:24px;transition:transform 120ms ease}.qty button:hover{transform:translateY(-2px) rotate(-1deg)}.qty input{width:36px;border:0;background:var(--paper);text-align:center;appearance:textfield}.qty input::-webkit-inner-spin-button{appearance:none}.add{flex:1;max-width:280px;min-height:54px;border:2px solid var(--ink);background:var(--rust);color:var(--paper);font-family:Impact,'Arial Black',sans-serif;font-size:21px;letter-spacing:1px;text-transform:uppercase;box-shadow:4px 4px var(--ink);transition:transform 120ms ease,background 120ms ease}.add:hover,.add:focus-visible{transform:translateY(-2px) rotate(-1deg);background:#a94b30}.add:disabled{cursor:not-allowed;opacity:.5;box-shadow:none}.cart-note{min-height:20px;margin:12px 0 0;font-size:13px;font-weight:bold}.shipping{margin:16px 0 28px;font-size:14px;line-height:1.6}.details{border-top:2px solid var(--ink);padding-top:20px;line-height:1.65}.details h2{margin:0 0 8px;font-size:17px}.details p{margin:0}
.footer{min-height:112px;border-top:3px solid var(--ink);border-bottom:8px solid var(--ink);background:var(--paper);padding:26px 28px 18px}.footer-content{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}.footer-content img{max-height:44px;width:auto}.footer-form{position:relative;display:flex;align-items:center;min-width:min(440px,80vw);height:42px}.footer-form>img{position:absolute;inset:0;width:100%;height:100%;max-height:none;pointer-events:none}.footer-form input{position:relative;width:100%;height:100%;padding:6px 14px;border:0;background:transparent;color:var(--ink);font-family:Impact,'Arial Black',sans-serif;font-size:15px}.signup{border:0;background:transparent;padding:0}.signup img{display:block}.legal{position:relative;z-index:1;display:flex;justify-content:center;gap:24px;flex-wrap:wrap;padding:20px;background:var(--ink);color:var(--paper);font-size:14px}.legal a:hover{transform:translateY(-2px) rotate(-1deg)}
dialog{width:min(440px,calc(100% - 40px));border:3px solid var(--ink);background:var(--paper);padding:26px;line-height:1.6}dialog::backdrop{background:#0008}dialog button{padding:10px 22px;border:2px solid var(--ink);background:var(--rust);color:var(--paper)}
.add.is-added:disabled{opacity:1;cursor:default;background:#713725}
.add.is-coming:disabled{opacity:1;cursor:default;background:var(--rust);box-shadow:4px 4px var(--ink)}
.qty select{width:56px;border:0;background:var(--paper);color:var(--ink);font:inherit;font-weight:800;text-align:center;appearance:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.character-lore-link{display:inline-block;margin:-7px 0 12px;color:var(--rust);font-size:13px;font-weight:800;text-transform:uppercase;text-underline-offset:4px}.character-lore-link[hidden]{display:none}.character-lore-link:hover,.character-lore-link:focus-visible{transform:translateY(-2px) rotate(-1deg)}
.noise-filter-def{position:absolute;width:0;height:0;overflow:hidden}.stage{background:var(--paper)}.stage img{position:relative;z-index:0}.stage::before,.stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:url('assets/Kapital Krushers/SVGs/Background.svg') center / 900px auto;filter:url(#kk-noise-only)}.stage::before{z-index:1;opacity:.86;-webkit-mask-image:radial-gradient(circle at 0 0,#000 0%,#000 29%,transparent 54%),radial-gradient(circle at 100% 0,#000 0%,#000 29%,transparent 54%);-webkit-mask-composite:source-over;mask-image:radial-gradient(circle at 0 0,#000 0%,#000 29%,transparent 54%),radial-gradient(circle at 100% 0,#000 0%,#000 29%,transparent 54%);mask-composite:add}.stage::after{z-index:2;opacity:.52;-webkit-mask-image:radial-gradient(ellipse 58% 58% at center,transparent 0%,transparent 55%,#000 79%);mask-image:radial-gradient(ellipse 58% 58% at center,transparent 0%,transparent 55%,#000 79%)}.stage .arrow{z-index:3}
.stage::before{display:block;background-position:center -180px}
.splug-page .larvae-list{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto;max-width:720px;margin-inline:auto}.splug-page .browser-count{text-transform:uppercase}
.splug-page .larvae-choice{overflow:hidden;padding:0;border:0;background:var(--paper)}.splug-page .larvae-choice:hover,.splug-page .larvae-choice:focus-visible,.splug-page .larvae-choice[aria-pressed=true]{border-color:transparent;background:var(--paper)}.splug-page .larvae-choice img{position:relative;z-index:0;object-fit:cover}.splug-page .larvae-choice::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:url('assets/Kapital Krushers/SVGs/Background.svg') center / 410px auto;filter:url(#kk-noise-only);opacity:.62;-webkit-mask-image:radial-gradient(ellipse 56% 56% at center,transparent 0%,transparent 48%,#000 80%);mask-image:radial-gradient(ellipse 56% 56% at center,transparent 0%,transparent 48%,#000 80%)}
.splug-page .thumbs{flex-wrap:nowrap;justify-content:center;overflow:hidden;min-height:0}.splug-page .thumbs button{flex:1 1 0;min-width:0;width:auto;height:auto;aspect-ratio:1}
@media(max-width:760px){.nav{grid-template-columns:auto minmax(0,1fr) auto;padding:0 20px}.mark{width:32px}.sun{width:36px}.nav-links{gap:12px}.back{min-width:78px;width:88px}.divider{display:none}.brand{padding-top:18px}.brand-logo{width:min(88vw,500px);max-height:160px}.line-logo{width:min(70vw,280px)}.wrap{padding:8px 20px 42px}.browser{margin-bottom:30px}.browser-head{align-items:start;flex-direction:column;gap:5px}.browser h2{font-size:28px}.larvae-list{gap:2px}.product{grid-template-columns:1fr;gap:26px}.summary{padding:0}.buy{gap:8px}.add{max-width:230px;font-size:18px}.splug-page .thumbs{display:grid;grid-template-columns:repeat(auto-fit,minmax(32px,1fr));gap:5px;min-height:0;overflow:hidden;padding-bottom:0}.splug-page .thumbs button{width:100%;height:auto;min-width:0;aspect-ratio:1;flex:none}.footer-form{min-width:min(320px,84vw)}.footer-content{gap:10px}.footer-content>img{max-height:34px}}