/* ════════════════════════════════════════════════════════════════════
   Infernian Hell theme — ported from the approved mockup
   (mockups/landing.html?v=7, archived at vault output/tibia/landing-mockup-v7).
   Retro Gesior 3-column layout · Cinzel + Lora · parchment content panels.
   ════════════════════════════════════════════════════════════════════ */
:root{
  --ember:#ff6a1a; --ember-soft:#ff9248; --blood:#b3160f; --blood-lit:#ff3a22;
  --gold:#e8a13c; --gold-lit:#f7d089; --bone:#efe6db; --ash:#b6a89a; --ash-dim:#968778;
  --ink:#2a1808; --ink-soft:#3a2913; --ink-link:#5a2408;   /* on parchment */
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-in-out:cubic-bezier(.77,0,.175,1);
  --z-base:1; --z-embers:2; --z-content:3; --z-medallion:5; --z-nav:20;
  --vocation-sorcerer: #a04fc9;
  --vocation-druid: #4fc96a;
  --vocation-paladin: #3a86c9;
  --vocation-knight: #c94f2a;
  --vocation-none: #8a7a66;

  /* RGB triplet tokens — for rgb(var(--xxx-rgb) / alpha) composition */
  --ember-rgb:255 106 26; --ember-soft-rgb:255 146 72; --blood-rgb:179 22 15; --blood-lit-rgb:255 58 34;
  --gold-rgb:232 161 60; --gold-lit-rgb:247 208 137; --bone-rgb:239 230 219; --ash-rgb:182 168 154; --ash-dim-rgb:124 111 96;
  --ink-rgb:42 24 8; --ink-soft-rgb:58 41 19; --ink-link-rgb:138 52 16;
  --vocation-sorcerer-rgb:160 79 201; --vocation-druid-rgb:79 201 106; --vocation-paladin-rgb:58 134 201;
  --vocation-knight-rgb:201 79 42; --vocation-none-rgb:138 122 102;
  --black-rgb:0 0 0; --white-rgb:255 255 255;
  --brown-warm-rgb:120 70 20; --ember-dark-rgb:190 80 28;
  --green-vivid-rgb:120 200 80; --green-bright-rgb:60 160 80;
  --blue-bright-rgb:58 134 201; --blue-light-rgb:150 210 255; --blue-vivid-rgb:80 130 200;
  --purple-bright-rgb:160 79 201; --purple-light-rgb:200 150 255; --purple-deep-rgb:140 80 180;
  --yellow-bright-rgb:255 220 100; --red-bright-rgb:200 60 60;
  --dark-1-rgb:14 9 6; --dark-2-rgb:18 11 6; --dark-3-rgb:10 6 4; --dark-4-rgb:24 16 9;

  /* radius scale (px) — use these instead of literal border-radius values */
  --r-1:1px; --r-2:2px; --r-3:3px; --r-4:4px; --r-6:6px; --r-8:8px; --r-10:10px; --r-12:12px;
}
*{box-sizing:border-box;margin:0;padding:0}
::-webkit-scrollbar { width: 10px; background: rgba(14,9,6,.95); }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, var(--ember), var(--blood)); border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, var(--ember-soft), var(--blood-lit)); }
::-webkit-scrollbar-track { background: #070504; }
html{scroll-behavior:smooth; scrollbar-color: #5a2a10 #0e0905; scrollbar-width: thin;}
body{font-family:Lora,Georgia,serif;-webkit-font-smoothing:antialiased;color:var(--bone);
  background:#070504 url('theme/bg.jpg') repeat;background-size:380px}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(130% 60% at 50% -8%,rgba(190,80,28,.42),transparent 56%),linear-gradient(180deg,rgba(14,9,6,.12),rgba(14,9,6,.45))}
a{color:inherit;text-decoration:none}
h1:focus{outline:none}
.shell{width:1100px;max-width:100%;margin:0 auto;padding:0 14px}
@media(min-width:560px){.shell{padding:0 8px}}

@keyframes pulse{50%{opacity:.35}}

/* ── banner ── */
.banner{position:relative;width:min(1100px,100%);height:228px;margin:0 auto;overflow:hidden;border-bottom:2px solid rgba(179,22,15,.6)}
@media(max-width:560px){.banner{height:160px}}
.banner-bg{position:absolute;inset:0;background:url('theme/hero.jpg') center 36%/cover no-repeat;transform:scale(1.06);animation:drift 30s var(--ease) infinite alternate}
@keyframes drift{to{transform:scale(1.13) translateY(-7px)}}
.banner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,5,4,.25),transparent 34%,rgba(7,5,4,.15) 64%,rgba(7,5,4,.9))}
.embers{position:absolute;inset:0;z-index:var(--z-embers);pointer-events:none}
.e{position:absolute;bottom:-8px;border-radius:50%;background:radial-gradient(circle,var(--ember-soft),var(--ember) 60%,transparent);box-shadow:0 0 7px 2px rgba(255,120,40,.6);animation:rise linear infinite}
@keyframes rise{0%{transform:translateY(0);opacity:0}14%{opacity:1}100%{transform:translateY(-228px) translateX(22px);opacity:0}}
.banner-inner{position:relative;z-index:var(--z-content);display:grid;grid-template-columns:200px 1fr 230px;gap:14px;height:100%;align-items:center}
.banner-center{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.logo{width:min(440px,80vw);filter:drop-shadow(0 6px 22px rgba(255,80,20,.55)) drop-shadow(0 2px 4px rgba(0,0,0,.6))}
@media (prefers-reduced-motion: no-preference) {
  .logo{animation:logo-glow 5s var(--ease-in-out) infinite alternate}
}
@keyframes logo-glow{
  from{filter:drop-shadow(0 6px 22px rgba(255,80,20,.55)) drop-shadow(0 2px 4px rgba(0,0,0,.6))}
  to{filter:drop-shadow(0 8px 32px rgba(255,90,20,.85)) drop-shadow(0 2px 4px rgba(0,0,0,.6))}
}
.tag{margin-top:0;font-size:13px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold-lit);font-weight:600;text-shadow:0 2px 12px #000}
@media(max-width:480px){.tag{letter-spacing:.2em}}
.banner-cta{margin-top:14px}

/* ── ornate header bar (wide content boxes) ── */
.obar{position:relative;line-height:0}
.obar img{width:100%;display:block}
.obar .t{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;line-height:1;
  font-family:Cinzel,serif;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--gold-lit);
  font-size:clamp(13px,1.5vw,17px);text-shadow:0 2px 8px #000,0 0 14px rgba(255,90,20,.5);padding-bottom:6px}

/* ── simple CSS header bar (narrow menu / sidebar boxes) ── */
.sbar{font-family:Cinzel,serif;font-weight:700;font-size:12.5px;text-transform:uppercase;letter-spacing:.09em;
  color:var(--gold-lit);text-align:center;padding:8px 10px 7px;position:relative;
  background:linear-gradient(180deg,#241509,#160c05);
  border-top:1px solid rgba(247,208,137,.5);border-bottom:1px solid rgba(179,22,15,.55);
  box-shadow:inset 0 0 16px rgba(255,90,20,.12);text-shadow:0 1px 6px rgba(255,90,20,.5)}
.sbar::before,.sbar::after{content:"◆";color:var(--ember);font-size:8px;position:absolute;top:50%;transform:translateY(-50%);opacity:.8}
.sbar::before{left:8px}.sbar::after{right:8px}

/* ── boxes ── */
/* carved-stone ornate frame — the retro Tibia tablet look.
   calmframe-trim.png is shipped at 50% of the mockup original, so the
   border-image slice is 29 (mockup: 58). */
.darkbox{background:linear-gradient(180deg,rgba(38,24,13,.96),rgba(24,16,9,.97));
  border:10px solid transparent;border-image:url('theme/calmframe-trim.png') 29 / 10px / 0 stretch;
  box-shadow:0 4px 14px rgba(0,0,0,.55);overflow:hidden}
.darkbox + .darkbox{margin-top:13px}

/* ── news ticker ── */
.ticker{margin:14px 0}
.ticker .body{background:linear-gradient(180deg,rgba(18,11,6,.96),rgba(10,6,4,.97));border:1px solid rgba(232,161,60,.22);border-top:0;border-radius:0 0 3px 3px;padding:6px 0}
.trow{display:flex;gap:10px;align-items:baseline;padding:5px 16px;font-size:12.5px;color:var(--ash);transition:background .16s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.trow:hover{background:rgba(255,106,26,.07)}}
.trow:active{background:rgba(255,106,26,.12)}
.trow .d{color:var(--ember);font-variant-numeric:tabular-nums;flex:none;font-size:11.5px;background:rgba(255,106,26,.08);padding:2px 7px;border-radius:3px;border:1px solid rgba(255,106,26,.3);font-weight:700}
.trow .x{color:var(--bone)}.trow::before{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' width='9' height='9'%3E%3Cpath d='M5 0L10 5L5 10L0 5Z' fill='%23ff3a22'/%3E%3C/svg%3E");margin-right:4px;display:inline-flex;align-items:center}

/* home — inline news list (under featured article) */
.news-h3{font-family:Cinzel,serif;font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink);margin:22px 0 8px;padding-top:14px;border-top:1px solid rgba(58,36,16,.25)}
.news-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.news-list li{display:flex;gap:10px;align-items:baseline;padding:5px 0;font-size:12.5px;color:var(--ink-soft)}
.news-date{color:var(--ember);font-variant-numeric:tabular-nums;flex:none;font-size:11.5px;
  background:rgba(255,106,26,.08);padding:2px 7px;border-radius:3px;
  border:1px solid rgba(255,106,26,.3);font-weight:700}
.news-text{color:var(--ink-soft);line-height:1.4}
.news-more-wrap{margin:14px 0 0;text-align:right}
.news-more{font-family:Cinzel,serif;font-weight:700;font-size:12px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ember-soft);transition:color .15s var(--ease)}
.news-more:hover{color:var(--gold-lit)}

/* /news page — full news archive */
.news-article{padding:14px 0;border-bottom:1px solid rgba(58,36,16,.25)}
.news-article:last-of-type{border-bottom:0}
.news-article-date{font-family:Cinzel,serif;font-weight:700;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-link);margin-bottom:6px}
.news-article-text{font-size:14px;line-height:1.6;color:var(--ink-soft);margin:0}
.news-back-wrap{margin:24px 0 4px;text-align:center}
.news-back{font-family:Cinzel,serif;font-weight:700;font-size:12px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-link);text-decoration:underline;transition:color .15s var(--ease)}
.news-back:hover{color:var(--blood)}

/* ── 3 column grid ── */
.grid{display:grid;grid-template-columns:200px 1fr 230px;gap:14px;padding:14px 0 32px;align-items:start}
.grid.has-ticker{padding-top:0}
@media(max-width:980px){
  .grid{grid-template-columns:1fr}
  .c-center{order:1}.c-left{order:2}.c-right{order:3}
}
.col{display:flex;flex-direction:column;gap:13px;animation:rise-in 380ms var(--ease-out) both;min-width:0}
.c-left{animation-delay:0ms}
.c-center{animation-delay:60ms}
.c-right{animation-delay:120ms}
@keyframes rise-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* menu links — dense, with Tibia-style icons */
.mlist{padding:4px 0}
.ml-group{margin-top:4px}
.ml-group:first-child{margin-top:0}
.ml-group-title{display:block;font-family:Cinzel,serif;font-size:8.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ember);padding:6px 14px 2px;margin-bottom:4px;border-bottom:1px solid rgba(232,161,60,.15)}
.ml{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 14px;font-family:Cinzel,Georgia,serif;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--bone);position:relative;border-left:2px solid transparent;transition:color .16s var(--ease-out),background .16s var(--ease-out),border-color .16s var(--ease-out);white-space:nowrap}
.ml::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--ember),transparent);transform:scaleX(0);transition:transform .22s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.ml:hover{color:var(--gold-lit);background:rgba(255,106,26,.08);border-left-color:var(--ember)}.ml:hover::after{transform:scaleX(1)}}
.ml:active{background:rgba(255,106,26,.12)}
.ml.hot{color:var(--blood-lit);font-weight:700;text-shadow:0 0 8px rgba(255,58,34,.25)}
.ml:focus-visible{outline:2px solid var(--ember);outline-offset:-2px}
.mi{display:inline-block;width:14px;height:14px;margin-right:6px;vertical-align:-2px;
  background:center/contain no-repeat;filter:drop-shadow(0 1px 1px rgba(0,0,0,.6))}
.mi-hs{background-image:url('theme/ic-highscores.png')}
.mi-on{background-image:url('theme/ic-online.png')}
.mi-kill{background-image:url('theme/ic-kills.png')}
.mi-house{background-image:url('theme/ic-houses.png')}
.mi-guild{background-image:url('theme/ic-guilds.png')}
.mi-war{background-image:url('theme/ic-wars.png')}
.mi-char{background-image:url('theme/ic-search.png')}
.mi-qs{background-image:url('theme/ic-kills.png')}

/* info rows */
.irow{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:7px 14px;font-size:13px;border-bottom:1px solid rgba(232,161,60,.08);line-height:1.35}
.irow:last-child{border:0}.irow span{color:var(--bone);opacity:.82}.irow b{color:var(--gold-lit);font-weight:700}.irow .on{color:#5fe08a;font-weight:700}
/* parchment context: dark ink for readability */
.post .irow{border-bottom-color:rgba(58,36,16,.14)}
.post .irow span{color:var(--ink-soft);font-weight:600}
.post .irow b{color:var(--ink);font-weight:700}
.post .irow:nth-child(odd){background:rgba(58,36,16,.04)}

/* top players */
.rank{display:flex;align-items:center;gap:9px;padding:7px 12px;font-size:13px;border-bottom:1px solid rgba(232,161,60,.07);transition:background .16s var(--ease-out),transform .16s var(--ease-out);text-decoration:none;color:inherit;cursor:pointer}
.rank:last-of-type{border:0}
@media (hover:hover) and (pointer:fine){.rank:hover{background:rgba(255,106,26,.06);transform:translateX(4px);color:var(--gold-lit)}}
.rank:active{transform:translateX(2px);background:rgba(255,106,26,.08)}
.rank .n{width:18px;font-family:Cinzel,serif;font-weight:700;color:var(--ember);text-align:center;flex:none}
.rank .nm{flex:1;color:var(--bone);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
@media (hover:hover) and (pointer:fine){.rank .nm:hover{color:var(--gold-lit)}}
.rank .v{width:12px;height:12px;border-radius:50%;flex:none;box-shadow:0 0 6px currentColor}
.v-sorc{background:var(--vocation-sorcerer);color:var(--vocation-sorcerer)}
.v-druid{background:var(--vocation-druid);color:var(--vocation-druid)}
.v-pala{background:var(--vocation-paladin);color:var(--vocation-paladin)}
.v-knight{background:var(--vocation-knight);color:var(--vocation-knight)}
.v-none{background:var(--vocation-none);color:var(--vocation-none)}
.rank .lv{color:var(--gold-lit);font-weight:600;font-variant-numeric:tabular-nums}
.rank-av{width:32px;height:32px;image-rendering:pixelated;flex:none;background:#0b0907;border-radius:3px;border:1px solid rgba(232,161,60,.2)}
.rank-empty{padding:10px 12px;font-size:12px;color:var(--ash)}

.monster-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media(max-width:560px){.monster-grid{grid-template-columns:repeat(2,1fr)}}
.monster{margin:0}
.monster a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;background:linear-gradient(180deg,#1a0f06,#0c0703);border:2px solid #3a2410;border-radius:3px;transition:transform .16s var(--ease-out),border-color .16s var(--ease-out),box-shadow .16s var(--ease-out);text-decoration:none;color:inherit}
.monster a:hover{transform:translateY(-2px);border-color:rgba(255,106,26,.5);box-shadow:0 4px 14px rgba(255,90,20,.25)}
.monster img{image-rendering:pixelated;background:#050202;border-radius:2px;border:1px solid rgba(232,161,60,.18);width:96px;height:96px;object-fit:contain}
.monster .mn{font-family:Cinzel,serif;font-weight:700;font-size:12px;color:var(--gold-lit);text-align:center;letter-spacing:.04em}

.item-strip{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(8,1fr);gap:8px}
@media(max-width:560px){.item-strip{grid-template-columns:repeat(4,1fr)}}
.item-cell{margin:0}
.item-cell a{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;background:linear-gradient(180deg,#1a0f06,#0c0703);border:2px solid #3a2410;border-radius:3px;transition:transform .16s var(--ease-out),border-color .16s var(--ease-out);text-decoration:none;color:inherit}
.item-cell a:hover{transform:translateY(-2px);border-color:rgba(255,106,26,.5)}
.item-cell img{image-rendering:pixelated;background:#050202;border-radius:2px;width:48px;height:48px;object-fit:contain}
.item-cell .in{font-family:Cinzel,serif;font-weight:700;font-size:10.5px;color:var(--gold-lit);text-align:center;letter-spacing:.03em;line-height:1.15}

.voc-tiles{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media(max-width:560px){.voc-tiles{grid-template-columns:repeat(2,1fr)}}
.voc{margin:0}
.voc a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px 12px;background:linear-gradient(180deg,#1a0f06,#0c0703);border:2px solid #3a2410;border-radius:3px;transition:transform .16s var(--ease-out),border-color .16s var(--ease-out),box-shadow .16s var(--ease-out);text-decoration:none;color:inherit;position:relative;overflow:hidden}
.voc a::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 100%,var(--v-glow,transparent) 0%,transparent 65%);opacity:.4;pointer-events:none}
.voc-knight{--v-glow:rgba(255,40,40,.18)}
.voc-pala{--v-glow:rgba(40,140,255,.18)}
.voc-sorc{--v-glow:rgba(180,40,255,.18)}
.voc-druid{--v-glow:rgba(40,200,80,.18)}
.voc a:hover{transform:translateY(-2px);border-color:rgba(255,106,26,.5);box-shadow:0 4px 14px rgba(255,90,20,.25)}
.voc img{image-rendering:auto;width:96px;height:96px;object-fit:contain;position:relative;z-index:1}
.voc .vn{font-family:Cinzel,serif;font-weight:800;font-size:14px;color:var(--gold-lit);text-align:center;letter-spacing:.06em;text-transform:uppercase;position:relative;z-index:1}
.voc .vd{font-size:11px;color:var(--ash);text-align:center;position:relative;z-index:1}

/* ── PARCHMENT content panel ── */
.pbox{position:relative}
.pbox .body{position:relative;background:#f3e9d4 url('theme/parchment.jpg');background-size:300px;
  border:1px solid rgba(232,161,60,.3);border-top:0;border-radius:0 0 3px 3px;color:var(--ink);
  padding:16px 18px;box-shadow:inset 0 0 28px rgba(120,70,20,.10);
  text-shadow:0 1px 1px rgba(243,233,212,.85)}
.pbox .body::before,.pbox .body::after{content:"";position:absolute;width:6px;height:6px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#7d5a2e,#2a1808 70%,#1a0f06);box-shadow:inset 0 1px 1px rgba(255,220,170,.35),0 1px 2px rgba(0,0,0,.5);pointer-events:none;z-index:2}
.pbox .body::before{top:6px;left:6px}
.pbox .body::after{bottom:6px;right:6px}
.pbox .obar{filter:drop-shadow(0 3px 8px rgba(0,0,0,.55))}
.pbox + .pbox{margin-top:14px}
.pbox{transition:transform .22s var(--ease-out),filter .22s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.pbox:hover{transform:translateY(-2px);filter:brightness(1.02)}}
.post-date{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blood);margin-bottom:5px}
.post h2{font-family:Cinzel,serif;font-weight:800;font-size:22px;color:var(--ink);margin-bottom:8px;text-wrap:balance}
.post p{font-size:14px;line-height:1.58;color:var(--ink-soft);margin-bottom:10px}
.post p:last-child{margin-bottom:0}
.post p b, .post p strong{color:var(--ink)}
.post-img{width:100%;height:140px;background:url('theme/hero.jpg') center 42%/cover;border:2px solid #1a0f06;
  border-radius:2px;margin:12px 0;box-shadow:0 3px 10px rgba(0,0,0,.35)}
.post-img-demon{height:auto;max-height:220px;aspect-ratio:16/6;background:#050202;padding:0;position:relative;overflow:hidden}
.post-img-demon img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 30%}
.post-img-vignette{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0)60%,rgba(0,0,0,.7)100%);pointer-events:none}
.post .by{margin-top:12px;font-size:11.5px;color:var(--ink-link);font-weight:600}

/* ruleset / item grid on parchment */
.slots{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:6px}
.slots--spaced{margin-top:16px}
@media(max-width:560px){.slots{grid-template-columns:repeat(2,1fr)}}
.slot{background:linear-gradient(180deg,#1a0f06,#0c0703);border:2px solid #3a2410;border-radius:3px;
  padding:14px 8px;text-align:center;box-shadow:inset 0 0 12px rgba(255,90,20,.15);transition:transform .16s var(--ease-out),border-color .16s var(--ease-out),box-shadow .16s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.slot:hover{transform:translateY(-2px);border-color:rgba(255,106,26,.5);box-shadow:0 4px 14px rgba(255,90,20,.25)}}
.slot:active{transform:scale(0.97);transition-duration:100ms}
.slot .ic{display:inline-grid;place-items:center;width:32px;height:32px;color:var(--ember);margin:0 auto}.slot .ic i{font-size:22px}
.skill-icon{color:var(--ember);font-size:14px;margin-right:6px;vertical-align:middle}
.slot .big{font-family:Cinzel,serif;font-weight:900;font-size:24px;color:var(--gold-lit)}
.slot .l{font-family:Cinzel,serif;font-weight:700;font-size:12px;color:var(--bone);margin-top:5px}
.slot .s{font-size:10.5px;color:var(--bone);margin-top:2px}

/* buttons */
.btn{font-family:Cinzel,serif;font-weight:700;cursor:pointer;border:0;transition:filter .2s var(--ease),transform .1s var(--ease);display:inline-flex;align-items:center;justify-content:center;gap:7px}
.btn:active{transform:scale(.97)}.btn:focus-visible{outline:2px solid var(--gold-lit);outline-offset:2px}
.btn-fire{background:var(--ember);color:#190a03;
  border:1px solid var(--blood);box-shadow:0 2px 8px rgba(255,106,26,.25);border-radius:4px;padding:9px 14px;font-size:12.5px;width:100%}
.btn-fire:hover{background:var(--ember-soft);box-shadow:0 4px 12px rgba(255,106,26,.35)}
.btn-fire.inline{width:auto;padding:9px 22px}
.btn-ghost{background:rgba(90,36,8,.14);border:1px solid rgba(90,36,8,.9);color:var(--ink);border-radius:4px;padding:6px 14px;font-size:11.5px;font-weight:600;transition:background .16s var(--ease),border-color .16s var(--ease),box-shadow .16s var(--ease),transform .1s var(--ease)}
.btn-ghost:hover{background:rgba(90,36,8,.24);border-color:rgba(90,36,8,1);box-shadow:0 2px 8px rgba(90,36,8,.18)}
.btn-ghost:active{background:rgba(90,36,8,.3);transform:scale(.97)}
.btn-ghost:focus-visible{outline:2px solid var(--ember);outline-offset:2px}

/* account mini-form in sidebar */
.acct{padding:12px}
.acct-av{display:flex;justify-content:center;margin-bottom:8px}
.acct-av img{image-rendering:auto;width:64px;height:64px;object-fit:contain;background:radial-gradient(circle,rgba(255,106,26,.08),transparent 70%)}
.acct-char{text-align:center;font-family:Cinzel,serif;font-weight:700;font-size:12px;color:var(--gold-lit);margin-bottom:10px;letter-spacing:.04em}
.acct .who{letter-spacing:.04em;text-transform:uppercase;font-size:10.5px;color:var(--ash-dim);margin-bottom:10px;text-align:center}
.acct .who b{color:var(--gold-lit)}
.inp{width:100%;background:#0a0604;border:1px solid rgba(232,161,60,.28);border-radius:4px;padding:8px 10px;color:#fff;font-size:12.5px;margin-bottom:7px;outline:none;transition:border-color .18s var(--ease),background .18s var(--ease),box-shadow .18s var(--ease)}
.inp::placeholder{color:var(--ash-dim)}
.inp:focus{border-color:var(--ember);box-shadow:0 0 0 3px rgba(255,106,26,.16)}
.inp:user-invalid,.acct .inp.is-invalid{border-color:var(--blood);background:rgba(179,22,15,.08)}
.inp:disabled,.pinp:disabled{opacity:.55;cursor:not-allowed}
.acct .reg{display:block;text-align:center;margin-top:9px;font-size:12px;color:var(--gold);font-weight:600;transition:color .16s var(--ease)}
.acct .reg:hover{color:var(--ember-soft)}

/* ── GM account box — epic but contained ── */
.acct-gm{position:relative;padding:14px 10px 12px;margin:-2px -2px 0;background:linear-gradient(180deg,rgba(255,106,26,.08),rgba(179,22,15,.04));border:1px solid rgba(255,106,26,.55);border-radius:5px;box-shadow:0 0 18px rgba(255,106,26,.18),inset 0 0 24px rgba(255,106,26,.06)}
.acct-gm::before{content:"";position:absolute;top:-1px;left:8px;right:8px;height:2px;background:linear-gradient(90deg,transparent,var(--ember),var(--gold-lit),var(--ember),transparent);border-radius:1px;box-shadow:0 0 12px rgba(255,106,26,.55),0 0 24px rgba(255,106,26,.3);animation:gm-pulse 2.4s var(--ease) infinite}
@keyframes gm-pulse{0%,100%{opacity:.7}50%{opacity:1}}
.acct-gm .who{color:var(--ash);text-shadow:0 1px 2px rgba(0,0,0,.5)}
.acct-gm .who b{color:var(--gold-lit);text-shadow:0 0 12px rgba(247,208,137,.35)}
.gm-title{font-family:Cinzel,serif;font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ember);text-align:center;margin-bottom:8px;text-shadow:0 0 10px rgba(255,106,26,.45)}
.gm-badge{display:inline-block;font-family:Cinzel,serif;font-size:8px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#190a03;background:linear-gradient(180deg,var(--ember-soft),var(--ember));border:1px solid var(--blood);border-radius:2px;padding:1px 4px 0;margin-right:5px;vertical-align:1px;box-shadow:0 0 8px rgba(255,106,26,.35)}
@media (prefers-reduced-motion: reduce){
  .acct-gm::before{animation:none;opacity:.9}
}

/* ── forms on parchment (AAC pages) ── */
.pform{position:relative;padding:6px 0}
.pform .field{margin-bottom:14px}
.pform label{display:block;font-family:Cinzel,serif;font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);margin-bottom:5px}
.pinp{width:100%;max-width:380px;background:#f4ecd9;border:1px solid #a8845a;border-radius:3px;padding:8px 10px;color:var(--ink);font-size:13.5px;outline:none;box-shadow:inset 0 1px 3px rgba(90,50,10,.18),inset 0 0 0 1px rgba(255,255,255,.4);transition:border-color .18s var(--ease),box-shadow .18s var(--ease)}
.pinp::placeholder{color:var(--ink-soft);opacity:1}
.pinp:focus{border-color:var(--ember);box-shadow:inset 0 1px 3px rgba(90,50,10,.18),inset 0 0 0 1px rgba(255,255,255,.4),0 0 0 3px rgba(255,106,26,.18)}
.pform .hint{display:block;font-size:11.5px;color:var(--ink-link);margin-top:3px;max-width:380px}
select.pinp{appearance:auto}
.perr{background:linear-gradient(180deg,#3a0d08,#260805);border:1px solid var(--blood);color:#ffb4a8;border-radius:3px;padding:9px 12px;font-size:12.5px;margin-bottom:14px}
.pok{background:linear-gradient(180deg,#0d2a12,#081a0b);border:1px solid #2f7a3f;color:#9fe0ae;border-radius:3px;padding:9px 12px;font-size:12.5px;margin-bottom:14px}
.validation-message{color:var(--blood);font-size:12px;margin-top:3px}
ul.validation-errors{margin:0 0 12px;padding:0;list-style:none}
ul.validation-errors li{color:var(--blood);font-size:12.5px;padding:2px 0}
ul.validation-errors li::before{content:"✖ ";font-size:10px}
.invalid:not(form){outline:1px solid var(--blood)}
.valid.modified:not([type=checkbox]):not(form){outline:1px solid #2f7a3f}

/* ── tables on parchment ── */
.ptable{width:100%;border-collapse:collapse;font-size:13px;margin:6px 0;border:1px solid rgba(58,36,16,.22)}
.ptable th{font-family:Cinzel,serif;font-weight:700;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);text-align:left;padding:8px 10px;background:rgba(58,36,16,.1);border-bottom:2px solid #3a2410}
.ptable td{padding:7px 10px;color:var(--ink-soft);border-bottom:1px solid rgba(58,36,16,.16)}
.ptable tbody tr:nth-child(even){background:rgba(58,36,16,.04)}
.ptable tbody tr:hover{background:rgba(120,70,20,.08)}
.ptable td:first-child{font-family:Cinzel,serif;font-weight:700;color:var(--ink)}
.ptable .num{font-variant-numeric:tabular-nums}
.item-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:6px 0}
.item-table-wrap .ptable{margin:0}

/* sortable table headers */
.sortable{cursor:pointer;user-select:none;white-space:nowrap}
.sortable:hover{color:var(--blood)}
.sortable:focus-visible{outline:2px solid var(--ember);outline-offset:2px}
.item-row.sel,.bst-row.sel{background:rgba(179,22,15,.12)}
.item-row.sel td:first-child,.bst-row.sel td:first-child{color:var(--blood)}
.bst-icon-cell{width:24px;text-align:center}
.bst-icon-cell img{width:18px;height:18px;image-rendering:auto;vertical-align:middle}

/* highscore category pills */
.cats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.cats a,.cats strong{font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:3px;border:1px solid rgba(138,52,16,.35);color:var(--ink-link)}
.cats a:hover{background:rgba(138,52,16,.1)}
.cats strong{background:linear-gradient(180deg,var(--blood-lit),var(--blood));color:#ffe9dd;border-color:var(--blood)}

/* catalog filter pills (shared across bestiary, items, achievements, npcs) */
.bst-pill{font-family:Inter,system-ui,sans-serif;font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:3px;cursor:pointer;border:1px solid rgba(138,52,16,.35);background:transparent;color:var(--ink-link);transition:background .16s var(--ease),color .16s var(--ease)}
.bst-pill:hover{background:rgba(138,52,16,.1)}
.bst-pill.on{background:linear-gradient(180deg,var(--blood-lit),var(--blood));color:#ffe9dd;border-color:var(--blood)}
.bst-pill:focus-visible{outline:2px solid var(--ember);outline-offset:2px}

/* sticky filter chrome for the long reference lists (bestiary/items/npcs).
   One sticky layer only — stacked sticky offsets can't survive the wrapping
   pill rows, so the search+pill bar is the chrome and the thead scrolls away.
   Background matches .pbox .body so rows slide under invisibly. */
.lst-filters{position:sticky;top:0;z-index:6;background:#f3e9d4 url('theme/parchment.jpg');background-size:300px;padding:8px 2px 4px;margin:0 -2px 8px;border-bottom:1px solid rgba(58,36,16,.18)}
.lst-filters .cats{margin-bottom:4px}

/* detail-panel enter for master-detail lists — one subtle drop+fade. */
.bst-detail,.item-detail,.npc-detail,.qst-detail{animation:lst-detail-in .28s var(--ease)}
@keyframes lst-detail-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce) {
  .bst-detail,.item-detail,.npc-detail,.qst-detail{animation:none}
}

/* parchment prose niceties */
.post a:not(.btn){color:var(--ink-link);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.post a:not(.btn):hover{color:var(--blood-lit)}
.post a:focus-visible{outline:2px solid var(--ember);outline-offset:3px;border-radius:1px}
.post code{background:rgba(58,36,16,.12);border:1px solid rgba(58,36,16,.25);border-radius:3px;padding:1px 6px;font-size:12.5px;color:var(--ink)}
.post h3{font-family:Cinzel,serif;font-weight:800;font-size:17px;color:var(--ink);margin:16px 0 8px}
.post .sep{border:0;border-top:1px solid rgba(58,36,16,.25);margin:16px 0}

/* page-level h1 + intro — sits inside a Panel body, below the Panel's obar title.
   Styled to be a clean landmark without visually duplicating the Panel title. */
.page-h1{font-family:Cinzel,serif;font-weight:900;font-size:27px;line-height:1.15;color:var(--ink);
  margin:4px 0 8px;letter-spacing:.005em;text-wrap:balance}
.page-intro{font-size:13.5px;line-height:1.55;color:var(--ink-soft);margin:0 0 14px;max-width:62ch;
  text-wrap:pretty}
.page-intro code{background:rgba(58,36,16,.1);border:1px solid rgba(58,36,16,.22);border-radius:3px;
  padding:0 5px;font-size:12px;color:var(--ink-soft);font-family:inherit}
.data-fresh{font-size:11.5px;color:var(--ink-soft);margin:-4px 0 14px;letter-spacing:.02em}
.data-fresh time{font-variant-numeric:tabular-nums}
.data-live{color:var(--ember,#ff6a1a);font-weight:700;margin-right:2px}

/* skip-to-content — only visible when focused (keyboard nav) */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;z-index:1000}
.skip-link:focus{left:12px;top:12px;width:auto;height:auto;padding:8px 14px;background:var(--ink,#2a1808);
  color:var(--bone,#efe6db);border:2px solid var(--ember,#ff6a1a);border-radius:3px;font-weight:700;
  font-family:Cinzel,serif;font-size:13px;letter-spacing:.06em;text-transform:uppercase;outline:none}
main:focus{outline:none}

/* ── /play page — download CTA + steps ───────────────────────────────── */
.dl-cta{display:flex;align-items:center;justify-content:flex-start;gap:14px;width:100%;max-width:520px;padding:14px 22px;
  margin:6px 0 18px;font-size:15px;text-align:left;line-height:1.25}
.dl-cta-ic{flex:0 0 auto;width:22px;height:22px;margin-top:1px}
.dl-cta-main{display:block;font-family:Cinzel,serif;font-weight:800;font-size:17px;letter-spacing:.04em}
.dl-cta-sub{display:block;font-family:Lora,Georgia,serif;font-weight:400;font-size:11.5px;
  letter-spacing:.02em;opacity:.82;margin-top:2px}
.dl-h2{font-family:Cinzel,serif;font-weight:800;font-size:15px;color:var(--ink);
  margin:14px 0 8px;letter-spacing:.02em}
.dl-steps{margin:0 0 14px 24px;padding:0;color:var(--ink-soft);line-height:1.55}
.dl-steps li{margin-bottom:4px}
.dl-steps li b{color:var(--ink)}
.dl-steps code{background:rgba(58,36,16,.1);border:1px solid rgba(58,36,16,.22);border-radius:3px;
  padding:0 5px;font-size:12.5px;color:var(--ink);font-family:ui-monospace,monospace}
.dl-note{font-size:12.5px;color:var(--ink-soft);margin:0 0 4px;line-height:1.55}
.dl-server{max-width:360px}
@media(max-width:560px){
  .dl-server{max-width:none;width:100%}
  .dl-steps{margin-left:16px}
}

/* visually-hidden — for screen-reader-only landmarks */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}

.nf-wrap{text-align:center;padding:24px 0 32px}
.nf-404{font-family:Cinzel,serif;font-weight:900;font-size:88px;color:var(--blood);text-shadow:0 0 28px rgba(179,22,15,.4),0 4px 0 #000;line-height:1;margin:8px 0 12px;letter-spacing:.04em}

footer{border-top:2px solid rgba(232,161,60,.4);background:linear-gradient(180deg,rgba(28,17,9,.92),rgba(14,9,5,.95));
  box-shadow:inset 0 1px 0 rgba(255,90,20,.2)}
.f-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1010px;margin:0 auto;padding:18px 14px 12px}
@media(max-width:720px){.f-grid{grid-template-columns:1fr}}
.f-col h4{font-family:Cinzel,serif;font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-lit);margin-bottom:7px}
.f-col p,.f-col a{font-size:12px;line-height:1.45}
.f-col p{color:var(--bone)}
.f-col a{color:var(--ember-soft);transition:color .16s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.f-col a:hover{color:var(--gold-lit)}}
.f-col a:active{color:var(--gold-lit)}
.f-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:3px}
.f-bot{border-top:1px solid rgba(232,161,60,.15);padding:10px;text-align:center;color:var(--ash);font-size:11px}
.f-bot .sk{color:var(--ember)}

@media(prefers-reduced-motion:reduce){.e,.banner-bg,.logo,.char-portrait,.char-stat::after,.status .on::before{animation:none}.e{display:none}.col{animation:none}.rank:active,.slot:active,.ml:active,.char-gear-slot:hover{transform:none}}

/* ── Blazor framework chrome ── */
#blazor-error-ui{color-scheme:dark;background:#260805;border-top:2px solid var(--blood);bottom:0;color:#ffb4a8;display:none;left:0;padding:.6rem 1.25rem .7rem;position:fixed;width:100%;z-index:1000;font-size:13px}
#blazor-error-ui .dismiss{cursor:pointer;position:absolute;right:.75rem;top:.5rem;background:transparent;border:0;color:inherit;font:inherit;padding:0;line-height:1}
#blazor-error-ui .reload{color:var(--gold-lit);text-decoration:underline}
.blazor-error-boundary{background:#b32121;padding:1rem;color:white;border-radius:3px}
.blazor-error-boundary::after{content:"An error has occurred."}

/* ── create-character · Summoning Altar (approved mockup variant B) ── */
.cc-form{text-align:center}
.cc-name{max-width:300px;margin:0 auto 18px}
.cc-name .pinp{text-align:center;font-family:Cinzel,serif;font-weight:700;font-size:15px;padding:10px;max-width:none}
.cc-altar{display:flex;align-items:center;justify-content:center;gap:18px;margin:6px 0 18px}
.cc-colcol{display:flex;flex-direction:column;gap:9px}
.cc-sw{width:26px;height:26px;border-radius:6px;border:2px solid rgba(0,0,0,.35);box-shadow:0 1px 3px rgba(0,0,0,.3);padding:0;cursor:default}
.cc-medallion{width:140px;height:140px;border-radius:50%;border:6px solid #3a2410;display:grid;place-items:center;
  background:radial-gradient(circle at 50% 38%,rgba(255,120,40,.30),rgba(26,15,6,.9) 72%);
  box-shadow:0 0 32px rgba(255,90,20,.4),inset 0 0 30px rgba(0,0,0,.6)}
.cc-medallion img{width:96px;height:96px;image-rendering:auto}
.cc-rotate{display:flex;align-items:center;justify-content:center;gap:14px;margin:-8px 0 18px}
.cc-rot{width:34px;height:34px;display:grid;place-items:center;font-size:13px;line-height:1;color:var(--bone);
  background:#1a0f06;border:2px solid #3a2410;border-radius:50%;cursor:pointer;
  transition:border-color .16s var(--ease),box-shadow .16s var(--ease),color .16s var(--ease)}
.cc-rot:hover{border-color:#ff7a28;color:#ff9a48;box-shadow:0 0 14px rgba(255,90,20,.45)}
.cc-rot-label{font-family:Cinzel,serif;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ash)}
.cc-reroll{margin-left:6px;font-size:18px}
.cc-colors{margin:0 0 18px}
.cc-channels{display:flex;gap:8px;justify-content:center;margin-bottom:12px;flex-wrap:wrap}
.cc-chan{display:flex;align-items:center;gap:7px;background:#1a0f06;border:2px solid #3a2410;border-radius:4px;
  padding:6px 10px;cursor:pointer;color:var(--ash);font-family:Cinzel,serif;font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;transition:border-color .16s var(--ease),color .16s var(--ease)}
.cc-chan:hover{border-color:#6a4a20;color:var(--bone)}
.cc-chan.is-active{border-color:#ff7a28;color:#ff9a48;box-shadow:0 0 12px rgba(255,90,20,.35)}
.cc-chan-sw{width:16px;height:16px;border-radius:3px;border:1px solid rgba(0,0,0,.5);box-shadow:inset 0 0 3px rgba(0,0,0,.5)}
.cc-palette{display:grid;grid-template-columns:repeat(19,1fr);gap:2px;max-width:340px;margin:0 auto;
  padding:8px;background:#120a04;border:2px solid #3a2410;border-radius:6px}
.cc-pcell{aspect-ratio:1;border:1px solid rgba(0,0,0,.35);border-radius:2px;cursor:pointer;padding:0;
  transition:transform .08s var(--ease),border-color .08s var(--ease)}
.cc-pcell:hover{transform:scale(1.3);z-index:1;border-color:#fff}
.cc-pcell.is-sel{outline:2px solid #ff9a48;outline-offset:0;border-color:#fff;z-index:2}
.cc-vocs{display:flex;gap:9px;justify-content:center;margin-bottom:16px}
.cc-voc{flex:1;max-width:120px;background:#1a0f06;border:2px solid #3a2410;border-radius:4px;padding:12px 6px;cursor:pointer;
  transition:border-color .16s var(--ease),box-shadow .16s var(--ease);display:block}
.cc-voc .vn{font-family:Cinzel,serif;font-weight:700;font-size:12px;color:var(--bone)}
.cc-voc .vs{font-size:10px;color:var(--ash);margin-top:2px}
.cc-voc:hover{border-color:rgba(255,106,26,.5)}
.cc-radio{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.cc-radio:checked + .cc-voc{border-color:var(--ember);box-shadow:inset 0 0 18px rgba(255,90,20,.35),0 0 0 1px var(--ember)}
.cc-radio:checked + .cc-voc .vn{color:var(--gold-lit)}
.cc-radio:focus-visible + .cc-voc{outline:2px solid var(--gold-lit);outline-offset:2px}
.cc-sex{display:flex;gap:8px;justify-content:center;margin-bottom:18px}
.cc-sex .pill{font-family:Cinzel,serif;font-weight:700;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;
  color:var(--ink-link);border:1px solid rgba(138,52,16,.4);border-radius:4px;padding:6px 16px;cursor:pointer;transition:background .16s var(--ease),color .16s var(--ease)}
.cc-sexradio:checked + .pill{background:linear-gradient(180deg,var(--blood-lit),var(--blood));color:#ffe9dd;border-color:var(--blood)}
.cc-sexradio:focus-visible + .pill{outline:2px solid var(--gold-lit);outline-offset:2px}

/* ── houses ── */
.pagination{display:flex;align-items:center;gap:10px;margin-top:18px;flex-wrap:wrap}
.pagination .page-info{font-size:12.5px;color:var(--ash-dim)}
.pagination .btn-ghost.disabled{opacity:.5;cursor:not-allowed}
.ash{color:var(--ash-dim)}
.house-info .irow b{font-weight:600;color:var(--ink-soft)}
.house-access{margin-top:18px}
.house-access h4{font-family:Cinzel,serif;font-size:13px;color:var(--ink);margin-bottom:6px}
.house-access ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}
.house-access li{font-size:12px;background:rgba(58,36,16,.08);border:1px solid rgba(58,36,16,.18);border-radius:3px;padding:3px 8px;color:var(--ink-soft)}
.house-admin{background:rgba(179,22,15,.06);border:1px solid rgba(179,22,15,.25);border-radius:4px;padding:14px;margin-top:22px}
.house-admin h4{font-family:Cinzel,serif;font-size:13px;color:var(--blood);margin-bottom:10px}
.house-admin .field{margin-bottom:10px}
.house-admin .msg{font-size:12.5px;margin-top:8px}
.house-admin .msg.err{color:var(--blood)}
.house-admin .msg.ok{color:#3a8c3a}
.lib-badge{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:2px 7px;border-radius:3px}
.lib-badge-verified{background:rgba(95,224,138,.15);color:#236b38}
.lib-badge-partial{background:rgba(232,161,60,.15);color:#8a6020}
.lib-badge-unverified{background:rgba(42,24,8,.07);color:var(--ink)}
.lib-badge-new{background:rgba(79,201,106,.18);color:#1f5a30}
.lib-badge-have{background:rgba(42,24,8,.07);color:var(--ink)}
.lib-badge-soon{background:rgba(179,22,15,.1);color:#7a1010}
.house-admin-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.house-access-card{margin-top:12px}
.house-access-card:first-child{margin-top:0}
.house-forsale{color:var(--ink-soft);font-weight:600}
.house-filters{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.house-filter-field{flex:1 1 200px;min-width:0;margin:0}
.house-filter-field .pinp{width:100%}
.house-filter-submit{margin-bottom:1px}
