/* VanillaMine crash dump reader: the block style of the plugin hub (night blues, pixel headings, square blocks with
   bevels), colours and the heading's landscape following the world of the hour (html[data-world], hour-world.js). */
:root{
	--bg:#0C1020; --bg-2:#10152A; --surface:#151B31; --surface-2:#1C233D; --border:#2A3354; --border-2:#39436A;
	--text:#EEF1FA; --muted:#A3ABC6; --faint:#78809E;
	--gold:#E8AE3C; --gold-hi:#F6CD6B; --gold-lo:#9A6A12; --gold-ink:#1B1610; --link:#F2C25A;
	--em:#2FC46B; --err:#FF8A80;
	--pixel:"Pixelify Sans","IBM Plex Sans",system-ui,sans-serif; --mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
	--sky:#0B0F24; --horizon:url("horizon-night.svg");
	color-scheme:dark;
}
:root[data-world="day"]{--bg:#0D1826;--bg-2:#112033;--surface:#14253A;--surface-2:#1B2F48;--border:#2A4364;--border-2:#3A5579;--muted:#A4B6CC;--em:#5DBB3F;--sky:#4F85DA;--horizon:url("horizon-day.svg")}
:root[data-world="sunset"]{--bg:#160E1D;--bg-2:#1C1226;--surface:#22162D;--surface-2:#2B1C39;--border:#3E2A52;--border-2:#523866;--muted:#C2A9C0;--em:#FF8A3D;--sky:#1A1634;--horizon:url("horizon-sunset.svg")}
:root[data-world="nether"]{--bg:#150707;--bg-2:#1C0A09;--surface:#230D0B;--surface-2:#2E120F;--border:#4A1C17;--border-2:#62261F;--muted:#CDA59B;--em:#FF5A1F;--sky:#120303;--horizon:url("horizon-nether.svg")}
:root[data-world="end"]{--bg:#0A0811;--bg-2:#0F0C18;--surface:#15111F;--surface-2:#1C1729;--border:#2E2543;--border-2:#3E3358;--muted:#ABA2C4;--em:#B57BFF;--sky:#050309;--horizon:url("horizon-end.svg")}

*{box-sizing:border-box}
html,body{overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--link);text-underline-offset:3px}
code,pre{font-family:var(--mono);font-size:.88em;font-variant-ligatures:none;font-feature-settings:"liga" 0,"calt" 0}
code{background:var(--surface-2);padding:.1em .4em;border-radius:2px}
pre{background:var(--bg-2);padding:12px 14px;border:2px solid var(--border);border-radius:3px;overflow:auto}
pre code{background:none;padding:0}
h1,h2,h3{line-height:1.15}
h1,h2{font-family:var(--pixel);font-weight:500;letter-spacing:.01em;text-shadow:2px 2px 0 rgba(0,0,0,.5)}
.wrap{max-width:1200px;margin:0 auto;padding:0 16px}
.small{font-size:.88rem}
.muted{color:var(--muted)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ico{width:18px;height:18px;flex:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* header */
.top{position:sticky;top:0;z-index:10;background:rgba(8,11,24,.92);border-bottom:2px solid #06080F;backdrop-filter:blur(8px)}
.top-row{display:flex;align-items:center;gap:18px;min-height:60px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-weight:700;font-size:1.05rem}
.brand b{font-family:var(--pixel);font-weight:500;color:var(--gold-hi)}
.links{display:flex;gap:16px;margin-left:auto;flex-wrap:wrap}
.links a{color:var(--text);text-decoration:none;font-weight:600;font-size:.93rem}
.links a:hover{color:var(--gold-hi)}
.langs select{font:inherit;font-size:.88rem;color:var(--text);background:var(--surface-2);border:2px solid var(--border-2);border-radius:3px;padding:4px 8px}

/* the heading over the world's landscape (full width) */
.banner{position:relative;isolation:isolate;padding:72px 0 120px;margin-bottom:24px}
.banner::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);
	background:var(--sky) var(--horizon) center bottom/cover no-repeat;border-bottom:2px solid #06080F}
.banner h1{margin:0 0 10px;font-size:clamp(2rem,5vw,3rem);color:#fff;text-shadow:3px 3px 0 rgba(0,0,0,.6)}
.banner .lead{margin:0;max-width:720px;color:#F2F4FA;font-size:1.05rem;text-shadow:2px 2px 0 rgba(0,0,0,.65)}
.kicker{margin:0 0 10px;font-family:var(--pixel);text-transform:uppercase;letter-spacing:.06em;font-size:.85rem;color:var(--gold-hi);text-shadow:2px 2px 0 rgba(0,0,0,.6)}

/* blocks */
.box{background:var(--surface);border:2px solid var(--border);border-radius:4px;padding:18px;margin-bottom:16px}
.box > h3{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--gold);color:var(--gold-ink);border:2px solid #05070D;border-radius:2px;
	padding:10px 18px;font:inherit;font-weight:700;text-decoration:none;cursor:pointer;box-shadow:inset 3px 3px 0 var(--gold-hi),inset -3px -3px 0 var(--gold-lo)}
.btn:hover{filter:brightness(1.06)}
.btn:active{transform:translateY(2px);box-shadow:inset 3px 3px 0 var(--gold-lo),inset -3px -3px 0 var(--gold-hi)}
.btn.small{padding:4px 10px;font-size:.85rem}
.flash{padding:12px 16px;margin:16px 0;border:2px solid var(--border);border-left:6px solid var(--err);border-radius:3px;background:var(--surface-2)}
.tag{display:inline-flex;align-items:center;font-size:.76rem;padding:2px 8px;border-radius:2px;background:var(--surface-2);color:var(--muted);border:1px solid var(--border);white-space:nowrap}

/* the share link */
.share{display:flex;flex-wrap:wrap;align-items:center;gap:12px;border-left:6px solid var(--em)}
.share p{margin:2px 0 0}
.share-ico{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:var(--em);color:#05070D;box-shadow:inset 3px 3px 0 rgba(255,255,255,.3),inset -3px -3px 0 rgba(0,0,0,.25)}
.share-url{flex:1 1 260px;min-width:0;font:inherit;font-family:var(--mono);font-size:.88rem;color:var(--text);background:var(--bg-2);border:2px solid var(--border-2);border-radius:3px;padding:8px 10px}

/* the form */
.crash-form{display:flex;flex-direction:column;gap:10px}
.crash-label{font-weight:600}
.crash-form textarea{width:100%;font:inherit;font-family:var(--mono);font-size:.82rem;line-height:1.5;color:var(--text);border-radius:3px;border:2px solid var(--border-2);background:var(--bg-2);padding:10px 12px;resize:vertical;font-variant-ligatures:none}
.crash-form textarea:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 2px var(--gold)}
.crash-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.crash-file{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px;cursor:pointer;color:var(--muted);font-size:.93rem}
.crash-file span{white-space:nowrap}
.crash-file input{font-size:.85rem;color:var(--muted);max-width:240px}

/* the report */
.crash-verdict{margin:24px 0;padding:20px;border:2px solid #06080F;border-left:8px solid var(--em);background:var(--surface);box-shadow:0 4px 0 rgba(0,0,0,.3)}
.crash-verdict.is-plugin{border-left-color:var(--gold)}
.crash-verdict-head{display:flex;gap:14px;align-items:flex-start}
.crash-verdict-head h2{margin:0 0 4px;font-size:clamp(1.25rem,2.4vw,1.6rem)}
.crash-kicker{margin:0;font-family:var(--pixel);font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.crash-ico{flex:none;display:flex;align-items:center;justify-content:center;width:46px;height:46px;background:#C9473D;color:#fff;box-shadow:inset 3px 3px 0 rgba(255,255,255,.25),inset -3px -3px 0 rgba(0,0,0,.3)}
.crash-verdict.is-plugin .crash-ico{background:var(--gold);color:var(--gold-ink)}
.crash-ico .ico{width:24px;height:24px}
.crash-error{margin-top:16px}
.crash-type{margin:0 0 6px;font-family:var(--mono);font-size:.85rem;color:var(--err)}
.crash-message{margin:0 0 6px;white-space:pre-wrap;word-break:break-word;font-size:.9rem}
.crash-hints{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.crash-hints li{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;background:var(--surface-2);border-left:4px solid var(--gold)}
.crash-hints .ico{color:var(--gold);margin-top:3px}
.crash-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start}
.crash-code pre{margin:0;padding:10px 0}
.crash-code pre span{display:block;padding:0 12px;white-space:pre}
.crash-code pre i{display:inline-block;width:44px;color:var(--faint);font-style:normal;user-select:none}
.crash-code pre span.hot{background:rgba(201,71,61,.22);box-shadow:inset 4px 0 0 #C9473D}
.crash-trace ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.crash-trace li{display:flex;gap:10px;align-items:flex-start;padding:6px 8px;border-left:3px solid transparent}
.crash-trace li.in-plugin{background:rgba(232,174,60,.1);border-left-color:var(--gold)}
.crash-trace .n{flex:none;width:28px;font-family:var(--mono);font-size:.8rem;color:var(--faint);text-align:right}
.crash-trace .call{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.crash-trace .call code{background:none;padding:0;font-size:.8rem;word-break:break-all}
.crash-trace .call small{color:var(--muted);font-family:var(--mono);font-size:.74rem;word-break:break-all}
.crash-facts{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0;font-size:.9rem}
.crash-facts dt{color:var(--muted)}
.crash-facts dd{margin:0;min-width:0;word-break:break-word}
.crash-plugins{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;font-size:.9rem}
.crash-plugins li{padding:6px 8px;border-left:3px solid transparent}
.crash-plugins li small{display:block;color:var(--muted);font-size:.78rem}
.crash-plugins li .ver{color:var(--muted);font-family:var(--mono);font-size:.8rem}
.crash-plugins li.is-culprit{background:rgba(232,174,60,.14);border-left-color:var(--gold)}
.crash-plugins li.is-off{opacity:.6}
.api{margin-top:24px}
.api pre{margin:8px 0 0;white-space:pre-wrap;word-break:break-all}

/* footer: a strip of grass, then the small print */
.foot{margin-top:48px;padding:28px 0 32px;border-top:6px solid #3E8E2A;box-shadow:inset 0 6px 0 #5DBB3F;background:var(--bg-2);color:var(--muted);font-size:.85rem}
.foot p{margin:0}

@media (max-width:900px){.crash-grid{grid-template-columns:1fr}}
@media (max-width:640px){
	.links{margin-left:0;width:100%;gap:14px}
	.banner{padding:48px 0 110px}
	.crash-actions{flex-direction:column;align-items:stretch}
	.crash-file input{max-width:100%}
	.crash-verdict{padding:14px}
	.crash-code pre span{white-space:pre-wrap;word-break:break-all}
}
@media (prefers-reduced-motion:reduce){.btn:active{transform:none}}