:root{--gold:#d9aa3c;--gold2:#f2cf6b;--deep:#07182f;--glass:rgba(8,28,55,.9)}
body{
 background-color:var(--deep);
 background-image:radial-gradient(900px 520px at 100% -10%,rgba(34,211,238,.11),transparent 62%),linear-gradient(rgba(5,18,38,.80),rgba(5,18,38,.91)),url('texture/navy_marble.webp');
 background-size:auto,auto,720px auto;background-attachment:fixed
}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.035;background:url('texture/arabesque.webp') center/520px auto repeat}
.shell-top,body.is-stage .shell-top,body.is-lab .shell-top{
 background:linear-gradient(90deg,rgba(7,24,47,.95),rgba(15,56,103,.91),rgba(7,24,47,.95)),url('texture/panel_navy_gold.webp') center/620px auto;
 border-bottom:1px solid rgba(217,170,60,.72);box-shadow:0 10px 30px rgba(0,0,0,.28),inset 0 -1px 0 rgba(255,255,255,.06)
}
.brand img{width:42px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.32))}
.brand b{color:#fff}.brand small{color:#d7e2ef}
.brand-tech{display:block;margin-top:2px;color:var(--gold2);font-style:normal;font-size:.61rem;line-height:1.2;font-weight:700}
.steps li i{height:5px;border:1px solid rgba(217,170,60,.32);background:rgba(255,255,255,.08)}
.steps li.done i{background:linear-gradient(90deg,var(--gold),var(--lime))}
.steps li.now i{background:linear-gradient(90deg,var(--gold2),var(--lime),var(--cyan));box-shadow:0 0 10px rgba(155,197,61,.34)}
.card,.kn-box,.sheet,.kn-cal{
 background:linear-gradient(rgba(8,29,57,.91),rgba(8,24,48,.96)),url('texture/navy_marble.webp') center/680px auto;
 border:1px solid rgba(217,170,60,.48);box-shadow:0 18px 44px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.08)
}
.card{position:relative;overflow:hidden}
.card::before,.kn-box::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.05;background:url('texture/arabesque.webp') center/440px auto}
.card>*,.kn-box>*{position:relative;z-index:1}
.h-sec{color:#fff7dc}.h-display,.h-sec{text-shadow:0 2px 10px rgba(0,0,0,.26)}
.btn{border:1px solid rgba(247,207,106,.75);background:linear-gradient(135deg,#b7e844,#9BC53D 52%,#d6ca42);color:#08284b;box-shadow:0 10px 26px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.65)}
.btn-ghost{color:#f4f7fb;border-color:rgba(217,170,60,.48);background:linear-gradient(rgba(9,35,68,.8),rgba(8,26,52,.92)),url('texture/navy_marble.webp') center/460px auto}
.sq-row:not(.user) .sq-bubble,#guide .sq-bubble,.tr-guide .sq-bubble{background:linear-gradient(rgba(8,31,61,.91),rgba(7,24,47,.95)),url('texture/navy_marble.webp') center/480px auto!important;border:1px solid rgba(217,170,60,.38);box-shadow:0 12px 30px rgba(0,0,0,.24)}
.sq-row.user .sq-bubble{border:1px solid rgba(255,235,153,.9);background:linear-gradient(135deg,#b8e844,#9BC53D)}
.sq-choice,.sq-text-row input,.sq-text-row textarea,.kn-date-btn,.kn-cal-head select{background:linear-gradient(rgba(7,28,55,.89),rgba(8,30,58,.94)),url('texture/navy_marble.webp') center/380px auto;border-color:rgba(217,170,60,.36)}
.sq-choice:hover,.kn-date-btn:hover{border-color:var(--gold2)}
.sq-inputzone{background:linear-gradient(to top,rgba(6,22,44,.98) 66%,transparent)}
.kn-stage{background:linear-gradient(rgba(5,19,39,.2),rgba(5,19,39,.58)),url('texture/navy_marble.webp') center/700px auto}
.kn-stage::before,.wc-stage::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.075;background:url('texture/arabesque.webp') center/560px auto;mix-blend-mode:screen}
.kn-place{border-color:rgba(217,170,60,.7);color:#fff4ce;background:rgba(7,27,53,.82);box-shadow:0 8px 24px rgba(0,0,0,.25)}
.kn-tag{border:1px solid rgba(247,207,106,.64);background:linear-gradient(135deg,var(--c,var(--navy-2)),#0b2d59)}
.kn-cover h1{color:#fff6d7}.kn-cover p{color:#d1dbe8}
.kn-chips span{background:rgba(7,28,55,.66);border-color:rgba(217,170,60,.34);color:#dce6f0}.kn-chips span b{color:var(--gold2)}
.it-iot-badge{display:block;width:min(100%,560px);height:auto;margin:0 auto 12px;filter:drop-shadow(0 10px 22px rgba(0,0,0,.32))}
.it-iot-mini{width:min(100%,460px);height:auto;display:block;margin:12px 0 4px;filter:drop-shadow(0 8px 18px rgba(0,0,0,.28))}
.tech-ribbon{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px 8px;padding:6px 10px;margin:0 0 10px;border-radius:14px;background:rgba(7,28,55,.72);border:1px solid rgba(217,170,60,.46);color:#fff3c8;font-size:.72rem;font-weight:700;text-align:center}.tech-ribbon b{color:var(--lime-2)}
.tr-room{background:linear-gradient(rgba(8,30,59,.87),rgba(6,25,49,.92)),url('texture/navy_marble.webp') center/340px auto;border-color:rgba(217,170,60,.4)}
.tr-room.active{border-color:var(--gold2);background:linear-gradient(135deg,rgba(155,197,61,.26),rgba(12,49,89,.88));box-shadow:0 0 18px rgba(155,197,61,.16)}
.tr-card,#picker button.z{border-color:rgba(217,170,60,.36);background:linear-gradient(rgba(8,28,55,.85),rgba(7,24,47,.94)),url('texture/navy_marble.webp') center/380px auto}
.tr-card.seen,#picker button.z[aria-pressed="true"]{border-color:var(--gold2);box-shadow:0 0 0 2px rgba(155,197,61,.20),0 12px 30px rgba(0,0,0,.25)}
#bag,#zoneLabel{background:linear-gradient(rgba(8,31,60,.9),rgba(7,24,48,.94)),url('texture/navy_marble.webp') center/360px auto!important;border-color:rgba(217,170,60,.55)!important;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.wc-tempat{border-color:var(--gold)!important;color:#e7edf4;background:linear-gradient(rgba(7,29,57,.82),rgba(7,24,48,.9)),url('texture/navy_marble.webp') center/360px auto}
.hero-hasil{position:relative;padding:18px;margin-bottom:14px;border-radius:24px;border:1px solid rgba(217,170,60,.46);background:radial-gradient(400px 220px at 100% 0%,rgba(155,197,61,.12),transparent),linear-gradient(rgba(8,29,57,.88),rgba(7,24,47,.94)),url('texture/navy_marble.webp') center/650px auto;box-shadow:0 18px 38px rgba(0,0,0,.25)}
.hero-hasil .sirqu{border-color:var(--gold2);background:rgba(255,255,255,.94)}
.minat-chips span{border-color:rgba(217,170,60,.38);background:rgba(8,32,62,.62)}
.ticket{border:1px solid rgba(247,207,106,.7);background:linear-gradient(120deg,rgba(20,73,140,.95),rgba(8,31,61,.97)),url('texture/panel_navy_gold.webp') center/560px auto}.ticket .t-side{background:linear-gradient(150deg,#d8b443,#9BC53D)}
@media(min-width:760px){.shell-top{display:grid;grid-template-columns:minmax(260px,1fr) minmax(360px,560px);align-items:center}.shell-main{max-width:680px}}
@media(max-width:520px){.brand-tech{font-size:.56rem;max-width:310px}.it-iot-badge{margin-bottom:8px}}