/* PaskaTok v0.3.0 — SOCIAL GUTS ENGINE
   Scoped features: Kolina threads, Tuoreet tortut, profile tabs, real local analytics.
*/

/* One screen at a time. Never let the sewer reports leak into another view again. */
.view:not(.active){display:none!important}

/* Plönts double-tap burst */
.plonts-burst{
  position:absolute;left:50%;top:48%;z-index:18;
  transform:translate(-50%,-50%) scale(.25) rotate(-8deg);
  opacity:0;pointer-events:none;font-size:84px;
  filter:drop-shadow(0 16px 28px rgba(0,0,0,.38));
}
.plonts-burst.pop{animation:plonts-pop .58s cubic-bezier(.2,.9,.25,1)}
@keyframes plonts-pop{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.25) rotate(-10deg)}
  28%{opacity:1;transform:translate(-50%,-50%) scale(1.18) rotate(5deg)}
  68%{opacity:1;transform:translate(-50%,-50%) scale(.96) rotate(-2deg)}
  100%{opacity:0;transform:translate(-50%,-62%) scale(1.08) rotate(0)}
}

/* Kolina: actual threads, replies and comment plönts */
.comments-sheet{max-height:min(78%,650px)}
.comment-list{padding:0 12px 10px;display:grid;gap:8px}
.comment-thread{display:grid;gap:5px}
.comment-row{
  border:1px solid rgba(250,244,231,.07);
  background:rgba(43,29,15,.28);
  border-radius:14px;padding:10px 11px;
}
.comment-row.reply{margin-left:24px;background:rgba(92,64,33,.26);border-left-color:rgba(239,196,67,.30)}
.comment-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.comment-head b{margin:0!important;font:600 9px var(--font-mono)!important;color:var(--hazard)}
.comment-head span{font:7.5px var(--font-mono);color:var(--porcelain-dim)}
.comment-text{margin-top:5px;font-size:12px;line-height:1.45;color:var(--porcelain)}
.comment-actions{display:flex;gap:8px;margin-top:7px}
.comment-actions button{
  border:0;background:transparent;color:var(--porcelain-dim);
  font:600 7.5px var(--font-mono);padding:3px 0;cursor:pointer
}
.comment-actions button:active{color:var(--hazard)}
.reply-bar{
  display:none;align-items:center;justify-content:space-between;gap:8px;
  margin:0 12px 8px;padding:7px 10px;border-radius:10px;
  background:rgba(239,196,67,.08);border:1px solid rgba(239,196,67,.18);
  color:var(--porcelain-dim);font:8px var(--font-mono)
}
.reply-bar.show{display:flex}
.reply-bar button{border:0;background:none;color:var(--hazard);font-size:18px;line-height:1}
.comment-form button{min-width:76px}

/* Tuoreet tortut */
#view-inbox .story-rail{gap:13px;scroll-padding-inline:18px}
#view-inbox .story{
  appearance:none;-webkit-appearance:none;border:0;background:transparent;color:inherit;padding:0;
  min-width:64px
}
#view-inbox .story .sring{box-shadow:0 8px 18px rgba(0,0,0,.12)}
#view-inbox .story-add .sring{background:conic-gradient(var(--hazard),#f3dc76,var(--copper),var(--hazard))}
#view-inbox .story-new .sring{background:conic-gradient(var(--moss),var(--hazard),var(--copper),var(--moss))}
.story-viewer{
  position:absolute;inset:0;z-index:80;display:none;overflow:hidden;
  background:#160f08;color:var(--porcelain)
}
.story-viewer.open{display:flex;flex-direction:column}
.story-progress{height:3px;margin:10px 10px 0;background:rgba(255,255,255,.18);border-radius:99px;overflow:hidden;z-index:3}
.story-progress i{display:block;width:0;height:100%;background:var(--porcelain);transition:width .05s linear}
.story-viewer-top{
  position:absolute;top:18px;left:16px;right:14px;z-index:4;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  font:600 9px var(--font-mono);text-shadow:0 2px 8px #000
}
.story-viewer-top>div{display:flex;gap:7px}
.story-viewer-top button{
  border:1px solid rgba(255,255,255,.18);background:rgba(28,18,9,.50);color:#fff;
  border-radius:999px;padding:7px 9px;font:600 8px var(--font-mono);backdrop-filter:blur(8px)
}
.story-viewer-top button:last-child{font-size:16px;width:32px;height:32px;padding:0;display:grid;place-items:center}
.story-stage{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 42%,#715022,#22160a 70%)}
.story-stage img,.story-stage video{width:100%;height:100%;object-fit:cover}
.story-stage.tone-paper{background:radial-gradient(circle at 50% 35%,#8e7749,#392514 72%)}
.story-stage.tone-bidee{background:radial-gradient(circle at 50% 35%,#4f837d,#21372f 72%)}
.story-stage.tone-tukos{background:radial-gradient(circle at 50% 35%,#a66348,#3d2117 72%)}
.story-stage.tone-pipe{background:radial-gradient(circle at 50% 35%,#7a7f60,#302d1c 72%)}
.demo-story-mark{display:grid;place-items:center;gap:20px;font-size:116px;text-align:center;padding:30px}
.demo-story-mark small{font:500 14px/1.45 var(--font-body);max-width:280px;color:var(--porcelain)}
.story-caption{
  position:absolute;left:18px;right:18px;bottom:28px;z-index:4;
  color:#fff;font:500 12px/1.45 var(--font-body);text-shadow:0 2px 10px #000
}

/* Studio: six real local metrics, still two-column on the phone. */
#view-studio .studio-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#view-studio .s-card{min-height:108px;background:rgba(72,49,27,.58)}
#view-studio .s-card .metric{font-size:17px;color:var(--hazard)}
#view-studio .s-card.wide{grid-column:1/-1;min-height:auto}

/* Profile tabs are real data filters now. */
#view-profile .profile-empty{
  grid-column:1/-1;min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:8px;padding:30px;color:var(--porcelain-dim)
}
#view-profile .profile-empty span{font-size:40px}
#view-profile .profile-empty b{font:600 12px var(--font-body);color:var(--porcelain)}
#view-profile .profile-empty small{font:9px/1.5 var(--font-mono);max-width:250px}
#view-profile .profile-card-badge{
  position:absolute;right:7px;top:7px;z-index:4;min-width:24px;height:24px;display:grid;place-items:center;
  background:rgba(30,19,10,.68);border:1px solid rgba(255,255,255,.10);border-radius:50%;font-size:12px
}
#view-profile .p-cell.profile-scene-0::before{background:radial-gradient(circle at 50% 36%,rgba(239,196,67,.18),transparent 42%),url('/assets/brand/paskatok-logo.png') center 40%/46% auto no-repeat,linear-gradient(160deg,#665024,#24170c)}
#view-profile .p-cell.profile-scene-1::before{background:radial-gradient(circle at 50% 36%,rgba(104,147,139,.20),transparent 42%),url('/assets/brand/tuoreet-tortut-live.png') center 40%/48% auto no-repeat,linear-gradient(160deg,#3f604d,#20170d)}
#view-profile .p-cell.profile-scene-2::before{background:radial-gradient(circle at 50% 36%,rgba(210,138,76,.18),transparent 42%),url('/assets/brand/suolikanava-studio.png') center 40%/50% auto no-repeat,linear-gradient(160deg,#4d321c,#20150c)}
#view-profile .p-cell.profile-scene-3::before{background:radial-gradient(circle at 50% 36%,rgba(154,168,67,.18),transparent 42%),url('/assets/brand/paskatok-logo.png') center 40%/44% auto no-repeat,linear-gradient(160deg,#4a592a,#24170c)}

@media(max-width:390px){
  .comment-row.reply{margin-left:16px}
  .story-viewer-top{top:16px;left:12px;right:10px}
  #view-studio .studio-grid{gap:8px;padding-left:12px;padding-right:12px}
  #view-studio .s-card{padding:12px;min-height:104px}
}

@media(prefers-reduced-motion:reduce){.plonts-burst.pop{animation:none;opacity:1;transform:translate(-50%,-50%) scale(1)}}