@font-face{font-family:Anton;src:url(assets/fonts/Anton-Regular.ttf) format('truetype');font-display:swap}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#f1e9ff;background:#0b0620;line-height:1.4;-webkit-tap-highlight-color:transparent}
/* Bakgrunn: Fredrikstad (kveld) møter Costa Blanca (solnedgang). Fast lag bak alt, dempet så teksten er lesbar. */
body::before{content:'';position:fixed;inset:0;z-index:-2;background:url(assets/bg_wide.jpg) center/cover no-repeat}
body::after{content:'';position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 50%,#0b062099 0%,#0b0620bb 55%,#0b0620e0 100%)}
@media (max-aspect-ratio:1/1){body::before{background-image:url(assets/bg_tall.jpg)}body::after{background:linear-gradient(180deg,#0b0620aa,#0b0620cc 50%,#0b0620dd)}}
[hidden]{display:none!important}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
input,select{font:inherit;color:#fff;background:#0c0620;border:1px solid #ff2fb477;border-radius:10px;padding:.6rem .7rem;width:100%}
input:focus,select:focus{outline:2px solid #3ab8ff;border-color:transparent}
.screen{min-height:100vh;min-height:100dvh}
.logo{font-family:Anton,Impact,sans-serif;font-weight:400;font-size:clamp(3.2rem,16vw,6rem);letter-spacing:.04em;line-height:1;color:#ffb347;text-shadow:0 0 6px #ff8a00,0 0 18px #ff6a00,0 0 40px #ff3d00;text-align:center}
.logo.small{font-size:2.6rem}
.sub{font-family:Anton,Impact,sans-serif;color:#8dff7a;letter-spacing:.2em;text-shadow:0 0 8px #39ff14;text-align:center;margin-top:.2rem}
.home,.lobby{max-width:460px;margin:auto;padding:1.4rem 1rem 3rem;display:flex;flex-direction:column;gap:1rem}
.home h2{text-align:center;color:#ff6ad5;text-shadow:0 0 10px #ff2fb4}
.home-figs{display:block;height:150px;margin:.3rem auto;filter:drop-shadow(0 0 14px #ff8a0088)}
.fld{display:flex;flex-direction:column;gap:.3rem;font-weight:700;font-size:.9rem;color:#d9c8ff}
.btns{display:flex;flex-direction:column;gap:.7rem}
.row{display:flex;gap:.5rem;flex-wrap:wrap}
.row>.btn{flex:1}
.btn{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;padding:.65rem 1rem;border-radius:14px;background:#24124a;border:1px solid #ffffff22;font-weight:800;transition:transform .1s,filter .1s;text-align:center}
.btn:active{transform:scale(.97)}
.btn:disabled{opacity:.4;cursor:not-allowed}
.btn small{font-weight:500;opacity:.85;font-size:.8rem}
.btn.big{padding:1rem;font-size:1.1rem}
.btn.orange{background:linear-gradient(180deg,#ff9a2a,#ff6a00);color:#1b0800;box-shadow:0 0 16px #ff6a0077}
.btn.blue{background:linear-gradient(180deg,#4cc3ff,#1a8fe0);color:#001428;box-shadow:0 0 16px #3ab8ff66}
.btn.green{background:linear-gradient(180deg,#5af07a,#1db954);color:#032110;box-shadow:0 0 16px #1db95466}
.btn.red{background:linear-gradient(180deg,#ff5b6b,#d81b3a);color:#fff}
.btn.sm{padding:.35rem .6rem;font-size:.8rem;border-radius:10px}
.fine{font-size:.82rem;opacity:.75;text-align:center}
.card{background:#120828cc;border:1px solid #ff2fb455;border-radius:16px;padding:1rem;box-shadow:0 0 20px #3ab8ff22;display:flex;flex-direction:column;gap:.7rem}
.card h3{color:#ff6ad5}
.room{text-align:center}
.room .code{font-family:Anton,Impact,sans-serif;font-size:3rem;letter-spacing:.2em;color:#8dff7a;text-shadow:0 0 10px #39ff14}
.room .link{font-size:.75rem;opacity:.7;word-break:break-all}
.net{font-size:.85rem}
.plist{list-style:none;display:flex;flex-direction:column;gap:.4rem}
.plist li{display:flex;flex-direction:column;align-items:stretch;gap:.4rem;background:#0c0620;border-radius:12px;padding:.4rem .6rem}
.plist .prow{display:flex;align-items:center;gap:.6rem}
.plist img{height:38px;width:38px;object-fit:contain}
.plist .nm{flex:1;font-weight:700}
.plist .tag{font-size:.75rem;opacity:.75}
.tokens{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.4rem}
.tokens.mini{grid-template-columns:repeat(6,minmax(0,1fr));gap:.25rem}
.tokens.mini .tok{padding:.2rem;font-size:0;gap:0;background:#1a0e36}
.tokens.mini .tok img{height:30px}
@media (max-width:360px){.tokens{grid-template-columns:repeat(3,minmax(0,1fr))}}
.tok{background:#0c0620;border:2px solid transparent;border-radius:12px;padding:.3rem;display:flex;flex-direction:column;align-items:center;font-size:.65rem;gap:.1rem;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tok img{height:42px;width:100%;object-fit:contain}
.tok.on{border-color:#ff8a00;box-shadow:0 0 10px #ff8a0088}
.tok:disabled{opacity:.25;filter:grayscale(1)}
.pickhint{font-size:.78rem;opacity:.8}
.wait{text-align:center;font-weight:700;color:#8dff7a}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:.45rem;padding:.4rem .6rem;padding-top:max(.4rem,env(safe-area-inset-top));background:#0b0620ee;border-bottom:1px solid #ff2fb444;backdrop-filter:blur(6px)}
.brand{font-family:Anton,Impact,sans-serif;color:#ffb347;text-shadow:0 0 8px #ff6a00;font-size:1.25rem;letter-spacing:.04em}
.chip{font-size:.72rem;font-weight:800;padding:.15rem .5rem;border-radius:999px;background:#24124a;white-space:nowrap}
.chip:empty{display:none}
.dot{width:10px;height:10px;border-radius:50%;background:#666}
.dot.ok{background:#39ff14;box-shadow:0 0 8px #39ff14}.dot.bad{background:#ff3b3b;box-shadow:0 0 8px #ff3b3b}.dot.local{display:none}
.spacer{flex:1}
.icon{font-size:1.15rem;width:36px;height:36px;border-radius:10px;background:#24124a}
.chk{display:flex;gap:.6rem;align-items:center;font-weight:600;font-size:.9rem}
.chk input{width:22px;height:22px;flex:none;accent-color:#ff8a00}
.plist .pick{display:block}
/* ---------- SPILL ---------- */
.gamegrid{--bs:min(100vw - 12px, 100dvh - 70px, 720px);--fw:calc(var(--bs)*.03);display:flex;flex-direction:column;align-items:center;gap:.6rem;padding:6px}
/* ---------- RAMME (3D, krom + neon) ---------- */
.boardwrap{position:relative;width:max-content;padding:calc(var(--fw)*1.5) var(--fw);border-radius:calc(var(--fw)*1.1);
  background:linear-gradient(160deg,#4a3a6e 0%,#1d1236 22%,#2b1c4f 50%,#130a28 78%,#3b2a5e 100%);
  box-shadow:0 0 0 2px #ff2fb4,0 0 22px #ff2fb488,0 0 60px #3ab8ff44,0 18px 40px #000c,inset 0 2px 0 #ffffff55,inset 0 -3px 0 #0008,inset 0 0 0 calc(var(--fw)*.25) #ffffff0d}
.boardwrap::before{content:'';position:absolute;inset:calc(var(--fw)*1.5 - 4px) calc(var(--fw) - 4px);border-radius:8px;box-shadow:0 0 0 2px #0b0620,0 0 0 4px #ffb347,0 0 14px 4px #ff8a0099;pointer-events:none;z-index:2}
.bolt{position:absolute;width:calc(var(--fw)*.55);height:calc(var(--fw)*.55);border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#b9b3d6 35%,#4b4470 75%);box-shadow:0 1px 2px #000a}
.bolt.b1{left:calc(var(--fw)*.22);top:calc(var(--fw)*.45)}.bolt.b2{right:calc(var(--fw)*.22);top:calc(var(--fw)*.45)}
.bolt.b3{left:calc(var(--fw)*.22);bottom:calc(var(--fw)*.45)}.bolt.b4{right:calc(var(--fw)*.22);bottom:calc(var(--fw)*.45)}
.plaque{position:absolute;left:50%;transform:translateX(-50%);z-index:3;font-family:Anton,Impact,sans-serif;letter-spacing:.14em;white-space:nowrap;
  font-size:max(9px,calc(var(--fw)*.62));line-height:1;padding:.28em 1em;border-radius:999px;color:#fff}
.plaque.top{top:calc(var(--fw)*.25);background:linear-gradient(180deg,#ff9a2a,#d8430f);box-shadow:0 0 12px #ff6a00,inset 0 1px 0 #ffd9a0;text-shadow:0 1px 0 #6a1d00}
.plaque.bot{bottom:calc(var(--fw)*.25);background:linear-gradient(180deg,#4cc3ff,#1a5fb0);box-shadow:0 0 12px #3ab8ff,inset 0 1px 0 #c8efff;text-shadow:0 1px 0 #002244}
.board{position:relative;width:calc(var(--bs) - var(--fw)*2);aspect-ratio:1/1;user-select:none;-webkit-user-select:none;background:#07031a;border-radius:6px;overflow:hidden}
/* ---------- RUTER ---------- */
.cells{position:absolute;inset:0;display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr);gap:2px;padding:2px;background:#07031a}
.cell{--n:#3ab8ff;position:relative;border-radius:14%;display:flex;align-items:flex-start;justify-content:flex-start;padding:5% 7%;overflow:hidden;background-size:260% 260%;
  box-shadow:inset 0 0 0 1.5px var(--n),inset 0 0 calc(var(--bs)*.012) var(--n),inset 0 calc(var(--bs)*.006) 0 #ffffff30,inset 0 calc(var(--bs)*-.008) 0 #00000070}
.cell::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 30% 20%,transparent 30%,#0000004d 100%)}
.cell.stein{background-image:linear-gradient(#0a103077,#0a103099),url(assets/tex_brostein.jpg);--n:#3ab8ff}
.cell.planke{background-image:linear-gradient(#1c0b3a99,#1c0b3ab3),url(assets/tex_planker.jpg);--n:#a066ff}
.cell.terra{background-image:linear-gradient(#3a080055,#3a080066),url(assets/tex_terrakotta.jpg);--n:#ffb347}
.cell.azul{background-image:linear-gradient(#08104a8c,#08104aa6),url(assets/tex_azulejo.jpg);--n:#ff5cc8}
.cell b{position:relative;z-index:1;font-family:Anton,Impact,sans-serif;font-weight:400;font-size:max(11px,calc(var(--bs)*.034));line-height:1;letter-spacing:.02em;color:#fff;
  -webkit-text-stroke:max(.8px,calc(var(--bs)*.0016)) #0b0620;paint-order:stroke fill;
  text-shadow:1px 1px 0 #0b0620,2px 2px 0 #0b0620,calc(var(--bs)*.004) calc(var(--bs)*.004) 0 var(--n),0 0 calc(var(--bs)*.012) var(--n)}
.cell .ic{position:absolute;right:6%;bottom:5%;font-style:normal;font-size:max(9px,calc(var(--bs)*.026));line-height:1;opacity:.85;filter:drop-shadow(0 1px 1px #000)}
.cell.startc{background:radial-gradient(circle at 50% 40%,#9dff7a,#1db954 55%,#06602a);--n:#d6ffcc;animation:pulse 2.2s ease-in-out infinite}
.cell.goal{background:radial-gradient(circle at 50% 55%,#fff3a0,#ffd400 35%,#ff8a00 70%,#a33a00);--n:#fff3a0;animation:pulse 1.6s ease-in-out infinite}
.cell.goal b,.cell.startc b{color:#fff;-webkit-text-stroke:max(.8px,calc(var(--bs)*.0016)) #3a1500}
.cell.startc b{-webkit-text-stroke-color:#063d1a}
.cell .lbl{position:absolute;z-index:1;left:0;right:0;bottom:6%;text-align:center;font-family:Anton,Impact,sans-serif;font-size:max(8px,calc(var(--bs)*.021));color:#fff;letter-spacing:.06em;-webkit-text-stroke:.6px #000;paint-order:stroke fill;text-shadow:0 0 6px #000}
.cell.goal .lbl::before{content:'👑 '}
.cell.startc .lbl::before{content:'🚩 '}
@keyframes pulse{50%{box-shadow:inset 0 0 0 2px var(--n),inset 0 0 calc(var(--bs)*.03) #fff,0 0 calc(var(--bs)*.02) var(--n)}}
/* neon-landemerker oppå rutene, under stiger og sklier */
.zoneart{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen}
.za{position:absolute;left:0;right:0;height:50%;background:center/contain no-repeat;opacity:.26}
.za.es{top:0;background-image:url(assets/neon_spania.png)}
.za.fr{bottom:0;background-image:url(assets/neon_fredrikstad.png)}
.zline{position:absolute;left:0;right:0;top:calc(50% - 1px);height:2px;background:linear-gradient(90deg,#3ab8ff,#a066ff,#ff2fb4,#ffb347);box-shadow:0 0 8px #ff2fb4,0 0 16px #ffb347}
.art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.flow path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.flow .turn{stroke-width:3.5;stroke-dasharray:2 7;opacity:.9}
.flow .chev{stroke-width:3.5;opacity:.75}
.flow .fr{stroke:#7fd8ff}.flow .es{stroke:#ffd27a}
.slide .water{animation:flowwater 1.1s linear infinite}
@keyframes flowwater{to{stroke-dashoffset:-32}}
.slide .ripple{animation:ripple 2s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes ripple{from{transform:scale(.6);opacity:.9}to{transform:scale(1.5);opacity:0}}
@media (prefers-reduced-motion:reduce){.slide .water,.slide .ripple,.cell.startc,.cell.goal{animation:none}}
.badge{position:absolute;transform:translate(-50%,-50%);width:calc(var(--bs)*.052);height:calc(var(--bs)*.052);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:calc(var(--bs)*.03);background:#0b0620dd;border:2px solid #ffb347;box-shadow:0 0 8px #ff8a00;z-index:3;padding:0;line-height:1}
.badge.skli{border-color:#3ab8ff;box-shadow:0 0 8px #3ab8ff}
.badge:hover{transform:translate(-50%,-50%) scale(1.15)}
.tk{position:absolute;left:0;top:0;transform:translate(-50%,-82%);z-index:5;filter:drop-shadow(0 2px 2px #000a) drop-shadow(0 0 4px var(--c));pointer-events:none;will-change:left,top}
.tk img{display:block;height:calc(var(--bs)*.085);width:auto;max-width:calc(var(--bs)*.09);object-fit:contain}
.tk.cur{z-index:6}
.tk.cur img{animation:bob 1s ease-in-out infinite}
.tk.moving{z-index:8}
.tk.moving img{animation:none}
@keyframes bob{50%{transform:translateY(-8%)}}
.pop{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(86%,420px);z-index:20;background:#170a33f2;border:2px solid #ffb347;border-radius:18px;padding:1rem;text-align:center;box-shadow:0 0 40px #ff8a0088;animation:popin .25s ease-out;cursor:pointer}
.pop.skli{border-color:#3ab8ff;box-shadow:0 0 40px #3ab8ff88}
.pop .pe{font-size:2.6rem;line-height:1}
.pop .pt{font-family:Anton,Impact,sans-serif;font-size:1.5rem;color:#ffb347;letter-spacing:.03em;margin:.2rem 0}
.pop.skli .pt{color:#7fd8ff}
.pop .px{font-size:1rem;font-weight:600}
.pop .ph{font-size:.7rem;opacity:.6;margin-top:.5rem}
@keyframes popin{from{transform:translate(-50%,-50%) scale(.7);opacity:0}}
.panel{width:100%;max-width:520px;display:flex;flex-direction:column;gap:.6rem;padding:0 .3rem 2rem}
.turn{display:flex;align-items:center;gap:.7rem;background:#120828;border:1px solid #ff2fb455;border-radius:16px;padding:.6rem .8rem}
.turn.mine{border-color:#ff8a00;box-shadow:0 0 16px #ff8a0066}
.turn img{height:54px;width:48px;object-fit:contain}
.tinfo{flex:1;min-width:0}
.tname{font-weight:900;font-size:1.1rem}
.tsub{font-size:.82rem;opacity:.8}
.die{width:58px;height:58px;flex:none;border-radius:12px;background:linear-gradient(145deg,#fff,#d9d3ea);box-shadow:inset 0 -4px 0 #0002,0 0 14px #ffb34788;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:7px;gap:2px}
.die i{border-radius:50%;background:#1b0b3a;transform:scale(0);transition:transform .08s}
.die.roll{animation:shake .12s linear infinite}
@keyframes shake{0%{transform:rotate(-14deg) translateY(-3px)}50%{transform:rotate(14deg) translateY(2px)}100%{transform:rotate(-14deg) translateY(-3px)}}
.die[data-v="1"] i:nth-child(5),
.die[data-v="2"] i:nth-child(1),.die[data-v="2"] i:nth-child(9),
.die[data-v="3"] i:nth-child(1),.die[data-v="3"] i:nth-child(5),.die[data-v="3"] i:nth-child(9),
.die[data-v="4"] i:nth-child(1),.die[data-v="4"] i:nth-child(3),.die[data-v="4"] i:nth-child(7),.die[data-v="4"] i:nth-child(9),
.die[data-v="5"] i:nth-child(1),.die[data-v="5"] i:nth-child(3),.die[data-v="5"] i:nth-child(5),.die[data-v="5"] i:nth-child(7),.die[data-v="5"] i:nth-child(9),
.die[data-v="6"] i:nth-child(1),.die[data-v="6"] i:nth-child(3),.die[data-v="6"] i:nth-child(4),.die[data-v="6"] i:nth-child(6),.die[data-v="6"] i:nth-child(7),.die[data-v="6"] i:nth-child(9){transform:scale(1)}
.rollbtn{font-size:1.25rem;letter-spacing:.03em}
.rollbtn.wait{background:#24124a;color:#d9c8ff;box-shadow:none}
.players{display:flex;flex-direction:column;gap:.35rem}
.pl{display:flex;align-items:center;gap:.55rem;background:#120828;border-radius:12px;padding:.35rem .6rem;border-left:4px solid var(--c)}
.pl.cur{background:#24124a}
.pl img{height:34px;width:34px;object-fit:contain}
.pl .nm{font-weight:800;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl .nm small{font-weight:500;opacity:.7}
.pl .bar{width:32%;height:8px;border-radius:9px;background:#0c0620;overflow:hidden}
.pl .bar i{display:block;height:100%;background:var(--c);box-shadow:0 0 6px var(--c)}
.pl .ps{font-family:Anton,Impact,sans-serif;font-size:1.05rem;width:2.4rem;text-align:right}
.pl .off{color:#ff6b6b;font-size:.7rem}
.legend{background:#120828;border-radius:12px;padding:.5rem .7rem}
.legend summary{font-weight:800;color:#ff6ad5;cursor:pointer}
.legend ul{list-style:none;margin-top:.4rem;display:flex;flex-direction:column;gap:.3rem;font-size:.84rem}
.legend li b{color:#ffb347}.legend li.skli b{color:#7fd8ff}
.loghead{font-weight:800;color:#ff6ad5}
.log{list-style:none;display:flex;flex-direction:column;gap:.15rem;max-height:30vh;overflow:auto;font-size:.82rem;background:#0c0620;border-radius:12px;padding:.5rem}
.log li{padding:.15rem 0;border-bottom:1px solid #ffffff0d}
.log li.chat{color:#7fd8ff;font-style:italic}
.log li.turn{color:#ffb347;font-weight:700}
.log li.up{color:#ffd27a}.log li.down{color:#9fd8ff}
.log li.win{color:#8dff7a;font-weight:800}
.log li.warn{color:#ff8c8c}
.modal{position:fixed;inset:0;z-index:50;background:#05021099;display:flex;align-items:flex-end;justify-content:center;padding:.6rem;backdrop-filter:blur(3px)}
.mbox{width:100%;max-width:480px;max-height:88vh;overflow:auto;background:#170a33;border:1px solid #ff2fb477;border-radius:18px;padding:1rem;display:flex;flex-direction:column;gap:.7rem;box-shadow:0 0 30px #ff2fb444;animation:up .25s ease-out}
@keyframes up{from{transform:translateY(30px);opacity:0}}
.mbox h3{color:#ff6ad5;font-size:1.2rem}
.win{text-align:center}
.win .troph{font-size:3rem;line-height:1}
.win img.wimg{height:150px;filter:drop-shadow(0 0 16px #ffb347);animation:bob 1s ease-in-out infinite}
.win .wn{font-family:Anton,Impact,sans-serif;font-size:2rem;color:#ffb347;text-shadow:0 0 10px #ff6a00}
.rank{list-style:none;display:flex;flex-direction:column;gap:.3rem;text-align:left}
.rank li{display:flex;align-items:center;gap:.5rem;background:#0c0620;border-radius:10px;padding:.3rem .5rem;font-size:.88rem}
.rank img{height:28px;width:28px;object-fit:contain}
.rank .r{font-family:Anton,Impact,sans-serif;width:1.6rem}
.rank .s{margin-left:auto;font-size:.75rem;opacity:.8;text-align:right}
.toast{position:fixed;left:50%;bottom:max(1rem,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:60;background:#ff6a00;color:#1b0800;font-weight:800;padding:.6rem 1rem;border-radius:12px;box-shadow:0 4px 20px #000a;max-width:92vw;text-align:center}
.confetti{position:fixed;top:-20px;width:10px;height:14px;z-index:70;pointer-events:none;animation:fall linear forwards}
@keyframes fall{to{transform:translateY(110vh) rotate(720deg)}}
@media (min-width:900px){
  .gamegrid{--bs:min(100vh - 76px, 100vw - 460px);--fw:calc(var(--bs)*.03);flex-direction:row;align-items:flex-start;justify-content:center;padding:10px;gap:1rem}
  .board{width:calc(var(--bs) - var(--fw)*3)}
  .panel{width:420px;max-height:calc(100vh - 76px);overflow:auto}
  .log{max-height:none}
  .modal{align-items:center}
}
.plist .pname{flex:1;padding:.35rem .5rem;font-weight:700}
.tag{white-space:nowrap}
/* ---------- BLI KJENT (vinnerskjerm) ---------- */
.fact{background:linear-gradient(135deg,#2a0d4a,#120828);border:2px solid #3ab8ff;border-radius:16px;padding:.8rem .9rem;box-shadow:0 0 18px #3ab8ff55,inset 0 0 20px #ff2fb422;display:flex;flex-direction:column;align-items:center;gap:.45rem;text-align:center}
.fact .fhd{font-family:Anton,Impact,sans-serif;letter-spacing:.06em;color:#7fd8ff;text-shadow:0 0 8px #3ab8ff;font-size:1.05rem}
.fact .fbody{display:flex;flex-direction:column;align-items:center;gap:.2rem;min-height:4.2em;justify-content:center}
.fact .fbody.flip{animation:fflip .35s ease-out}
.fact .fem{font-size:2rem;line-height:1}
.fact .ftx{font-weight:700;font-size:.98rem}
@keyframes fflip{from{transform:rotateX(80deg);opacity:0}}