@import url('https://fonts.googleapis.com/css?family=Cinzel:600,700|Libre+Baskerville:400,400i,700');

.ravenous-sheet { --ink:#302c26; --muted:#716957; --gold:#9b8050; --dark-gold:#70582f; --paper:#f4ebd8; --light:#fbf9f3; --accent:#ede1c8; --border:#c9bda4; --blood:#7a2424; box-sizing:border-box; max-width:980px; min-width:650px; margin:auto; padding:18px; color:var(--ink); background-color:var(--paper); background-image:radial-gradient(circle at 15% 10%,rgba(155,128,80,.09),transparent 35%),linear-gradient(90deg,rgba(122,36,36,.025) 1px,transparent 1px); background-size:auto,28px 28px; font:13px/1.4 "Libre Baskerville",Georgia,serif; border:1px solid var(--border); }
.ravenous-sheet * { box-sizing:border-box; }
.ravenous-sheet input,.ravenous-sheet select,.ravenous-sheet textarea { width:100%; border:0; border-bottom:1px solid var(--border); border-radius:0; background:rgba(251,249,243,.72); color:var(--ink); font:inherit; padding:4px 6px; box-shadow:none; }
.ravenous-sheet input:focus,.ravenous-sheet select:focus,.ravenous-sheet textarea:focus { outline:2px solid rgba(155,128,80,.35); border-color:var(--dark-gold); }
.ravenous-sheet input[type=number] { text-align:center; appearance:textfield; -moz-appearance:textfield; }
.ravenous-sheet input[type=number]::-webkit-inner-spin-button,.ravenous-sheet input[type=number]::-webkit-outer-spin-button { margin:0; appearance:none; -webkit-appearance:none; }
.ravenous-sheet input[type=checkbox] { width:auto; }
.ravenous-sheet button { font-family:"Cinzel",Georgia,serif; }
.hero { display:grid; grid-template-columns:70px 1fr 190px; gap:16px; align-items:center; padding:12px 14px; border:1px solid var(--gold); border-left:5px solid var(--blood); background:rgba(251,249,243,.7); }
.sigil { display:grid; place-items:center; width:62px; height:62px; color:var(--paper); background:var(--blood); font:700 34px "Cinzel",serif; transform:rotate(45deg); box-shadow:inset 0 0 0 4px var(--blood),inset 0 0 0 5px var(--gold); }
.sigil::first-letter { transform:rotate(-45deg); }
.identity>label { color:var(--blood); font:700 12px "Cinzel",serif; letter-spacing:.06em; }
.identity>label input { font-size:22px; }
.identity-grid { display:grid; grid-template-columns:2fr 2fr 1fr; gap:8px; margin-top:6px; }
.identity-grid label,.ravenous-sheet label { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.05em; }
.motto { color:var(--dark-gold); font-style:italic; text-align:center; }
.motto>span { display:block; }
.secret-rolls { display:flex; justify-content:center; align-items:center; gap:6px; margin-top:7px; color:var(--blood)!important; font-style:normal; }
.secret-rolls input { margin:0; }
.tabs { display:flex; margin:14px 0; border-bottom:2px solid var(--gold); }
.tabs button { flex:1; padding:8px 5px; border:0; color:var(--muted); background:transparent; font-size:11px; }
.tabs button:hover { color:var(--blood); background:var(--accent); }
.page { display:none; }
.tab-state[value="core"]~.page-core,.tab-state[value="skills"]~.page-skills,.tab-state[value="combat"]~.page-combat,.tab-state[value="health"]~.page-health,.tab-state[value="consumables"]~.page-consumables,.tab-state[value="classes"]~.page-classes { display:block; }
.section-title { display:flex; align-items:center; gap:8px; margin:12px 0 8px; color:var(--blood); border-bottom:1px solid var(--gold); }
.section-title span { color:var(--gold); }
.section-title h2,.section-title h3 { margin:0; color:inherit; font:700 18px/1.8 "Cinzel",Georgia,serif; }
.section-title.small h3 { font-size:15px; }
.stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; }
.stat { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:end; padding-top:5px; border:1px solid var(--border); background:rgba(251,249,243,.62); }
.stat strong { grid-column:1/-1; padding:0 7px 3px; color:var(--blood); font:700 11px "Cinzel",Georgia,serif; text-transform:uppercase; letter-spacing:.04em; }
.stat span { padding:0 4px 3px; color:var(--muted); font-size:8px; text-align:center; text-transform:uppercase; letter-spacing:.05em; }
.stat input { height:32px; margin:0; padding:4px; font-size:18px; line-height:24px; }
.stat input:nth-of-type(2) { background:var(--accent); }
.stat output { display:grid; place-items:center; height:32px; margin:0; color:var(--light); background:var(--blood); font:bold 18px/32px "Cinzel",serif; }
.legend { text-align:right; color:var(--muted); font-size:10px; }
.dashboard { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:14px; }
.resource { display:grid; grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr) minmax(0,.8fr); grid-template-rows:47px; gap:4px; align-items:end; min-width:0; padding:5px 8px; background:var(--accent); border-left:3px solid var(--gold); }
.resource label { display:grid; grid-template-rows:14px 28px; align-self:end; min-width:0; }
.resource input,.resource output { display:block; height:28px; min-height:28px; margin:0; padding:3px 4px; font-size:17px; line-height:22px; text-align:center; }
.resource>.resource-separator { display:grid; place-items:center; height:28px; margin:0; color:var(--dark-gold); font:700 9px/28px "Cinzel",Georgia,serif; text-transform:uppercase; }
.resource-blood label:last-child { grid-column:3/-1; }
.derived-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:1px; margin:12px 0; background:var(--border); border:1px solid var(--border); }
.derived-grid label { padding:7px; background:var(--light); text-align:center; }
.derived-grid label>input[readonly] { display:block; color:var(--blood); background:transparent; font:700 18px "Cinzel",serif; }
.derived-grid label>small { display:inline-block; color:var(--muted); font-size:8px; }
.derived-grid label>input[type=number]:not([readonly]) { display:inline-block; width:42px; }
.notes { display:block; }
.location-head,.location-row { display:grid; grid-template-columns:minmax(130px,1.5fr) repeat(5,minmax(70px,1fr)); gap:6px; align-items:center; }
.location-head { padding:5px 9px; color:var(--muted); font-size:9px; text-align:center; text-transform:uppercase; }
.location-grid { border:1px solid var(--border); }
.location-row { padding:7px 9px; background:rgba(251,249,243,.72); }
.location-row:nth-child(even) { background:rgba(237,225,200,.52); }
.location-row strong { color:var(--blood); font-family:"Cinzel",Georgia,serif; }
.location-row input[readonly] { color:var(--blood); background:var(--accent); font-weight:bold; }
.custom-location { margin:5px 0; border:1px solid var(--border); }
.resistance-title { margin:10px 0 4px; color:var(--dark-gold); font:700 12px "Cinzel",Georgia,serif; }
.resistance-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; }
.resistance-grid label { display:grid; grid-template-columns:1fr 48px; align-items:center; padding:5px 7px; background:var(--light); border-left:3px solid var(--gold); }
.skill-toolbar,.class-picker,.skill-picker { display:flex; justify-content:space-between; align-items:end; gap:15px; padding:8px; background:var(--accent); }
.skill-toolbar label { width:220px; }
.skill-picker { margin-top:8px; background:var(--light); border:1px solid var(--border); }
.skill-picker label { flex:1; }
.skill-picker button { padding:7px 12px; color:white; border:0; background:var(--blood); }
.skill-message { min-width:160px; color:var(--dark-gold); font-style:italic; }
.skill-head,.skill-row { display:grid; grid-template-columns:28px minmax(150px,1fr) 140px 55px 55px 55px; gap:5px; align-items:center; padding:4px 6px; }
.skill-row select,.skill-row input,.custom-skill-row select,.custom-skill-row input { height:28px; margin:0; vertical-align:middle; }
.skill-row output,.custom-skill-row output { display:grid; place-items:center; min-height:28px; }
.skill-head { color:var(--muted); font-size:9px; text-transform:uppercase; }
.skill-category { margin-top:9px; padding:6px 9px; color:var(--blood); border-bottom:1px solid var(--gold); background:var(--accent); font:700 12px "Cinzel",Georgia,serif; }
.skill-category span { margin-right:7px; color:var(--gold); }
.skill-row:nth-of-type(even) { background:rgba(237,225,200,.52); }
.skill-roll,.attack-roll,.combat-card button[type=roll] { display:grid; place-items:center; width:24px; min-width:24px; height:24px; margin:0; padding:0; border:1px solid var(--dark-gold); border-radius:50%; background:var(--blood); color:white; font-size:0; line-height:1; box-shadow:none; appearance:none; }
.skill-roll::before,.attack-roll::before,.combat-card button[type=roll]::before { content:"◆"; color:white; font-size:9px; line-height:1; }
.skill-roll:hover,.skill-roll:focus { border-color:var(--blood); background:var(--dark-gold); outline:2px solid rgba(155,128,80,.3); }
.skill-name { font-weight:bold; }
.skill-row output,.custom-skill-row output { text-align:center; color:var(--blood); font-weight:bold; }
.custom-skill-row { display:grid; grid-template-columns:28px minmax(150px,1fr) 140px 55px 55px 55px; gap:5px; align-items:center; margin:5px 0; }
.combat-card,.consumable-card,.technique-card { display:flex; flex-wrap:wrap; gap:7px; align-items:end; margin:8px 0; padding:9px; border:1px solid var(--border); border-left:4px solid var(--blood); background:rgba(251,249,243,.74); }
.combat-card>.grow,.consumable-card>.grow { flex:1 1 190px; }
.combat-card label { width:75px; }
.combat-card .attack-followup { display:none; }
.combat-card textarea,.consumable-card textarea { flex-basis:100%; }
.attack-thresholds { display:flex; flex-basis:100%; gap:7px; align-items:end; padding:6px 8px; background:var(--accent); border-left:3px solid var(--gold); }
.attack-thresholds>span { flex:1; color:var(--muted); font-size:9px; text-transform:uppercase; }
.attack-thresholds label { width:75px; }
.protection-card .active { width:62px; }
.damage-resistance-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.damage-resistance-grid label { display:flex; align-items:center; gap:6px; padding:7px; background:var(--light); border-left:3px solid var(--gold); }
.damage-summary { display:flex; gap:8px; align-items:center; margin-top:8px; padding:8px; background:var(--accent); }
.damage-summary span { flex:1; color:var(--muted); font-size:10px; text-transform:uppercase; }
.damage-summary output { margin-left:6px; color:var(--blood); font:bold 16px "Cinzel",Georgia,serif; }
.damage-summary button { padding:6px 10px; color:white; border:0; background:var(--blood); }
.callout { padding:9px 12px; color:var(--muted); background:var(--accent); border-left:3px solid var(--gold); font-style:italic; }
.consumable-card label:not(.active) { width:105px; }
.active { display:flex; align-items:center; gap:5px; padding:5px; }
.use-effect { width:30px; height:30px; flex:0 0 30px; color:white; border:1px solid var(--dark-gold); border-radius:50%; background:var(--blood); }
.modifier-card { display:flex; flex-wrap:wrap; gap:7px; align-items:end; margin:8px 0; padding:9px; border:1px solid var(--border); border-left:4px solid var(--gold); background:rgba(251,249,243,.74); }
.modifier-card>.grow { flex:1; }
.class-picker label { min-width:240px; flex:1; }
.class-picker button { padding:8px 12px; color:white; border:0; background:var(--blood); }
.technique-message { min-width:150px; color:var(--dark-gold); font-style:italic; }
.technique-card { display:block; }
.tech-title,.tech-meta { display:flex; gap:7px; align-items:end; }
.activate-technique { width:30px; height:30px; flex:0 0 30px; color:white; border:1px solid var(--dark-gold); border-radius:50%; background:var(--blood); }
.tech-title>input { flex:1; color:var(--blood); font-weight:bold; }
.tech-title label { width:75px; }
.tech-meta { margin:5px 0; }
.tech-meta>input { flex:1; }
.tech-meta label { width:55px; }
.repcontrol { margin:6px 0 14px; }
.repcontrol_add,.repcontrol_edit { color:var(--dark-gold); border:1px solid var(--gold); background:var(--light); }

.sheet-rolltemplate-ravenous .sheet-template { overflow:hidden; color:#302c26; border:1px solid #9b8050; border-left:5px solid #7a2424; background:#f4ebd8; font:12px/1.4 Georgia,serif; }
.sheet-rolltemplate-ravenous .sheet-template-title { padding:7px 9px; color:#fbf9f3; background:#7a2424; font:bold 15px Georgia,serif; }
.sheet-rolltemplate-ravenous .sheet-template-subtitle { padding:3px 9px; color:#716957; background:#ede1c8; font-style:italic; }
.sheet-rolltemplate-ravenous .sheet-template-result { padding:10px; text-align:center; font-size:20px; }
.sheet-rolltemplate-ravenous .sheet-template-skill-result { padding:9px; color:#7a2424; text-align:center; font:bold 16px Georgia,serif; }
.sheet-rolltemplate-ravenous .sheet-template-row,.sheet-rolltemplate-ravenous .sheet-template-notes { padding:5px 9px; border-top:1px solid #c9bda4; }
.sheet-rolltemplate-ravenous .sheet-template-actions { display:flex; gap:6px; padding:7px 9px; border-top:1px solid #c9bda4; }
.sheet-rolltemplate-ravenous .sheet-template-actions a { flex:1; padding:5px 7px; color:#fbf9f3; border:1px solid #70582f; border-radius:2px; background:#7a2424; font:bold 11px Georgia,serif; text-align:center; text-decoration:none; }
.sheet-rolltemplate-ravenous .sheet-template-calculation { padding:4px 9px 7px; color:#716957; border-top:1px solid #c9bda4; font-size:10px; font-style:italic; }
.sheet-rolltemplate-ravenous .sheet-template-row b { color:#7a2424; }
.sheet-rolltemplate-ravenous .sheet-template-notes { color:#716957; font-style:italic; }

@media (max-width:760px) { .ravenous-sheet { min-width:0; padding:9px; }.hero { grid-template-columns:60px 1fr; }.motto { display:none; }.stat-grid { grid-template-columns:repeat(2,1fr); }.dashboard { grid-template-columns:repeat(2,1fr); }.derived-grid { grid-template-columns:repeat(3,1fr); }.tabs { flex-wrap:wrap; }.tabs button { flex-basis:33%; }.skill-head { display:none; }.skill-row,.custom-skill-row { grid-template-columns:28px 1fr 70px 45px 45px 45px; }.skill-row select,.custom-skill-row select { max-width:70px; }.location-head,.location-row { grid-template-columns:minmax(105px,1.5fr) repeat(5,minmax(54px,1fr)); gap:3px; }.resistance-grid,.damage-resistance-grid { grid-template-columns:repeat(2,1fr); } }
