.im-wrap{ max-width:640px; margin:0 auto; padding:6px 16px calc(40px + env(safe-area-inset-bottom)); text-align:center; color:var(--text,#eaf5ee); font-family:'Fredoka','Segoe UI',system-ui,-apple-system,sans-serif; }
.im-h1{ color:var(--text,#eaf5ee); font-size:30px; font-weight:700; margin:6px 0 2px; display:flex; align-items:center; justify-content:center; gap:12px; letter-spacing:.01em; }
.im-logo{ width:52px; height:52px; flex:0 0 auto; filter:drop-shadow(0 2px 4px rgba(0,0,0,.35)); }
.im-sub{ color:var(--muted2,#9fb6a8); font-size:13.5px; margin-bottom:16px; font-weight:400; }
.im-card{ background:linear-gradient(165deg,#123528,#0d241b); border:1px solid var(--line2,#2c4636); border-radius:18px; padding:20px 16px; margin:0 auto 14px; box-shadow:0 8px 26px rgba(0,0,0,.28); }
.im-h2{ font-size:19px; font-weight:600; margin:0 0 12px; }
.im-row{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; align-items:center; margin:10px 0; }
.im-seg{ display:inline-flex; gap:7px; flex-wrap:wrap; justify-content:center; }
.im-seg button, .im-chip{ background:var(--btn,#14503c); color:var(--text,#eaf5ee); border:1px solid var(--line2,#2c4636); border-radius:999px; padding:8px 16px; font-size:13.5px; font-weight:600; font-family:inherit; cursor:pointer; transition:.15s; }
.im-seg button:hover, .im-chip:hover{ border-color:var(--accent,#ffcf5c); }
.im-seg button.active, .im-chip.active{ background:var(--accent,#ffcf5c); color:var(--accent-fg,#3d2c05); border-color:var(--accent,#ffcf5c); box-shadow:0 2px 10px rgba(255,207,92,.25); }
.im-seg button[disabled]{ opacity:.32; cursor:not-allowed; }
/* V505: the three settings are dropdowns */
.im-select{ appearance:none; -webkit-appearance:none; background:var(--btn,#14503c); color:var(--text,#eaf5ee);
  border:1px solid var(--line2,#2c4636); border-radius:999px; padding:9px 36px 9px 16px; font-size:var(--fld-fs,13.5px); font-weight:600;
  font-family:inherit; cursor:pointer; min-height:44px; min-width:200px; text-align:center; text-align-last:center;
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; transition:border-color .15s ease; }
.im-select:hover, .im-select:focus{ border-color:var(--accent,#ffcf5c); }
.im-select:hover:not(:focus-visible),.im-select:focus:not(:focus-visible){ outline: none; }
.im-btn{ background:var(--btn,#14503c); color:var(--text,#eaf5ee); border:1px solid var(--line2,#2c4636); border-radius:12px; padding:11px 20px; font-size:15px; font-weight:600; font-family:inherit; cursor:pointer; }
.im-btn.pri{ background:var(--accent,#ffcf5c); color:var(--accent-fg,#3d2c05); border-color:var(--accent,#ffcf5c); }
.im-btn.big{ width:100%; max-width:360px; padding:15px; font-size:17px; margin:6px auto; display:block; }
.im-btn.ghost{ background:transparent; }
.im-step{ display:inline-flex; align-items:center; gap:14px; }
.im-step button{ width:42px; height:42px; border-radius:50%; font-size:22px; font-weight:700; line-height:1; padding:0; }
.im-step .n{ color:var(--text,#eaf5ee); font-size:28px; font-weight:700; min-width:64px; }
.im-names{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:10px 0; max-height:280px; overflow-y:auto; padding:2px; }
.im-names input{ background:var(--bg,#0b2018); color:var(--text,#eaf5ee); border:1px solid var(--line2,#2c4636); border-radius:9px; padding:9px 11px; font-size:var(--fld-fs,14px); font-family:inherit; width:100%; }
.im-lbl{ font-size:11.5px; color:var(--accent,#ffcf5c); margin:16px 0 6px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.im-mini{ font-size:12px; color:var(--muted2,#9fb6a8); font-weight:400; }
/* reveal */
.im-pass{ font-size:20px; font-weight:600; margin:6px 0 4px; }
.im-progress{ color:var(--muted2,#9fb6a8); font-size:13px; margin-bottom:12px; font-weight:500; }
.im-reveal{ min-height:200px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; border-radius:16px; padding:24px 16px; }
.im-reveal.crew{ background:linear-gradient(160deg,#124a33,#0e2a20); border:2px solid #2f7d59; }
.im-reveal.imp{ background:linear-gradient(160deg,#5a2222,#2c1414); border:2px solid #c24a4a; }
.im-role{ font-size:24px; font-weight:700; }
.im-word{ font-size:38px; font-weight:700; margin:2px 0; letter-spacing:.01em; }
.im-word.dim{ font-size:24px; }
.im-hint{ font-size:14px; color:var(--muted2,#cfe3d8); max-width:340px; margin:0 auto; font-weight:400; }
.im-cat{ font-size:13px; opacity:.85; }
/* turn-code gate */
.im-code{ background:var(--bg,#0b2018); color:var(--text,#eaf5ee); border:2px solid var(--accent,#ffcf5c); border-radius:12px; padding:12px; font-size:26px; font-weight:700; font-family:inherit; width:88px; text-align:center; letter-spacing:.1em; }
/* discuss */
.im-timer{ font-size:50px; font-weight:700; font-variant-numeric:tabular-nums; margin:8px 0; }
.im-timer.warn{ color:#ffb454; } .im-timer.done{ color:#ff7676; }
/* vote */
.im-voter{ font-size:19px; font-weight:600; margin:4px 0 10px; }
.im-voter-hl{ display:inline-block; background:var(--accent,#ffcf5c); color:var(--accent-fg,#3d2c05); padding:2px 12px; border-radius:999px; font-weight:700; box-shadow:0 2px 12px rgba(255,207,92,.35); animation:imPulse 1.4s ease-in-out infinite; }
@keyframes imPulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.06); } }
.im-vote-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:10px 0; max-height:340px; overflow-y:auto; }
.im-vote-grid button{ padding:14px 10px; font-size:15px; border-radius:12px; }
.im-vote-grid button:hover{ background:var(--accent,#ffcf5c); color:var(--accent-fg,#3d2c05); border-color:var(--accent,#ffcf5c); }
.im-tally{ text-align:left; max-width:360px; margin:8px auto; }
.im-tally .r{ display:flex; justify-content:space-between; padding:5px 2px; border-bottom:1px solid var(--line2,#2c4636); font-size:14px; }
/* result */
.im-result-big{ font-size:27px; font-weight:700; margin:6px 0; }
.im-win-crew{ color:#5fd48a; } .im-win-imp{ color:#ff7676; }
.im-imp-names{ font-size:17px; font-weight:600; margin:6px 0; }
.im-guess input{ background:var(--bg,#0b2018); color:var(--text,#eaf5ee); border:1px solid var(--line2,#2c4636); border-radius:9px; padding:10px 12px; font-size:var(--fld-fs,15px); font-family:inherit; width:70%; max-width:240px; }
