/* RUSH TABLE G v6 — écran de connexion, création de profil, NIP, profondeur 3D des menus. */
.pava { --ac: #8e2236; position: relative; flex: none; width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; color: #fff; font: 900 18px var(--serif); letter-spacing: .5px;
  background: radial-gradient(circle at 36% 28%, color-mix(in srgb, var(--ac) 55%, #fff), var(--ac) 52%, color-mix(in srgb, var(--ac) 60%, #000)); border: 2px solid var(--gold2);
  box-shadow: 0 3px 0 rgba(0,0,0,.35), 0 0 0 3px rgba(0,0,0,.25), inset 0 2px 3px rgba(255,255,255,.35); text-shadow: 0 1px 2px rgba(0,0,0,.6); }
.pava.lg { width: 66px; height: 66px; font-size: 24px; margin: 0 auto 6px; }
.pava.xl { width: 104px; height: 104px; font-size: 38px; border-width: 3px; margin: 0 auto; }
.pava.plus { background: rgba(255,255,255,.06); border: 2px dashed rgba(242,204,99,.7); color: var(--gold2); font-size: 28px; box-shadow: none; }
.pava.pop { animation: pavapop .45s cubic-bezier(.2,1.6,.4,1); }
@keyframes pavapop { 40% { transform: scale(1.18) rotate(-6deg); } }
.ava .face { background: radial-gradient(circle at 40% 30%, color-mix(in srgb, var(--ac, #8e2236) 60%, #fff), var(--ac, #8e2236) 70%); }

/* ---------- Écran « Qui est en cuisine? » ---------- */
body.in-login #scene .rays { opacity: .55; }
.screen.login { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; overflow-y: auto; padding: calc(14px + env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom)); gap: 10px; perspective: 900px; }
.lgtop { transform: scale(.72); transform-origin: 50% 0; margin-bottom: -46px; flex: none; animation: lgin .8s cubic-bezier(.2,1.3,.3,1) both; }
.lgtop.small { transform: scale(.56); margin-bottom: -70px; }
@keyframes lgin { from { opacity: 0; transform: scale(.5) translateY(-20px); } }
.lgcard { width: min(440px, 100%); padding: 16px 14px 12px; border-radius: 18px; background: linear-gradient(165deg, rgba(69,69,75,.97), rgba(43,43,46,.97) 60%, rgba(36,36,39,.97)); border: 1px solid rgba(212,175,55,.55);
  box-shadow: 0 18px 40px rgba(0,0,0,.55), 0 0 0 1px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.1); position: relative; transform-style: preserve-3d; animation: cardin .6s cubic-bezier(.2,1,.3,1) both .1s; }
.lgcard::before { content: ""; position: absolute; left: 14px; right: 14px; top: 0; height: 6px; border-radius: 0 0 4px 4px; background: var(--wine2) var(--meander-g) repeat-x center / 12px 6px; }
@keyframes cardin { from { opacity: 0; transform: rotateX(18deg) translateY(30px); } }
.lgcard h2 { margin: 6px 0 2px; text-align: center; font: italic 900 22px var(--serif); text-transform: uppercase; letter-spacing: 1px; color: var(--gold2); text-shadow: 0 2px 0 rgba(0,0,0,.5); }
.lgsub { margin: 0 0 12px; text-align: center; font-size: 13.5px; color: #e9dccb; }
.plist { display: flex; flex-direction: column; gap: 9px; }
.pcard { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; min-height: 66px; padding: 9px 12px; border-radius: 14px; text-align: left; color: #fff; cursor: pointer;
  background: linear-gradient(165deg, #4b4b52, #313135 70%); border: 1px solid rgba(212,175,55,.45); box-shadow: 0 4px 0 rgba(0,0,0,.4), 0 8px 16px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.12);
  animation: pin .45s cubic-bezier(.2,1.2,.4,1) both; animation-delay: calc(var(--i, 0) * 60ms + .2s); transition: transform .12s, box-shadow .12s; }
@keyframes pin { from { opacity: 0; transform: translateX(-24px) rotateY(-14deg); } }
.pcard:active { transform: translateY(2px) scale(.99); box-shadow: 0 2px 0 rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.12); }
.pcard .pinfo { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.pcard .pinfo b { font: 800 17px var(--serif); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pcard .pinfo small { font-size: 12.5px; color: #e2d3bf; opacity: .9; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pcard .plock { font-size: 16px; filter: drop-shadow(0 1px 1px #000); }
.pcard .pgo { font: 900 26px var(--serif); color: var(--gold2); margin-left: 2px; }
.pcard.add { background: rgba(255,255,255,.04); border: 1.5px dashed rgba(242,204,99,.55); box-shadow: none; }
.pcard .pdel { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(#e03131, #a61e1e); color: #fff; font-weight: 900; box-shadow: 0 2px 0 rgba(0,0,0,.4); }
.screen.login.manage .pcard { animation: wig .5s ease both; border-color: rgba(255,120,120,.6); }
@keyframes wig { 30% { transform: rotate(-.8deg); } 60% { transform: rotate(.8deg); } }
.lgrem { margin-top: 8px; border-top: 1px solid rgba(255,255,255,.08); border-bottom: 0 !important; color: #fff; }
.lgfoot { display: flex; justify-content: center; }
.lnk { border: 0; background: none; color: var(--gold2); font: 700 14px var(--sans); padding: 10px 14px; min-height: 44px; }
.lgnote { margin: 4px 0 0; max-width: 440px; text-align: center; font-size: 12px; color: #d8c8b2; opacity: .85; }
.lgnote.in { margin-top: 10px; }
/* inclinaison 3D au toucher (vars posées par FX.tilt) */
.t3d { transform: perspective(700px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .25s ease-out; will-change: transform; }
.t3d.tilting { transition: transform .06s linear; }
.pcard.t3d:active { transform: perspective(700px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(2px) scale(.99); }

/* ---------- Création ---------- */
.create .cprev { display: flex; justify-content: center; margin: 4px 0 6px; transform-style: preserve-3d; }
.create .cprev .pava { animation: float3 4s ease-in-out infinite; }
@keyframes float3 { 50% { transform: translateY(-5px) rotateY(12deg); } }
.field.lg input { font-size: 18px; padding: 11px 12px; }
.field input:focus { outline: 2px solid var(--gold2); outline-offset: 1px; }
.swatches { display: flex; flex-wrap: wrap; gap: 9px; justify-content: center; padding: 8px 0 4px; }
.sw { width: 32px; height: 32px; border-radius: 50%; border: 2px solid rgba(255,255,255,.35); background: radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--ac) 50%, #fff), var(--ac) 60%); box-shadow: 0 2px 0 rgba(0,0,0,.35); transition: transform .15s; padding: 0; }
.swatches.sw-lg { gap: 7px; flex-wrap: nowrap; } .swatches.sw-lg .sw { width: 31px; height: 31px; }
.sw.on { border-color: var(--gold2); transform: scale(1.16); box-shadow: 0 0 0 3px rgba(242,204,99,.35), 0 3px 6px rgba(0,0,0,.4); }
.pinrow { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pinrow input { letter-spacing: 8px; text-align: center; font-size: 20px; }
.cerr { min-height: 18px; margin: 4px 0 0; text-align: center; color: #ff9a9a; font-weight: 700; font-size: 13.5px; }
.create .row { display: flex; gap: 8px; margin-top: 4px; } .create .row .sbtn { flex: 1; min-height: 48px; }
.create .tog { color: #fff; }
.hidden { display: none !important; }

/* ---------- Pavé NIP (dans la feuille claire) ---------- */
.pinsheet { padding-top: 18px; }
.pinpad h3 { margin: 4px 0 2px; }
.pinpad .pmsg { min-height: 20px; margin: 0 0 8px; color: #6b5a5e; font-weight: 600; }
.pdots { display: flex; justify-content: center; gap: 16px; margin: 6px 0 14px; }
.pdots i { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--wine2); transition: background .12s, transform .12s; }
.pdots i.on { background: radial-gradient(circle at 35% 30%, #e05a73, var(--wine2)); transform: scale(1.12); }
.pinpad.bad .pdots { animation: pshake .45s ease; }
@keyframes pshake { 20% { transform: translateX(-10px); } 40% { transform: translateX(9px); } 60% { transform: translateX(-6px); } 80% { transform: translateX(4px); } }
.keys { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; max-width: 300px; margin: 0 auto 6px; }
.key { height: 58px; border-radius: 16px; border: 1px solid #e0d2c2; background: linear-gradient(#fff, #f1e8dd); color: var(--wine2); font: 800 24px var(--serif); box-shadow: 0 3px 0 #d6c6b4; }
.key:active { transform: translateY(2px); box-shadow: 0 1px 0 #d6c6b4; }
.key.fn { font-size: 20px; color: #7d6a6e; background: #f5efe8; }

/* ---------- Réglages : bloc profil ---------- */
.profset .pshead { display: flex; align-items: center; gap: 12px; padding: 12px 0 4px; }
.profset .pshead span:last-child { display: flex; flex-direction: column; } .profset .pshead b { font: 800 17px var(--serif); } .profset .pshead small { font-size: 12px; opacity: .75; }
.profset .swatches { justify-content: flex-start; }
.pbtns .setb:last-child { border-bottom: 0; }

/* ---------- Profondeur 3D des menus ---------- */
.screen.meta .scroll { perspective: 1000px; }
.screen.meta .tile, .screen.meta .mode, .screen.meta .playbtn, .screen.meta .dp { transform-style: preserve-3d; }
.menu .hero .logo { animation: logo3d 7s ease-in-out infinite; }
@keyframes logo3d { 0%, 100% { transform: rotateY(-7deg) rotateX(3deg); } 50% { transform: rotateY(7deg) rotateX(-2deg); } }
.grid .wrap { transform-style: preserve-3d; }

body.reduce .t3d, body.reduce .pcard, body.reduce .lgcard, body.reduce .lgtop, body.reduce .create .cprev .pava, body.reduce .menu .hero .logo { animation: none !important; transform: none !important; transition: none !important; }
.field { min-width: 0; } .field input { width: 100%; min-width: 0; box-sizing: border-box; }
.lgcard { overflow: hidden; }
.lgcard { color: #fff; } .lgcard .field b { color: #f3e6d3; }