/* The Sacrament RPG home page and its pages. Colours, fonts and buttons come from theme.css; the page shapes are shared with the blog (blog.css). */
.ic-hero{padding-bottom:44px}
.ic-hero h1{font-size:clamp(3rem,12vw,6.5rem)}
.ic-cta{display:flex;flex-wrap:wrap;gap:14px;margin:26px 0 10px}
.ic-cta .btn{min-width:200px;text-align:center;padding:16px 28px;font-size:.92rem}
.ic-try{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:18px 0 6px}
.ic-try .btn{text-align:center;padding:12px 22px;font-size:.88rem}
.ic-hero .small,.ic-form .small{color:var(--dim);font-size:.95rem;margin:8px 0 0;max-width:60ch}
.ic-cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));max-width:1040px}
.ic-cards .card h2{font-size:1.5rem}
.ic-more,.ic-note{grid-column:1/-1}
.ic-more{font-family:var(--label);letter-spacing:.1em;text-transform:uppercase;font-size:.9rem;margin:6px 0 0}
.ic-note{padding:14px 18px;border:1px dashed var(--line);color:var(--dim);font-size:.98rem}
.ic-body{padding-bottom:56px}
.ic-body .body h3{color:var(--candle)}
blockquote.todo,.body blockquote.todo{font-style:normal;font-size:1rem;margin:18px 0;padding:12px 16px;border:2px dashed var(--candle);border-left-width:6px;background:color-mix(in srgb,var(--candle) 14%,transparent);color:var(--fg)}
blockquote.todo::first-line{font-weight:700}
.todo-inline{background:color-mix(in srgb,var(--candle) 28%,transparent);color:var(--fg);padding:1px 6px}
.btn.disabled{cursor:not-allowed;background:transparent;box-shadow:inset 0 0 0 1px var(--edge);color:var(--dim);display:inline-block}
.btn.disabled:hover{background:transparent}
.ic-form{display:grid;gap:12px;max-width:560px;margin-top:22px}
.ic-form :is(input[type=email],input[type=text],select,textarea){width:100%;box-sizing:border-box;font:inherit;padding:13px 14px;background:var(--bg2);color:var(--fg);border:1px solid var(--edge)}
.ic-form .check{display:flex;gap:10px;align-items:flex-start;line-height:1.45;font-size:.98rem}
.ic-form .check input{margin-top:4px;width:20px;height:20px;flex:0 0 auto}
.ic-form .btn{justify-self:start;cursor:pointer;border:0}
.ic-form .msg{margin:0;min-height:1.4em}
.ic-form .msg.bad{color:var(--blood-hi)}
.ic-foot{margin-top:40px;padding:30px 0 40px;border-top:3px double var(--line);background:var(--bg2);color:var(--dim);font-size:.96rem}
.ic-foot p{margin:6px 0;max-width:none}
.ic-foot b{font-family:var(--display);color:var(--fg);font-size:1.1rem}
@media (max-width:600px){
  .ic-hero{padding-top:26px;padding-bottom:26px}
  .ic-hero h1{font-size:clamp(2.6rem,13vw,4rem);margin:6px 0 10px}
  .ic-hero .lede{font-size:1.05rem;line-height:1.5}
  .ic-cta{gap:10px;margin:16px 0 8px}
  .ic-cta .btn{flex:1 1 100%;padding:14px 20px;font-size:.88rem}
  .ic-try .btn{flex:1 1 100%}
  .bhead{padding-top:26px}
}


/* A site-owned support link stays readable without a third-party script. */
.ic-kofi .kofi-button{color:var(--on-blood);background:var(--blood);border:1px solid var(--blood-hi);box-shadow:none;letter-spacing:normal;text-transform:none;padding:8px 12px;min-height:44px}
.ic-kofi .kofi-button:hover,.ic-kofi .kofi-button:focus-visible{color:var(--on-blood);background:var(--blood);border-color:var(--on-blood)}

/* Move the Sacrament mark from the duplicate top bar into the home hero. */
.ic-hero-title{display:flex;align-items:center;gap:clamp(14px,3vw,38px);max-width:100%}
.ic-hero-title h1{min-width:0;margin:0}
.ic-hero-symbol{display:block;flex:0 0 auto;width:clamp(55px,9vw,108px);height:auto;max-height:120px;object-fit:contain}
@media(max-width:520px){.ic-hero-title{gap:12px}.ic-hero-symbol{width:clamp(42px,13vw,70px)}}

/* Square illustrations on the homepage. */
.ic-illustrated-card{overflow:hidden}
.ic-card-art{display:block;margin:-1px -1px 16px;overflow:hidden;border-bottom:1px solid var(--line)}
.ic-card-art img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;object-position:center;background:#111713}
.ic-latest{grid-column:1/-1;border-top:1px solid var(--line);padding-top:24px}
.ic-latest h2{font-size:1.5rem;margin-bottom:16px}
.ic-latest article{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:clamp(18px,3vw,32px);align-items:start}
.ic-latest article>div{min-width:0}
.ic-latest-image{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border:1px solid var(--line)}
@media(max-width:600px){.ic-latest article{grid-template-columns:minmax(0,1fr)}}
.ic-latest time{font-size:.92rem;color:var(--dim)}
.ic-latest h3{font-size:clamp(1.6rem,3vw,2rem);margin:8px 0 12px}
.ic-latest h3 a{color:var(--fg);text-decoration:none}
.ic-latest h3 a:hover{color:var(--blood-hi)}
.ic-latest p{margin:0 0 16px}

/* October layout pass: consistent rhythm, comfortable reading and responsive navigation. */
.ic-hero{padding-bottom:clamp(32px,5vw,56px)}
.ic-hero .lede{max-width:62ch;line-height:1.55}
.ic-hero .ic-cta{margin-top:clamp(20px,3vw,32px)}
.ic-hero .ic-cta .btn{min-width:0;line-height:1.4}
.ic-try{margin-top:20px}
.ic-cards{gap:clamp(16px,2.5vw,28px)}
.ic-illustrated-card{display:flex;flex-direction:column;padding:clamp(16px,2vw,24px)}
.ic-illustrated-card .ic-card-art{margin:calc(-1 * clamp(16px,2vw,24px)) calc(-1 * clamp(16px,2vw,24px)) 18px}
.ic-cards .card h2{font-size:clamp(1.5rem,2.3vw,1.85rem);line-height:1.14;margin:0 0 12px}
.ic-cards .card p{line-height:1.6;margin-bottom:0}
.ic-body .body{overflow-wrap:break-word}
.ic-body .body blockquote{line-height:1.5}
.ic-foot{margin-top:clamp(28px,5vw,48px)}
@media(max-width:600px){
  .ic-hero .ic-cta{gap:10px}
  .ic-cards{gap:18px}
  .ic-illustrated-card{padding:18px}
  .ic-illustrated-card .ic-card-art{margin:-18px -18px 18px}
  .ic-body{padding-bottom:40px}
  .ic-body .body blockquote{font-size:1.08rem;padding-left:16px}
  .ic-foot{padding-block:28px 34px}
}

.feedback-form{max-width:100%;gap:10px}
.feedback-form label{font-weight:600}
.feedback-form textarea{resize:vertical;min-height:150px}
.feedback-form :is(input,select,textarea){min-width:0}
.feedback-form .small{max-width:none}
.loot-jumps{line-height:2;margin-bottom:24px}
.loot-rolls{width:100%;border-collapse:collapse;margin-bottom:32px}
.loot-rolls th,.loot-rolls td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}
.loot-rolls th{white-space:nowrap}
.loot-entry{border-top:1px solid var(--line);padding:18px 0;scroll-margin-top:20px}
.loot-entry h3{margin-top:0}
.loot-spells{padding-left:1.3em}
.loot-spells h4{font-size:1.1rem;margin:18px 0 6px}
.loot-effect{display:inline-block;font:600 .85rem var(--body);color:var(--verdigris);border:1px solid var(--edge);padding:3px 6px;margin-left:6px}

.loot-roller{border:1px solid var(--edge);padding:clamp(16px,3vw,24px);margin-bottom:28px;background:var(--bg2)}
.loot-roller[hidden]{display:none}
.loot-roller h2{margin-top:0}
#loot-result:not(:empty){border-top:1px solid var(--line);margin-top:20px;padding-top:16px}
.loot-result-item h3{margin-top:0}
.loot-search{border:1px solid var(--edge);padding:clamp(16px,3vw,24px);margin-bottom:28px;background:var(--bg2)}
.loot-search h2{margin-top:0}
.loot-search[hidden]{display:none}
.loot-search label{display:block;font-weight:600;margin-bottom:6px}
.loot-search input{width:100%;max-width:520px;box-sizing:border-box;font:inherit;padding:12px 14px;background:var(--bg);color:var(--fg);border:1px solid var(--edge)}
.loot-search input:focus-visible{outline:2px solid var(--candle);outline-offset:3px}
.loot-search p{margin:0 0 14px}
#loot-search-count{margin:8px 0 0;min-height:1.5em}

.guide-contents{border:1px solid var(--edge);padding:16px 20px;margin-bottom:28px}
.guide-contents h2{margin-top:0}
.guide-contents ul{columns:2;column-gap:32px}
.guide-contents li{break-inside:avoid;margin-bottom:8px}
.ic-body h2[id]{scroll-margin-top:90px}
@media(max-width:650px){.guide-contents ul{columns:1}}

/* Shared site navigation. Tool pages keep their compact in-game header. */
.ic-nav{background:var(--bg2);border-bottom:1px solid var(--line)}
.ic-nav-inner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;max-width:1280px;margin:auto;padding:8px max(16px,env(safe-area-inset-left,0px))}
.ic-nav ul{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;list-style:none;padding:0;margin:0;min-width:0}
.ic-nav a{display:inline-flex;align-items:center;min-height:44px;padding:9px 10px;color:var(--dim);font:600 .76rem/1.35 var(--label);letter-spacing:.07em;text-transform:uppercase;text-decoration:none;border-bottom:2px solid transparent}
.ic-nav a:hover{color:var(--fg)}
.ic-nav ul a[aria-current=page]{color:var(--candle);border-bottom-color:var(--candle)}
.ic-nav .ic-brand{gap:8px;font:700 1.05rem/1.2 var(--display);letter-spacing:0;text-transform:none;color:var(--fg);padding:0;white-space:nowrap}
.ic-brand img{flex:none}
.ic-kofi{display:flex;justify-content:flex-end;white-space:nowrap}
.site-skip{position:fixed;left:16px;top:8px;z-index:10000;transform:translateY(-180%);padding:12px 18px;background:var(--bg2);color:var(--fg);border:2px solid var(--candle)}
.site-skip:focus{transform:none}
.site-footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:32px;padding-bottom:24px}
.site-footer-grid nav{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.site-footer-grid nav a{padding-block:3px;line-height:1.5}
.site-footer-grid p{max-width:30ch}
.site-legal{padding-top:18px;border-top:1px solid var(--line)}
.site-start,.site-next{grid-column:1/-1;padding:24px;border:1px solid var(--line);background:var(--bg2)}
.site-next{margin-top:28px}
.site-start h2,.site-next h2{margin-top:0;margin-bottom:20px}
.site-paths{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
@media(max-width:1050px){.site-paths{grid-template-columns:repeat(2,minmax(0,1fr))}}
.site-paths h3{font-size:1.3rem;margin:0 0 8px}
.site-paths p{margin:0 0 12px;color:var(--dim)}
.site-resources{max-width:1080px}
.resource-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:22px;margin:24px 0}
.resource-grid .card{min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.resource-grid .card h2,.resource-grid .card h3{font-size:1.6rem;margin:10px 0 12px}
.resource-grid .card .btn{margin-top:auto}
.body .resource-image{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;margin:0;border:1px solid var(--line)}
.resource-art,.resource-history{border-top:1px solid var(--line);padding-top:12px;margin-top:32px}
.role-paths{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 24px}
.role-paths a{display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;border:1px solid var(--edge);background:var(--bg2)}
@media(max-width:1050px){.ic-nav-inner{grid-template-columns:1fr auto}.ic-nav ul{grid-column:1/-1;grid-row:2;justify-content:flex-start}.ic-kofi{grid-column:2;grid-row:1}}
@media(max-width:650px){.site-footer-grid,.site-paths{grid-template-columns:minmax(0,1fr)}.site-start,.site-next{padding:18px}.ic-nav-inner{gap:6px}.ic-nav ul{gap:2px}.ic-nav a{font-size:.72rem;padding:9px 8px}.ic-nav .ic-brand{font-size:1rem}.ic-kofi .kofi-button{font-size:.72rem;padding:8px}.ic-brand img{width:24px;height:24px}}

.ic-kofi .kofi-button{gap:8px}.kofi-cup{display:block;flex:none;filter:invert(1)}

/* A roomy fallback until the supplied Ko-fi floating widget is ready. */
.ic-kofi{align-items:center;padding-block:8px;box-sizing:border-box}
.ic-kofi[hidden]{display:none}
.ic-kofi .kofi-button,.ic-kofi .kofi-button:hover,.ic-kofi .kofi-button:focus-visible{background:#323842;color:#fff;border-color:#95a0af;min-height:44px;padding:10px 14px;line-height:1.3;box-sizing:border-box}
.floatingchat-container-wrap,.floatingchat-container-wrap-mobi{z-index:500!important}
.sac-back-top{bottom:90px}

.support-floating-fallback{position:fixed;left:16px;bottom:16px;z-index:500;max-width:calc(100vw - 32px);padding:0}

.ic-foot{padding-bottom:100px}
/* Play in person: download cards and the bookkeeping table */
.resource-grid .card .dl-links{margin:0 0 8px}
.resource-grid .card .dl-links:last-child{margin-top:auto;margin-bottom:0}
.resource-grid .card .dl-links .small{color:var(--dim);font-size:.9rem}
.table-scroll{overflow-x:auto;margin:20px 0 28px}
.jobs{width:100%;border-collapse:collapse}
.jobs th,.jobs td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--line)}
.jobs th{color:var(--candle);font:600 .8rem/1.35 var(--label);letter-spacing:.07em;text-transform:uppercase}