*{margin:0;padding:0;box-sizing:border-box}
:root{
  --red:#c0392b;--red-dark:#8B0000;--red-light:#e74c3c;
  --gold:#d4a017;--gold-light:#f1c40f;--gold-dark:#9a7010;
  --navy:#1a2744;--navy-light:#2c3e6b;
  --green:#1a5c2a;--green-light:#27ae60;
  --black:#0d0d0d;--off-white:#f5ede0;--cream:#fdf6e3;
  --ink:#1a0a00;
}
body{font-family:'Oswald',sans-serif;background:var(--navy);color:var(--off-white);min-height:100vh;overflow-x:hidden;background-image:repeating-linear-gradient(0deg,transparent,transparent 39px,rgba(255,255,255,0.03) 39px,rgba(255,255,255,0.03) 40px),repeating-linear-gradient(90deg,transparent,transparent 39px,rgba(255,255,255,0.03) 39px,rgba(255,255,255,0.03) 40px)}

/* BANNER */
.top-banner{background:var(--red);color:var(--gold-light);text-align:center;padding:6px;font-family:'Special Elite',cursive;font-size:0.72rem;letter-spacing:0.2em;text-transform:uppercase;border-bottom:3px solid var(--gold)}

/* NAV */
nav{background:var(--black);border-bottom:4px solid var(--red);padding:0;position:relative;overflow:hidden}
nav::before{content:'';position:absolute;bottom:0;left:0;right:0;height:4px;background:repeating-linear-gradient(90deg,var(--red) 0,var(--red) 20px,var(--gold) 20px,var(--gold) 40px,var(--red) 40px)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem}
.logo{display:flex;flex-direction:column;line-height:1}
.logo-top{font-family:'Special Elite',cursive;font-size:0.65rem;letter-spacing:0.4em;color:var(--gold);text-transform:uppercase}
.logo-main{font-family:'Rye',serif;font-size:2rem;color:var(--red-light);text-shadow:2px 2px 0 var(--gold-dark),4px 4px 0 rgba(0,0,0,0.5);letter-spacing:0.05em}
.logo-sub{font-family:'Special Elite',cursive;font-size:0.6rem;letter-spacing:0.3em;color:var(--off-white);text-transform:uppercase;opacity:0.7}
.nav-actions{display:flex;gap:0.75rem;align-items:center}
.btn{font-family:'Oswald',sans-serif;font-size:0.78rem;font-weight:700;letter-spacing:0.12em;padding:0.55rem 1.4rem;cursor:pointer;transition:all 0.15s;text-transform:uppercase;border:none;clip-path:polygon(6px 0%,100% 0%,calc(100% - 6px) 100%,0% 100%)}
.btn-outline{background:transparent;border:2px solid var(--gold)!important;color:var(--gold);clip-path:none}
.btn-outline:hover{background:rgba(212,160,23,0.15)}
.btn-red{background:var(--red);color:var(--gold-light);border:2px solid var(--red-dark)!important;clip-path:none}
.btn-red:hover{background:var(--red-dark)}
.btn-gold{background:var(--gold);color:var(--ink);border:2px solid var(--gold-dark)!important;clip-path:none}
.btn-gold:hover{background:var(--gold-light)}
.btn-dark{background:#2a2a2a;color:var(--off-white);border:2px solid #444!important;clip-path:none}
.btn-danger{background:var(--red);color:#fff;border:2px solid var(--red-dark)!important;clip-path:none}
.btn-sm{padding:0.3rem 0.85rem;font-size:0.7rem}

/* DIVIDER ORNAMENT */
.ornament-divider{text-align:center;color:var(--gold);font-size:1.1rem;letter-spacing:0.5rem;margin:1.5rem 0;opacity:0.6}

/* PAGES */
.page{display:none;position:relative;z-index:1}
.page.active{display:block}

/* ── LANDING ── */
#landing{min-height:calc(100vh - 120px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:3rem clamp(1rem,3vw,3rem);position:relative}
#landing::before{content:'★  ★  ★';position:absolute;top:2rem;left:50%;transform:translateX(-50%);font-size:1.2rem;color:var(--red);letter-spacing:1.5rem;opacity:0.5}
#landing::after{content:'★  ★  ★';position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);font-size:1.2rem;color:var(--red);letter-spacing:1.5rem;opacity:0.5}
.hero-badge{display:inline-block;background:var(--red);color:var(--gold-light);font-family:'Special Elite',cursive;font-size:0.7rem;letter-spacing:0.25em;text-transform:uppercase;padding:0.35rem 1.2rem;margin-bottom:1.25rem;border:2px solid var(--gold-dark)}
.hero-title{font-family:'Rye',serif;font-size:clamp(2.8rem,7vw,5.5rem);line-height:1;margin-bottom:0.5rem;color:var(--off-white);text-shadow:3px 3px 0 var(--red-dark),5px 5px 0 rgba(0,0,0,0.4)}
.hero-title .accent{color:var(--gold-light);text-shadow:3px 3px 0 var(--gold-dark),5px 5px 0 rgba(0,0,0,0.4)}
.hero-scroll{font-family:'Special Elite',cursive;font-size:1rem;color:var(--off-white);margin-bottom:1.5rem;letter-spacing:0.08em;opacity:0.8}
.hero-sub{font-size:0.92rem;color:rgba(245,237,224,0.7);max-width:500px;line-height:1.7;margin-bottom:2.5rem;font-family:'Special Elite',cursive}
.hero-cta{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.flash-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(0.85rem,1.6vw,1.35rem);width:100%;max-width:1560px;margin:3rem auto 0;align-items:stretch;justify-content:center}
.flash-card{background:var(--cream);border:3px solid var(--navy);color:var(--ink);padding:clamp(1rem,1.6vw,1.4rem);text-align:center;position:relative;box-shadow:4px 4px 0 var(--red-dark);min-height:145px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.flash-card::before{content:'';position:absolute;top:4px;left:4px;right:-4px;bottom:-4px;background:var(--red-dark);z-index:-1}
.flash-card-icon{font-size:1.6rem;margin-bottom:0.5rem}
.flash-card h4{font-family:'Rye',serif;font-size:0.85rem;color:var(--red-dark);margin-bottom:0.35rem}
.flash-card p{font-size:0.75rem;color:#333;line-height:1.5;font-family:'Special Elite',cursive}
@media(max-width:1180px){.flash-grid{grid-template-columns:repeat(3,minmax(210px,1fr));max-width:980px}.flash-card:last-child{grid-column:2}}
@media(max-width:760px){.flash-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:100%}.flash-card:last-child{grid-column:auto}}
@media(max-width:520px){.flash-grid{grid-template-columns:1fr}.flash-card{min-height:130px}}

/* ── MODAL ── */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.9);z-index:100;align-items:center;justify-content:center;padding:1rem;overflow-y:auto}
.modal-overlay.open{display:flex}
.modal{background:var(--cream);border:4px solid var(--red);color:var(--ink);padding:2rem 2.25rem;width:100%;max-width:440px;position:relative;max-height:90vh;overflow-y:auto;box-shadow:6px 6px 0 var(--red-dark)}
.modal h2{font-family:'Rye',serif;font-size:1.4rem;color:var(--red-dark);margin-bottom:0.3rem}
.modal p.sub{font-size:0.78rem;color:#555;margin-bottom:1.5rem;font-family:'Special Elite',cursive;letter-spacing:0.04em}
.form-group{margin-bottom:1.1rem}
.form-group label{display:block;font-size:0.68rem;letter-spacing:0.12em;text-transform:uppercase;color:#555;margin-bottom:0.35rem;font-weight:700}
.form-group input,.form-group select,.form-group textarea{width:100%;background:#fff;border:2px solid #bbb;color:var(--ink);font-family:'Oswald',sans-serif;font-size:0.88rem;padding:0.6rem 0.85rem;outline:none;transition:border-color 0.2s}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--red)}
.form-group select option{background:#fff;color:var(--ink)}
.modal-tabs{display:flex;margin-bottom:1.75rem;border-bottom:3px solid var(--red)}
.modal-tab{flex:1;padding:0.6rem;font-size:0.8rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;background:transparent;border:none;color:#888;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-3px;transition:all 0.2s;font-family:'Oswald',sans-serif}
.modal-tab.active{color:var(--red-dark);border-bottom-color:var(--red-dark);background:rgba(192,57,43,0.05)}
.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;color:#888;font-size:1.2rem;cursor:pointer}
.error-msg{background:rgba(192,57,43,0.1);border:2px solid var(--red);color:var(--red-dark);font-size:0.78rem;padding:0.55rem 0.85rem;margin-bottom:1rem;display:none;font-family:'Special Elite',cursive}
.error-msg.show{display:block}

/* ── DASHBOARD ── */
#dashboard{padding:1.5rem 2rem}
.dash-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:0;gap:1rem;flex-wrap:wrap}
.dash-title{font-family:'Rye',serif;font-size:1.6rem;color:var(--gold-light);text-shadow:2px 2px 0 var(--gold-dark)}
.studio-indicator{font-size:0.7rem;color:var(--gold);display:flex;align-items:center;gap:0.4rem;margin-top:0.25rem;font-family:'Special Elite',cursive}
.studio-dot{width:8px;height:8px;border-radius:50%;background:var(--gold);flex-shrink:0;border:1px solid var(--gold-dark)}
.dash-tabs{display:flex;gap:0;border-bottom:4px solid var(--red);margin:1.25rem 0 1.75rem;overflow-x:auto}
.dash-tab{padding:0.7rem 1.5rem;font-size:0.78rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;background:transparent;border:none;color:rgba(245,237,224,0.5);cursor:pointer;border-bottom:4px solid transparent;margin-bottom:-4px;transition:all 0.2s;font-family:'Oswald',sans-serif;white-space:nowrap}
.dash-tab.active{color:var(--gold-light);border-bottom-color:var(--gold-light);background:rgba(212,160,23,0.07)}
.dash-section{display:none}
.dash-section.active{display:block}

/* ── STUDIO CARDS ── */
.studio-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1.25rem;margin-bottom:1.5rem}
.studio-card{background:var(--cream);border:3px solid var(--navy);color:var(--ink);padding:1.25rem;cursor:pointer;transition:all 0.15s;position:relative;box-shadow:3px 3px 0 rgba(0,0,0,0.4)}
.studio-card:hover{box-shadow:5px 5px 0 var(--red-dark);transform:translate(-1px,-1px)}
.studio-card.selected{border-color:var(--red);box-shadow:5px 5px 0 var(--red-dark)}
.studio-card.selected::after{content:'★';position:absolute;top:0.5rem;right:0.75rem;color:var(--red);font-size:1rem}
.studio-preset-badge{font-family:'Special Elite',cursive;font-size:0.6rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--red-dark);opacity:0.8;margin-bottom:0.4rem}
.studio-name{font-family:'Rye',serif;font-size:0.9rem;color:var(--ink);margin-bottom:0.25rem}
.studio-style{font-size:0.72rem;color:#555;line-height:1.4;font-family:'Special Elite',cursive}
.studio-swatch{width:100%;height:4px;margin-bottom:0.85rem}
.add-studio-card{background:transparent;border:3px dashed rgba(245,237,224,0.2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.4rem;min-height:120px;color:rgba(245,237,224,0.4);font-size:0.78rem;box-shadow:none}
.add-studio-card:hover{border-color:var(--gold);color:var(--gold);transform:none;box-shadow:none}

/* ── BRAND EDITOR ── */
.brand-panel{background:var(--cream);border:3px solid #ccc;color:var(--ink);padding:1.25rem;margin-bottom:1.25rem;box-shadow:3px 3px 0 rgba(0,0,0,0.25)}
.brand-panel h3{font-family:'Rye',serif;font-size:0.85rem;color:var(--red-dark);letter-spacing:0.08em;margin-bottom:1rem;text-transform:uppercase;border-bottom:2px solid var(--red);padding-bottom:0.4rem}
.brand-panel .form-group label{color:#666}
.brand-panel input,.brand-panel textarea,.brand-panel select{background:#fff!important;border-color:#bbb!important;color:var(--ink)!important}
.brand-row{display:grid;grid-template-columns:1fr 1fr;gap:0.85rem}
.color-row{display:flex;gap:0.65rem;flex-wrap:wrap}
.color-swatch-input{display:flex;flex-direction:column;align-items:center;gap:0.35rem;font-size:0.65rem;color:#666;text-transform:uppercase;letter-spacing:0.05em;font-weight:700}
.color-swatch-input input[type=color]{width:44px;height:44px;border:3px solid #aaa;background:none;cursor:pointer;padding:2px}

/* ── GENERATOR ── */
.gen-layout{display:grid;grid-template-columns:380px 1fr;gap:1.5rem;align-items:start}
@media(max-width:900px){.gen-layout{grid-template-columns:1fr}}
.gen-panel{background:var(--cream);border:3px solid #ccc;color:var(--ink);padding:1.25rem;margin-bottom:1rem;box-shadow:3px 3px 0 rgba(0,0,0,0.3);position:relative}
.gen-panel::before{content:'';position:absolute;top:-3px;left:20px;right:20px;height:3px;background:var(--red)}
.gen-section-title{font-family:'Rye',serif;font-size:0.82rem;color:var(--red-dark);letter-spacing:0.1em;text-transform:uppercase;padding-bottom:0.6rem;border-bottom:2px solid var(--red-dark);margin-bottom:1rem}
.gen-panel textarea{width:100%;background:#fff;border:2px solid #bbb;color:var(--ink);font-family:'Oswald',sans-serif;font-size:0.86rem;padding:0.7rem;resize:vertical;min-height:80px;outline:none;line-height:1.6;transition:border-color 0.2s}
.gen-panel textarea:focus{border-color:var(--red)}
.section-label{font-size:0.63rem;letter-spacing:0.15em;text-transform:uppercase;color:#777;margin:0.9rem 0 0.5rem;font-weight:700}

/* CHIPS */
.chips{display:flex;gap:0.4rem;flex-wrap:wrap}
.chip{font-size:0.67rem;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;padding:0.3rem 0.7rem;border:2px solid #bbb;background:#fff;color:#555;cursor:pointer;transition:all 0.15s;font-family:'Oswald',sans-serif}
.chip:hover{border-color:var(--red);color:var(--red-dark)}
.chip.active{border-color:var(--red-dark);background:var(--red);color:#fff}
.info-btn{width:22px;height:22px;border-radius:50%;border:2px solid var(--gold-dark);background:var(--gold);color:var(--navy);font-size:0.68rem;font-weight:900;cursor:pointer;font-family:'Oswald',sans-serif;line-height:1;box-shadow:1px 1px 0 rgba(0,0,0,0.25)}
.info-btn:hover{background:var(--gold-light);transform:translateY(-1px)}

/* CHECKBOXES */
.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.3rem}
.check-item{display:flex;align-items:center;gap:0.45rem;font-size:0.73rem;color:#444;cursor:pointer;padding:0.28rem 0.35rem;transition:background 0.15s;font-family:'Oswald',sans-serif}
.check-item:hover{background:rgba(192,57,43,0.07);color:var(--red-dark)}
.check-item input{accent-color:var(--red);width:13px;height:13px;cursor:pointer;flex-shrink:0}

/* COLOR DOTS */
.color-picker-row{display:flex;gap:0.5rem;flex-wrap:wrap;align-items:center}
.color-dot{width:28px;height:28px;border-radius:50%;cursor:pointer;border:3px solid transparent;transition:all 0.15s;flex-shrink:0}
.color-dot:hover,.color-dot.active{border-color:var(--red-dark);transform:scale(1.18);box-shadow:0 0 0 2px var(--gold)}
.color-dot.custom-dot{background:conic-gradient(red,yellow,lime,cyan,blue,magenta,red);position:relative;overflow:hidden}
.color-dot.custom-dot input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.skin-tone-row{margin-top:0.35rem}
.skin-tone-chip{display:inline-flex;align-items:center;gap:0.38rem}
.skin-tone-chip span{width:18px;height:18px;border-radius:50%;background:var(--skin);border:2px solid rgba(13,13,13,0.45);box-shadow:inset 0 0 0 1px rgba(255,255,255,0.22)}
.skin-note{font-family:'Special Elite',cursive;font-size:0.68rem;line-height:1.5;color:rgba(13,13,13,0.62);margin-top:0.55rem}

/* RANGE */
.range-row{display:flex;align-items:center;gap:0.65rem}
.range-row input[type=range]{flex:1;accent-color:var(--red)}
.range-label{font-size:0.67rem;color:#666;white-space:nowrap;font-weight:700}
.range-val{font-size:0.72rem;color:var(--red-dark);min-width:18px;text-align:right;font-weight:700}

/* OUTPUT */
.output-area{min-height:400px;display:flex;flex-direction:column;gap:1rem}
.output-placeholder{flex:1;border:3px dashed rgba(245,237,224,0.15);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;min-height:380px;color:rgba(245,237,224,0.4);font-size:0.83rem;text-align:center;padding:2rem;font-family:'Special Elite',cursive}
.big-icon{font-size:3rem;opacity:0.2}
.generating-state{flex:1;border:3px solid rgba(212,160,23,0.25);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem;min-height:380px;background:rgba(0,0,0,0.2)}
.ink-loader{width:48px;height:48px;border:4px solid rgba(212,160,23,0.2);border-top-color:var(--gold);border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.gen-status{font-size:0.8rem;color:rgba(245,237,224,0.6);text-align:center;max-width:260px;line-height:1.6;font-family:'Special Elite',cursive}
.result-batch{display:flex;flex-direction:column;gap:0.65rem}
.result-batch-title{font-family:'Rye',serif;color:var(--gold-light);font-size:0.78rem;letter-spacing:0.08em;text-transform:uppercase;text-shadow:1px 1px 0 var(--gold-dark)}
.results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:1rem}
.result-card{background:var(--cream);border:3px solid var(--navy);overflow:hidden;transition:all 0.2s;box-shadow:3px 3px 0 rgba(0,0,0,0.4)}
.result-card:hover{box-shadow:5px 5px 0 var(--red-dark);transform:translate(-1px,-1px)}
.result-card img{width:100%;aspect-ratio:1;object-fit:cover;display:block;background:#fff}
.watermark-frame{position:relative;display:block;overflow:hidden;background:#fff}
.watermark-frame{cursor:zoom-in}
.watermark-frame img{width:100%;height:100%;object-fit:cover;display:block;background:#fff}
.watermark-frame::before{content:'';position:absolute;inset:-20%;z-index:2;pointer-events:none;background-image:repeating-linear-gradient(-28deg,transparent 0,transparent 78px,rgba(192,57,43,0.22) 80px,rgba(192,57,43,0.22) 82px,transparent 84px,transparent 158px);mix-blend-mode:multiply}
.watermark-frame::after{content:'INKFORGED · PREVIEW';position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;text-align:center;pointer-events:none;color:rgba(192,57,43,0.38);font-family:'Rye',serif;font-size:clamp(1.2rem,5vw,2.35rem);letter-spacing:0.08em;text-shadow:1px 1px 0 rgba(255,255,255,0.35);transform:rotate(-18deg)}
.watermark-frame.purchased::before,.watermark-frame.purchased::after{display:none}
.result-card .watermark-frame{width:100%;aspect-ratio:1}
.result-card-foot{padding:0.5rem 0.7rem;display:flex;justify-content:space-between;align-items:center;gap:4px;background:var(--navy)}
.prompt-preview{background:rgba(0,0,0,0.3);border:2px solid rgba(212,160,23,0.25);padding:0.85rem;margin-bottom:1rem;font-size:0.73rem;color:rgba(245,237,224,0.6);line-height:1.6;font-family:'Special Elite',cursive}
.prompt-preview strong{color:var(--gold);font-family:'Oswald',sans-serif;text-transform:uppercase;font-size:0.65rem;letter-spacing:0.1em}

/* GALLERY */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:1rem}
.gallery-item{aspect-ratio:1;background:var(--cream);border:3px solid var(--navy);overflow:hidden;position:relative;box-shadow:3px 3px 0 rgba(0,0,0,0.3)}
.gallery-item img{width:100%;height:100%;object-fit:cover}
.gallery-item .watermark-frame{width:100%;height:100%;aspect-ratio:1}
.gallery-item-overlay{position:absolute;inset:0;background:rgba(13,13,13,0.82);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.5rem;opacity:0;transition:opacity 0.2s;padding:0.5rem}
.gallery-item:hover .gallery-item-overlay{opacity:1}
.gallery-empty{text-align:center;color:rgba(245,237,224,0.4);padding:3rem;font-size:0.83rem;grid-column:1/-1;font-family:'Special Elite',cursive}

/* SECTION HEADING */
.section-heading{font-family:'Rye',serif;font-size:1rem;color:var(--gold-light);margin-bottom:0.25rem;text-shadow:1px 1px 0 var(--gold-dark)}
.section-heading-desc{font-size:0.75rem;color:rgba(245,237,224,0.5);margin-bottom:1.25rem;font-family:'Special Elite',cursive}

/* WARN BANNER */
.warn-bar{background:rgba(212,160,23,0.1);border:2px solid rgba(212,160,23,0.35);padding:0.75rem 1rem;margin-bottom:1.25rem;font-size:0.8rem;display:none;font-family:'Special Elite',cursive;color:var(--gold-light)}
.warn-bar button{background:none;border:none;color:var(--gold);cursor:pointer;text-decoration:underline;font-size:0.8rem;font-family:'Special Elite',cursive}

/* GENERATE BTN */
.generate-btn{width:100%;padding:1rem;font-size:0.95rem;letter-spacing:0.18em;margin-top:0.75rem;background:var(--red);color:var(--gold-light);border:3px solid var(--red-dark)!important;font-family:'Rye',serif;font-weight:400;cursor:pointer;transition:all 0.15s;text-transform:uppercase;box-shadow:4px 4px 0 var(--red-dark);clip-path:none}
.generate-btn:hover{background:var(--red-dark);box-shadow:2px 2px 0 #5a0000;transform:translate(1px,1px)}
.quota-panel{background:rgba(212,160,23,0.1);border:2px solid rgba(212,160,23,0.4);padding:0.85rem;margin-top:1rem;display:flex;align-items:center;justify-content:space-between;gap:0.75rem;flex-wrap:wrap;color:var(--gold-light)}
.quota-title{font-family:'Rye',serif;font-size:0.78rem;color:var(--gold-light);letter-spacing:0.08em;text-transform:uppercase;margin-bottom:0.2rem}
.quota-copy{font-family:'Special Elite',cursive;font-size:0.72rem;color:rgba(245,237,224,0.72);line-height:1.45}

/* TOAST */
.toast{position:fixed;bottom:2rem;right:2rem;background:var(--navy);border:3px solid var(--gold);color:var(--gold-light);font-size:0.8rem;padding:0.85rem 1.25rem;z-index:999;transform:translateY(100px);opacity:0;transition:all 0.3s;max-width:300px;font-family:'Special Elite',cursive;box-shadow:4px 4px 0 rgba(0,0,0,0.5)}
.toast.show{transform:translateY(0);opacity:1}
.toast.success{border-color:var(--green-light)}
.toast.error{border-color:var(--red-light)}

/* STAR BORDER */
.star-border{display:flex;align-items:center;gap:0.75rem;color:var(--red);font-size:0.8rem;margin:1.25rem 0;opacity:0.5}
.star-border::before,.star-border::after{content:'';flex:1;height:1px;background:currentColor}

hr.dl{border:none;border-top:2px solid rgba(245,237,224,0.1);margin:1.25rem 0}

/* ── COMMUNITY ── */
.community-toolbar{display:flex;align-items:center;justify-content:space-between;gap:0.75rem;flex-wrap:wrap;margin-bottom:1.25rem}
.community-sort{display:flex;gap:0.4rem}
.community-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.25rem}
.community-card{background:var(--cream);border:3px solid var(--navy);color:var(--ink);overflow:hidden;box-shadow:3px 3px 0 rgba(0,0,0,0.4);display:flex;flex-direction:column}
.community-card img{width:100%;aspect-ratio:1;object-fit:cover;background:#fff;display:block}
.community-card .watermark-frame{width:100%;aspect-ratio:1}
.community-card-body{padding:0.85rem 1rem;display:flex;flex-direction:column;gap:0.55rem}
.community-author{font-family:'Rye',serif;font-size:0.8rem;color:var(--red-dark)}
.community-prompt{font-size:0.72rem;color:#555;line-height:1.5;font-family:'Special Elite',cursive;max-height:3.2em;overflow:hidden}
.vote-row{display:flex;align-items:center;gap:0.5rem}
.vote-btn{width:34px;height:30px;border:2px solid var(--navy);background:#fff;color:var(--ink);cursor:pointer;font-weight:700;font-family:'Oswald',sans-serif;transition:all 0.15s}
.vote-btn:hover{border-color:var(--red);color:var(--red-dark)}
.vote-btn.active-up{background:var(--green-light);border-color:var(--green);color:#fff}
.vote-btn.active-down{background:var(--red);border-color:var(--red-dark);color:#fff}
.vote-score{font-weight:700;font-size:0.9rem;min-width:26px;text-align:center}
.vote-meta{font-size:0.66rem;color:#777;font-family:'Special Elite',cursive;margin-left:auto}
.comment-box{border-top:2px solid rgba(0,0,0,0.1);padding-top:0.6rem;display:flex;flex-direction:column;gap:0.4rem}
.comment-list{display:flex;flex-direction:column;gap:0.4rem;max-height:140px;overflow-y:auto}
.comment{background:#fff;border:1px solid #ddd;border-radius:4px;padding:0.4rem 0.55rem;font-size:0.72rem;color:#333;font-family:'Oswald',sans-serif}
.comment strong{color:var(--red-dark)}
.comment-empty{font-size:0.7rem;color:#999;font-family:'Special Elite',cursive}
.comment-form{display:flex;gap:0.4rem}
.comment-form input{flex:1;background:#fff;border:2px solid #bbb;color:var(--ink);font-family:'Oswald',sans-serif;font-size:0.78rem;padding:0.4rem 0.55rem;outline:none}
.comment-form input:focus{border-color:var(--red)}
.shared-badge{font-size:0.6rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--green-light);font-weight:700}

/* ── IMAGE VIEWER ── */
.image-viewer{width:min(92vw,980px);max-height:92vh;background:var(--cream);border:4px solid var(--red);box-shadow:8px 8px 0 var(--red-dark);padding:1rem;color:var(--ink);position:relative;display:flex;flex-direction:column;gap:0.75rem}
.image-viewer-close{top:0.75rem;right:0.75rem;z-index:4}
.image-viewer-title{font-family:'Rye',serif;color:var(--red-dark);font-size:1rem;padding-right:2rem}
.image-viewer-frame{width:100%;max-height:76vh;aspect-ratio:1;margin:0 auto;border:3px solid var(--navy);cursor:default}
.image-viewer-frame img{width:100%;height:100%;object-fit:contain;background:#fff}
.image-viewer-frame::after{font-size:clamp(1.6rem,7vw,4.5rem)}
.image-viewer-note{font-family:'Special Elite',cursive;color:#666;font-size:0.78rem;text-align:center}