/* Product Design V3 — installation-first TV, child-first mobile, owner-first admin */
:root{--v3-mint:#68e8dc;--v3-cyan:#58c9de;--v3-deep:#01131d;--v3-soft:#edf5f2;--v3-card:#fbfdfc}

/* TV: make the aquarium read as a physical installation, not a webpage. */
.tv-shell .stage{background:linear-gradient(180deg,#06364a 0%,#042a3a 46%,#021a26 100%)}
.tv-shell .stage .water-surface{position:absolute;z-index:2;left:-5%;right:-5%;top:-5%;height:30%;pointer-events:none;opacity:.65;background:radial-gradient(ellipse at 20% 10%,rgba(203,254,255,.20),transparent 27%),radial-gradient(ellipse at 62% 0%,rgba(172,247,249,.18),transparent 31%),repeating-linear-gradient(100deg,transparent 0 8%,rgba(191,250,251,.055) 9% 10%,transparent 11% 20%);filter:blur(3px);animation:v3Surface 12s ease-in-out infinite alternate}
.tv-shell .stage .foreground{position:absolute;z-index:5;left:-4%;right:-4%;bottom:-5%;height:25%;pointer-events:none;background:radial-gradient(ellipse at 8% 100%,rgba(0,19,22,.94) 0 15%,transparent 16%),radial-gradient(ellipse at 24% 108%,rgba(1,34,31,.88) 0 13%,transparent 14%),radial-gradient(ellipse at 74% 108%,rgba(1,31,29,.84) 0 15%,transparent 16%),radial-gradient(ellipse at 95% 100%,rgba(0,18,22,.96) 0 16%,transparent 17%);filter:blur(.5px)}
.tv-shell .tv-brand{top:clamp(24px,2.8vw,48px);left:clamp(30px,3.1vw,60px)}
.tv-shell .tv-brand h1{font-weight:680;letter-spacing:-.06em}
.tv-shell .qr-panel{right:clamp(20px,2.4vw,46px);border-color:rgba(188,244,244,.17);background:linear-gradient(180deg,rgba(3,28,37,.82),rgba(2,20,29,.86))}
.tv-shell .qr-panel:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.tv-shell .qr-wrap{box-shadow:0 12px 34px rgba(0,0,0,.24)}
.tv-shell .tv-hint{border-color:rgba(196,244,246,.13);background:rgba(2,22,29,.56)}
.tv-shell .live{border:1px solid rgba(196,244,246,.10)}
.tv-empty{position:absolute;z-index:6;left:50%;top:52%;transform:translate(-55%,-50%);width:min(520px,48vw);text-align:center;color:#effeff;pointer-events:none;opacity:0;transition:opacity .7s ease,transform .8s ease}
.tv-shell.is-empty .tv-empty{opacity:1;transform:translate(-55%,-54%)}
.tv-empty-mark{width:72px;height:72px;margin:0 auto 17px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(183,244,244,.24);background:rgba(4,48,59,.42);box-shadow:0 0 60px rgba(102,230,220,.08)}
.tv-empty-mark:before{content:"";width:26px;height:17px;border-radius:55% 45% 48% 52%;border:2px solid rgba(205,255,251,.76);transform:rotate(-5deg)}
.tv-empty .eyebrow{color:#a8f3ed}.tv-empty h2{margin:0;font-size:clamp(25px,2.5vw,42px);line-height:1;letter-spacing:-.045em}.tv-empty p{max-width:410px;margin:11px auto 0;color:rgba(226,248,249,.64);font-size:14px;line-height:1.5}
.tv-shell:not(.is-empty) .tv-empty{display:none}
.tv-shell[data-density="busy"] .tv-brand h1{font-size:clamp(32px,3vw,54px)}
.tv-shell[data-density="busy"] .tv-hint{opacity:.72}
@keyframes v3Surface{from{transform:translateX(-2%) scale(1)}to{transform:translateX(3%) scale(1.04)}}

/* Mobile: first screen should explain the game in seconds. */
.mobile-shell{position:relative}.mobile-header .eyebrow{letter-spacing:.17em}.mobile-header h1{font-weight:720}
.hero{isolation:isolate}.hero:before{content:"3 дня жизни • +3 дня после кормления";position:absolute;z-index:3;left:15px;top:14px;padding:7px 10px;border-radius:999px;background:rgba(2,23,31,.53);border:1px solid rgba(220,255,255,.14);backdrop-filter:blur(10px);color:rgba(245,255,255,.9);font-size:10px;font-weight:720;letter-spacing:.02em}
.section-head .primary{box-shadow:0 8px 24px rgba(43,198,212,.18)}
.fish-card{transition:background .18s ease,transform .18s ease}.fish-card:hover{background:rgba(255,255,255,.52)}
.thumb{box-shadow:inset 0 0 0 1px rgba(13,32,40,.035)}
.creator-card{border:1px solid rgba(255,255,255,.7)}
.upload{position:relative;min-height:270px;overflow:hidden;background:radial-gradient(circle at 50% 20%,#f8fffd,#e9f4f1);border:1px dashed rgba(15,127,150,.28)}
.upload:before{content:"1";position:absolute;left:18px;top:17px;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#d8f6f2;color:#0a6574;font-size:11px;font-weight:850}
.upload strong{display:block;margin-top:8px;font-size:18px}.upload small{display:block;max-width:300px;margin:7px auto 0;color:var(--muted-dark);line-height:1.45}
.preview{position:relative;overflow:hidden;background:linear-gradient(145deg,#eff7f4,#e7f0ed);box-shadow:inset 0 0 0 1px rgba(13,32,40,.05)}
.range,.field{display:block}.creator .range,.creator .field{margin-top:15px}.creator .range span,.creator .field span{display:block;margin-bottom:7px;color:var(--muted-dark);font-size:11px;font-weight:720}.creator .field input{width:100%;padding:13px 14px;border:1px solid var(--line-dark);border-radius:14px;background:#fff;outline:none}.creator .field input:focus{border-color:rgba(43,198,212,.55);box-shadow:0 0 0 4px rgba(43,198,212,.08)}
.success{text-align:center;padding:30px 12px}.success strong{display:block;font-size:28px;letter-spacing:-.04em}.success p{max-width:360px;margin:10px auto 20px;color:var(--muted-dark);line-height:1.5}

/* Join: more like an invitation, less like a utility form. */
.join-shell .eyebrow{margin-bottom:12px}.join-card{align-items:flex-end}.join-card .primary{min-height:48px}.join-pic{box-shadow:0 18px 45px rgba(8,50,60,.13)}

/* Admin: operational hierarchy. */
.admin-header{position:relative}.admin-header:after{content:"LIVE";position:absolute;left:145px;top:7px;padding:4px 7px;border-radius:999px;background:#e3f7ec;color:#19714d;font-size:9px;font-weight:850;letter-spacing:.12em}
.stats{background:rgba(255,255,255,.38);border-top:1px solid rgba(13,32,40,.05)}
.stat{position:relative}.stat:not(:last-child):after{content:"";position:absolute;right:10%;top:24%;bottom:24%;width:1px;background:rgba(13,32,40,.07)}
.aq-row{border-radius:15px;transition:background .18s ease}.aq-row:hover{background:rgba(255,255,255,.48)}
.aq-row .ghost{background:rgba(255,255,255,.42)}
.admin-fish{grid-template-columns:64px 1fr auto auto}.admin-fish>span{padding:5px 8px;border-radius:999px;background:#eaf2ef;color:#52676d;font-size:10px;font-weight:750}

@media(max-width:760px){.tv-empty{width:62vw;transform:translate(-61%,-50%)}.tv-shell.is-empty .tv-empty{transform:translate(-61%,-54%)}.hero:before{font-size:9px}.admin-header:after{display:none}.stat:not(:last-child):after{display:none}.admin-fish{grid-template-columns:54px 1fr auto}.admin-fish>button{grid-column:2/-1;justify-self:start}.join-card{align-items:stretch}}
