:root{
	--bg: #1b0f1b;
	--bg-2: #2f1730;
	--fg: #fff0fb;
	--muted-fg: #dfbdd6;
	--line: hsl(323 70% 86% / 0.24);
	--glass: hsl(325 74% 85% / 0.12);
	--glass-strong: hsl(328 84% 92% / 0.18);
	--glass-hover: hsl(327 95% 90% / 0.25);
	--ring: #ff9ee2;
	--accent: #ff8fcb;
	--accent-ink: #2e0621;
	--danger: #ff9b9b;
	--shadow: 0 20px 45px hsl(315 49% 5% / 0.55);
}

*{box-sizing:border-box}
html,body{min-height:100%}
body{
	margin:0;
	color:var(--fg);
	font-family:"Space Grotesk","Segoe UI",sans-serif;
	line-height:1.5;
	background:
		radial-gradient(circle at 12% 18%, hsl(327 92% 64% / .28), transparent 40%),
		radial-gradient(circle at 80% 3%, hsl(307 88% 70% / .22), transparent 35%),
		radial-gradient(circle at 88% 80%, hsl(343 98% 68% / .2), transparent 40%),
		linear-gradient(130deg, var(--bg) 0%, #140a14 45%, var(--bg-2) 100%);
	background-attachment: fixed;
}

.bg-grid{position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(hsl(324 84% 90% / .06) 1px, transparent 1px),linear-gradient(90deg,hsl(324 84% 90% / .06) 1px, transparent 1px);background-size:34px 34px;mask-image:radial-gradient(circle at center, black 35%, transparent 85%)}
.bg-orb{position:fixed;pointer-events:none;z-index:-1;filter:blur(14px)}
.orb-a{width:260px;height:260px;border-radius:999px;background:hsl(334 96% 68% / .26);top:6%;left:5%}
.orb-b{width:320px;height:320px;border-radius:999px;background:hsl(312 90% 72% / .22);right:6%;bottom:5%}

a{color:var(--fg)}
h1,h2,h3{font-family:"Manrope","Space Grotesk",sans-serif;letter-spacing:.01em}
h1{font-size:clamp(1.65rem,2vw,2.2rem);margin:0 0 10px 0}
h2{font-size:1.08rem;margin:0 0 10px 0}
h3{font-size:.96rem}

.container{max-width:1240px;margin:0 auto;padding:24px}
.page-shell{padding-top:24px;padding-bottom:34px}

.glass-shell,.card,.pane,.sidebar,.modal-card,table,details,.discord-msg,.discord-embed{
	background:linear-gradient(155deg, var(--glass-strong) 0%, var(--glass) 95%);
	backdrop-filter:blur(16px);
	-webkit-backdrop-filter:blur(16px);
	border:1px solid var(--line);
	box-shadow:var(--shadow);
	border-radius:16px;
}

.layout{display:flex;min-height:100vh;gap:16px;padding:16px}
.sidebar{flex:0 0 278px;width:278px;position:sticky;top:16px;height:calc(100vh - 32px);overflow:auto;border-radius:20px}
.sidebar-inner{padding:18px 14px 14px}
.brand-wrap{padding:10px 12px 14px;border-bottom:1px solid var(--line);margin-bottom:10px}
.brand{font-family:"Manrope",sans-serif;font-weight:800;font-size:1.12rem;letter-spacing:.02em;text-decoration:none}
.brand-subtitle{font-size:.82rem;color:var(--muted-fg);margin-top:2px}
.content{flex:1;min-width:0}

.sidebar .nav{display:flex;flex-direction:column;align-items:stretch;gap:6px}
.sidebar .nav a,.sidebar .nav button{display:block;padding:10px 12px;border-radius:12px;text-decoration:none;font-size:.92rem;border:1px solid transparent;color:var(--muted-fg);background:transparent;transition:all .18s ease}
.sidebar .nav a:hover,.sidebar .nav button:hover{background:var(--glass-hover);color:var(--fg);border-color:var(--line);transform:translateY(-1px)}
.sidebar .nav button{width:100%;text-align:left;cursor:pointer}
.sidebar .nav .hint{display:block;padding:8px 10px;font-size:.82rem;color:var(--muted-fg)}

textarea,input,select{width:100%;background:hsl(324 71% 95% / .1);color:var(--fg);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font:inherit;outline:none;transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease}
textarea{min-height:520px;font-family:ui-monospace,Consolas,monospace}
textarea.small{min-height:160px}
textarea:focus,input:focus,select:focus{border-color:var(--ring);box-shadow:0 0 0 3px hsl(319 96% 76% / .24);background:hsl(324 71% 95% / .16)}
input[type=checkbox]{width:auto;padding:0;border-radius:4px;accent-color:#ff9ee2}
label{display:block;font-size:.86rem;color:var(--fg)}
label input,label textarea,label select{margin-top:6px}

button,.btn-primary,.btn-secondary,.secondary{
	appearance:none;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:6px;
	padding:10px 14px;
	border-radius:12px;
	font-weight:700;
	font-size:.9rem;
	cursor:pointer;
	text-decoration:none;
	transition:transform .16s ease,background-color .16s ease,border-color .16s ease;
}
button,.btn-primary{background:linear-gradient(140deg,var(--accent),#ffacd8);border:1px solid hsl(328 96% 82% / .7);color:var(--accent-ink)}
button:hover,.btn-primary:hover{transform:translateY(-1px)}
.btn-secondary,.secondary{background:hsl(324 65% 91% / .1);border:1px solid var(--line);color:var(--fg)}
.btn-secondary:hover,.secondary:hover{background:var(--glass-hover)}

.btn-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.btn-x{background:transparent;border:0;color:var(--muted-fg);font-size:22px;line-height:1;padding:4px 8px}
.btn-x:hover{color:var(--fg);background:transparent}

.notice{padding:10px 12px;border-radius:10px;margin:12px 0;font-size:.88rem}
.notice.ok{background:hsl(145 66% 25% / .28);border:1px solid hsl(144 72% 58% / .35);color:#d8ffe8}
.notice.err{background:hsl(8 74% 30% / .35);border:1px solid hsl(9 84% 60% / .4);color:#ffe0db}
.hint{color:var(--muted-fg);font-size:.84rem}
.row{margin-top:10px}
.divider,hr{border:0;border-top:1px solid var(--line);margin:12px 0}

details{padding:8px 10px}
details > summary{cursor:pointer;user-select:none}
details[open] > summary{margin-bottom:8px}
code{font-family:ui-monospace,Consolas,monospace;background:hsl(324 65% 91% / .13);border:1px solid var(--line);padding:1px 5px;border-radius:6px;font-size:.82em}
ul{margin:8px 0 8px 22px;padding:0}

table{width:100%;border-collapse:separate;border-spacing:0;margin:12px 0;overflow:hidden}
th,td{border-bottom:1px solid var(--line);padding:10px 10px;text-align:left;vertical-align:top;font-size:.9rem}
tbody tr:last-child td{border-bottom:0}
th{background:hsl(324 86% 90% / .12);color:var(--muted-fg);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700}

.pill{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:hsl(324 70% 90% / .15);border:1px solid var(--line);color:var(--muted-fg);font-size:.72rem}
.card,.pane{padding:14px;margin:12px 0}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.span2{grid-column:1 / -1}

.modal{position:fixed;inset:0;display:none;z-index:50}
.modal.open{display:block}
.modal-backdrop{position:absolute;inset:0;background:hsl(210 80% 5% / .55);backdrop-filter:blur(3px)}
.modal-card{position:relative;z-index:51;max-width:760px;margin:7vh auto;padding:14px}
.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.modal-head h2{margin:0;font-size:1rem}

.split{display:grid;grid-template-columns:260px minmax(0,1fr);gap:12px;align-items:start}
.split > .pane:nth-child(3){grid-column:2}

.color-combo{display:flex;align-items:center;gap:10px;background:hsl(324 70% 94% / .1);border:1px solid var(--line);border-radius:12px;padding:8px 10px;height:42px;box-sizing:border-box}
.color-combo input{margin-top:0!important;border:0;background:transparent;padding:0;height:auto;box-shadow:none}
.color-combo input#e-color-hex{flex:1;font-family:ui-monospace,Consolas,monospace;letter-spacing:.02em;text-transform:uppercase;outline:0}
.color-combo input[type=color]{width:34px;min-width:34px;height:26px;cursor:pointer}
.color-combo input[type=color]{-webkit-appearance:none;appearance:none}
.color-combo input[type=color]::-webkit-color-swatch-wrapper{padding:0}
.color-combo input[type=color]::-webkit-color-swatch{border:1px solid var(--line);border-radius:6px}
.color-combo input[type=color]::-moz-color-swatch{border:1px solid var(--line);border-radius:6px}

#tpl-list .tpl-item-row{display:flex;gap:8px;align-items:stretch;margin:6px 0}
#tpl-list .tpl-item-open{flex:1;text-align:left}
#tpl-list .tpl-item-delete{flex:0 0 40px;width:40px;min-width:40px;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:16px;line-height:1}
#tpl-list .tpl-item-delete:hover{background:var(--danger);border-color:var(--danger);color:#2c0b07}

.discord-msg{padding:12px}
.discord-header{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
.discord-avatar{width:38px;height:38px;border-radius:999px;background:hsl(324 84% 90% / .12);border:1px solid var(--line);background-size:cover;background-position:center}
.discord-username{font-weight:700;color:var(--fg);font-size:14px;line-height:1.1}
.discord-timestamp{color:var(--muted-fg);font-size:12px;margin-top:2px}
.discord-content{white-space:pre-wrap;color:var(--fg);font-size:14px;line-height:1.35;margin-bottom:10px;min-height:18px}
.discord-embed{display:flex;gap:10px;padding:10px}
.discord-embed-bar{width:4px;border-radius:8px;background:#ff79cf}
.discord-embed-body{flex:1;min-width:0}
.discord-author,.discord-footer{font-size:12px;color:var(--muted-fg)}
.discord-title{display:inline-block;font-weight:700;color:var(--fg);text-decoration:none;margin-bottom:6px;min-height:18px}
.discord-title:hover{text-decoration:underline}
.discord-desc{white-space:pre-wrap;color:var(--fg);font-size:13px;line-height:1.35;margin-bottom:8px;min-height:18px}
.discord-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:8px}
.discord-field{background:hsl(324 65% 91% / .1);border:1px solid var(--line);border-radius:8px;padding:8px}
.discord-field-name{font-size:12px;color:var(--fg);font-weight:700;margin-bottom:4px}
.discord-field-value{white-space:pre-wrap;font-size:12px;color:var(--fg);line-height:1.3}
.discord-field.inline{grid-column:auto}
.discord-field.block{grid-column:1 / -1}
.discord-media{display:flex;gap:10px;align-items:flex-start;margin-bottom:8px}
.discord-thumb{width:76px;height:76px;object-fit:cover;border-radius:8px;border:1px solid var(--line);display:none}
.discord-image{max-width:100%;border-radius:8px;border:1px solid var(--line);display:none}
.discord-footer{display:flex;gap:8px;align-items:center}
.discord-footer img{width:18px;height:18px;border-radius:999px;object-fit:cover;border:1px solid var(--line)}
.discord-editable{outline:0;border-radius:6px;padding:2px 4px;margin-left:-4px}
.discord-editable:hover{background:hsl(324 65% 91% / .11)}
.discord-editable:focus{background:hsl(324 65% 91% / .18);box-shadow:0 0 0 2px hsl(318 96% 74% / .32)}
.discord-editable[contenteditable="true"]{cursor:text}
.discord-editable:empty:before{content:attr(data-placeholder);color:var(--muted-fg)}

.public-body{padding:16px 16px 30px}
.public-topbar{max-width:1240px;margin:0 auto}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:18px}
.brand-link{text-decoration:none}
.brand-pill{display:inline-flex;padding:8px 12px;border-radius:999px;background:hsl(324 65% 91% / .18);border:1px solid var(--line);font-family:"Manrope",sans-serif;font-weight:800}
.top-nav{display:flex;gap:8px;flex-wrap:wrap}
.top-nav a{padding:8px 11px;border-radius:10px;text-decoration:none;color:var(--muted-fg);border:1px solid transparent;transition:all .18s ease}
.top-nav a:hover{color:var(--fg);background:var(--glass-hover);border-color:var(--line)}
.topbar-user{display:flex;align-items:center;gap:8px}
.public-main{max-width:1240px;margin:18px auto 0;padding:0 2px 24px}

.hero{padding:26px 24px 28px;animation:floatIn .55s ease both}
.hero-kicker{margin:0 0 10px 0;text-transform:uppercase;letter-spacing:.12em;font-weight:700;font-size:.72rem;color:var(--muted-fg)}
.hero-text{max-width:700px;color:var(--muted-fg)}
.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}

.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}
.feature-card{padding:14px;animation:rise .45s ease both}
.feature-card:nth-child(2){animation-delay:.08s}
.feature-card:nth-child(3){animation-delay:.16s}

.top3-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:12px 0}
.podium-card{padding:14px}
.podium-rank{font-family:"Manrope",sans-serif;font-size:1.2rem;font-weight:800;margin-bottom:6px}
.rank-1{border-color:hsl(50 95% 72% / .45)}
.rank-2{border-color:hsl(204 25% 86% / .38)}
.rank-3{border-color:hsl(30 88% 68% / .42)}
.table-shell{padding:8px 12px 10px}

@keyframes floatIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

@media (max-width:1100px){
	.split{grid-template-columns:1fr}
	.pane{margin-bottom:12px}
	.feature-grid,.top3-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:920px){
	.layout{flex-direction:column;padding:12px}
	.sidebar{width:100%;height:auto;position:relative;top:0}
	.sidebar .nav{flex-direction:row;flex-wrap:wrap}
	.sidebar .nav a,.sidebar .nav button{width:auto}
	.btn-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.topbar-inner{flex-wrap:wrap}
}

@media (max-width:680px){
	.container{padding:14px}
	.grid{grid-template-columns:1fr}
	.feature-grid,.top3-grid{grid-template-columns:1fr}
	.btn-grid{grid-template-columns:1fr}
	.table-shell{padding:4px}
	h1{font-size:1.5rem}
}