/* SILK street mode. Extends the base styles in index.html. */
:root{--navh:46px;--glass:rgba(13,15,20,.78);--sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
nav{z-index:30;padding-bottom:env(safe-area-inset-bottom)}
nav button{padding:12px 2px;min-height:var(--navh);font-size:12.5px;letter-spacing:.02em}
nav button[data-t=street]{color:var(--ink);font-weight:700}nav button[data-t=street].on{color:var(--gold)}
.modal{z-index:60}
body.streeton{overflow:hidden;overscroll-behavior:none}body.streeton .wrap{display:none}
#street{display:none;position:fixed;left:0;right:0;top:0;bottom:calc(var(--navh) + env(safe-area-inset-bottom));z-index:20;background:#0d0f14;overflow:hidden;font-family:var(--sans);touch-action:none;user-select:none;-webkit-user-select:none}
#scv{position:absolute;inset:0;display:block}
.hc{background:var(--glass);border:1px solid rgba(201,162,75,.28);border-radius:12px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 6px 20px rgba(0,0,0,.35)}
#hud{position:absolute;left:10px;right:10px;top:10px;display:flex;justify-content:space-between;gap:8px;pointer-events:none}
.hme{display:flex;align-items:center;gap:8px;padding:5px 12px 5px 5px;min-width:0}
#hpor{width:42px;height:42px;border-radius:9px;border:1px solid rgba(201,162,75,.5);flex:none}
.hme b{display:block;font:700 14px Georgia,serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40vw}.hme small,.hst small{display:block;color:var(--mute);font-size:11px;letter-spacing:.04em}
.hst{padding:6px 12px;text-align:right;min-width:128px}.hst b{font:700 16px Georgia,serif}
.hbars{display:flex;gap:5px;margin-top:4px}.hbars span{flex:1;height:5px;background:#2a2e38;border-radius:3px;overflow:hidden}.hbars i{display:block;height:100%;background:linear-gradient(90deg,#c9a24b,#f0d58a);transition:width .4s}.hbars i.mo{background:linear-gradient(90deg,#3f8fd2,#8fd0ff)}
#hobj{position:absolute;left:10px;top:72px;max-width:min(330px,62vw);padding:8px 12px;pointer-events:none}
#hobj small{display:block;color:var(--gold);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase}#hobj b{display:block;font-size:13.5px;font-weight:600;line-height:1.35;margin-top:2px}#hobj small.gold{letter-spacing:.02em;text-transform:none;font-size:11.5px;margin-top:3px}
#hbtns{position:absolute;right:10px;top:76px;display:flex;flex-direction:column;gap:7px}
#hbtns button{width:52px;height:52px;padding:6px 0 4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;background:var(--glass);border:1px solid rgba(201,162,75,.3);border-radius:12px;color:var(--ink);text-align:center;backdrop-filter:blur(6px)}
#hbtns button:hover{border-color:var(--gold);color:var(--gold)}#hbtns svg{width:21px;height:21px}#hbtns span{font-size:9.5px;letter-spacing:.05em;color:var(--mute)}
#hprompt{position:absolute;left:50%;bottom:22px;transform:translate(-50%,10px);opacity:0;transition:.2s;background:var(--glass);border:1px solid rgba(201,162,75,.45);border-radius:999px;padding:8px 16px;font-size:14px;font-weight:600;white-space:nowrap;pointer-events:none}
#hprompt.on{opacity:1;transform:translate(-50%,0)}kbd{display:inline-block;background:var(--gold);color:#111;border-radius:5px;padding:0 6px;font:800 12px var(--sans);margin-right:6px}
#joy,#bact,#brun{display:none}
body.touch #hprompt{bottom:auto;top:auto;bottom:118px}body.touch #hprompt kbd{display:none}
body.touch #bact{display:flex;position:absolute;right:16px;bottom:18px;width:78px;height:78px;border-radius:50%;align-items:center;justify-content:center;text-align:center;padding:0;font:800 13px var(--sans);letter-spacing:.06em;background:radial-gradient(circle at 35% 30%,#f0d58a,#c9a24b 60%,#8a6a2a);color:#1a1408;border:2px solid rgba(255,255,255,.35);box-shadow:0 6px 18px rgba(0,0,0,.45)}
body.touch #bact.dim{opacity:.45}
body.touch #brun{display:block;position:absolute;right:104px;bottom:24px;width:58px;height:44px;border-radius:22px;padding:0;text-align:center;font:800 11px var(--sans);letter-spacing:.06em;background:var(--glass);border:1px solid rgba(201,162,75,.4);color:var(--mute)}
body.touch #brun.on{color:#1a1408;background:var(--gold)}
#joy{position:absolute;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.07);border:2px solid rgba(255,255,255,.18);pointer-events:none}
#joy.on{display:block}#joy i{position:absolute;left:36px;top:36px;width:48px;height:48px;border-radius:50%;background:rgba(201,162,75,.75);box-shadow:0 2px 10px rgba(0,0,0,.4)}
body.touch #street::after{content:"Drag anywhere to walk";position:absolute;left:16px;bottom:22px;font-size:11px;color:rgba(236,232,223,.45);pointer-events:none}
/* dialogue */
#dlg{position:absolute;left:50%;bottom:14px;transform:translate(-50%,20px);width:min(760px,calc(100% - 20px));display:flex;gap:14px;padding:14px;opacity:0;pointer-events:none;transition:.22s;background:linear-gradient(180deg,rgba(23,26,34,.97),rgba(13,15,20,.98));border:1px solid rgba(201,162,75,.5);border-radius:16px;box-shadow:0 14px 40px rgba(0,0,0,.6);z-index:5;cursor:pointer}
#dlg.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
#dpor{width:96px;height:96px;border-radius:12px;border:1px solid rgba(201,162,75,.55);flex:none}
.dtx{flex:1;min-width:0}.dsc{color:var(--gold);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase}.dsc:empty{display:none}
#dname{font:700 17px Georgia,serif;color:var(--ink)}#drole{display:block;color:var(--mute);font-size:11.5px;margin-top:1px}
#dtext{margin:8px 0 4px;font-size:15.5px;line-height:1.5;min-height:46px;color:#f4efe4}
#dch{display:flex;flex-direction:column;gap:7px}#dch button{font:500 14px var(--sans);padding:10px 12px;border-radius:10px;background:#1f2330;border:1px solid #3a4050;line-height:1.35;display:flex;gap:10px;align-items:flex-start}
#dch button:hover{border-color:var(--gold);background:#262b3a}#dch button span{flex:none;width:20px;height:20px;border-radius:5px;background:rgba(201,162,75,.2);color:var(--gold);font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}
.dhint{text-align:right;color:var(--gold);font-size:11.5px;opacity:.8;animation:pulse 1.4s infinite}@keyframes pulse{50%{opacity:.35}}
/* panels */
#wpnl{position:absolute;left:50%;top:50%;transform:translate(-50%,-46%) scale(.98);width:min(460px,calc(100% - 20px));max-height:calc(100% - 20px);display:flex;flex-direction:column;opacity:0;pointer-events:none;transition:.2s;background:#141720;border:1px solid rgba(201,162,75,.45);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.7);z-index:6}
#wpnl.on{opacity:1;pointer-events:auto;transform:translate(-50%,-50%)}#wpnl.wide{width:min(560px,calc(100% - 20px))}#wpnl.creator{width:min(900px,calc(100% - 16px));height:calc(100% - 16px)}
.wph{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line)}.wph b{font:700 17px Georgia,serif;color:var(--gold)}
#wpx{width:34px;height:34px;padding:0;text-align:center;border-radius:50%;font-size:14px}
#wpnl.creator:not(.closable) #wpx{display:none}
.wpb{padding:12px 14px 16px;overflow:auto;-webkit-overflow-scrolling:touch;font-size:14px}
.wnote{color:var(--mute);font-size:13px;margin:4px 0 10px}.wnote b{font-weight:700}
.wrow{display:flex;align-items:center;gap:12px;margin-bottom:8px;padding:10px 12px;border-radius:12px;font:14px var(--sans);background:#1b1f2a;border:1px solid #2e3443;width:100%;text-align:left}
.wrow>span:nth-child(2),.wrow>span:first-child:not(.wi):not(.wdot){flex:1;min-width:0}.wrow b{display:block;font-weight:650}.wrow small{display:block;color:var(--mute);font-size:12px;margin-top:2px}
.wi{font-size:24px;width:34px;text-align:center;flex:none}.wp{color:var(--gold);font-weight:700;white-space:nowrap}.wdot{width:12px;height:12px;border-radius:50%;flex:none}
.wbtn{width:auto;padding:7px 14px;border-radius:9px;background:var(--gold);color:#1a1408;border:0;font:700 13px var(--sans);flex:none}.wtag{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(201,162,75,.5);border-radius:6px;padding:3px 7px;flex:none}
.wmini{width:42px;height:56px;border-radius:8px;background:#2a2333;flex:none}
.wgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px}.wcard{text-align:center;padding:8px;border-radius:12px;font:13px var(--sans);display:flex;flex-direction:column;align-items:center;gap:3px}.wcard.on{border-color:var(--gold);background:#2a2516}.wcard .wmini{width:60px;height:80px}
.sw{display:flex;flex-wrap:wrap;gap:7px;margin:6px 0 10px}.sw button{width:30px;height:30px;padding:0;border-radius:50%;border:2px solid rgba(255,255,255,.15)}.sw button.on{border-color:#fff;box-shadow:0 0 0 2px var(--gold)}
.wq{background:#1b1f2a;border:1px solid #2e3443;border-radius:12px;padding:11px 12px;margin-bottom:8px;position:relative}.wq.on{border-color:var(--gold)}.wq b{font:700 15px Georgia,serif}.wq small{display:block;color:var(--mute);font-size:12px}.wq p{margin:6px 0 4px;color:#f0e7cf;font-size:13.5px}.wq .wbtn,.wq .wtag{position:absolute;right:10px;top:10px}
.wmap canvas{width:100%;height:auto;border-radius:10px;border:1px solid var(--line);display:block}.lg{display:inline-block;width:10px;height:10px;border-radius:50%;margin:0 4px 0 10px;border:1px solid #000;vertical-align:middle}
.fxt{color:#7fd49b;font-weight:700}
/* creator */
.cwrap{display:flex;gap:16px}.cprev{flex:none;width:230px;display:flex;flex-direction:column;align-items:center;gap:10px;position:sticky;top:0}
#cfull{width:220px;height:260px;border-radius:14px;border:1px solid rgba(201,162,75,.4)}#cpor{width:110px;height:110px;border-radius:12px;border:1px solid rgba(201,162,75,.4)}
.copts{flex:1;min-width:0}.crow{margin-bottom:10px}.cops{display:flex;flex-wrap:wrap;gap:6px;margin-top:5px}
.chip{width:auto;padding:7px 11px;border-radius:999px;font:13px var(--sans);background:#1b1f2a;border:1px solid #333a4a}.chip.on{background:#2a2516;border-color:var(--gold);color:var(--gold)}
.chip.wide{border-radius:12px;flex:1 1 180px}.chip.wide small{color:var(--mute)}
.cops input{margin:0;font:15px var(--sans)}
.cgo{margin-top:14px;text-align:center;padding:14px;border-radius:12px;font:700 16px Georgia,serif;letter-spacing:.06em;background:linear-gradient(180deg,#e2c06a,#c9a24b);color:#1a1408;border:0;position:sticky;bottom:0;box-shadow:0 -8px 20px #141720}
/* toasts, fade, banner */
#toasts{position:absolute;left:50%;top:70px;transform:translateX(-50%);display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none;width:min(360px,70vw);z-index:7}
.toast{background:rgba(20,22,30,.94);border:1px solid rgba(201,162,75,.5);border-radius:12px;padding:8px 14px;font-size:13px;text-align:center;animation:tin .25s;transition:opacity .5s,transform .5s;width:100%}.toast small{display:block;color:var(--gold);font-size:10px;letter-spacing:.14em;text-transform:uppercase}.toast.big{padding:12px 16px;font-size:14px;border-color:var(--gold);box-shadow:0 0 30px rgba(201,162,75,.25)}.toast.out{opacity:0;transform:translateY(-8px)}
@keyframes tin{from{opacity:0;transform:translateY(-8px)}}
#fade{position:absolute;inset:0;background:#0b0c10;display:flex;align-items:center;justify-content:center;text-align:center;opacity:0;pointer-events:none;transition:opacity .35s;z-index:9}#fade.on{opacity:1;pointer-events:auto}
#fade b{display:block;font:700 26px Georgia,serif;color:var(--gold);letter-spacing:.08em}#fade small{display:block;color:var(--mute);margin-top:8px;font-size:14px}
#bannr{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);text-align:center;opacity:0;pointer-events:none;text-shadow:0 2px 12px rgba(0,0,0,.8)}#bannr b{display:block;font:700 34px Georgia,serif;color:#fff;letter-spacing:.14em;text-transform:uppercase}#bannr small{color:var(--gold);letter-spacing:.2em;text-transform:uppercase;font-size:12px}
#bannr.on{animation:ban 2.8s}@keyframes ban{0%{opacity:0;transform:translate(-50%,-40%)}15%,70%{opacity:1;transform:translate(-50%,-50%)}100%{opacity:0}}
@media (max-width:640px){
 nav button{font-size:11px}
 #hud{left:8px;right:8px;top:8px}.hme b{font-size:13px;max-width:34vw}.hst{min-width:108px;padding:5px 10px}.hst b{font-size:14px}
 #hobj{left:8px;top:66px;max-width:calc(100% - 82px)}#hobj b{font-size:12.5px}
 #hbtns{right:8px;top:66px;gap:6px}#hbtns button{width:46px;height:46px}#hbtns svg{width:18px;height:18px}
 #dlg{padding:10px;gap:10px;bottom:10px}#dpor{width:64px;height:64px}#dtext{font-size:14.5px}#dname{font-size:15px}
 .cwrap{flex-direction:column}.cprev{position:static;width:100%;flex-direction:row;justify-content:center}#cfull{width:150px;height:177px}#cpor{width:90px;height:90px}
 #bannr b{font-size:24px}
}
body.wbusy #bact,body.wbusy #brun,body.wbusy #hprompt,body.wbusy #street::after{display:none!important}
@media (max-width:640px){#toasts{top:auto;bottom:120px}}
#hobj small.hbrief{color:#ECE8DF;letter-spacing:.02em;text-transform:none;font-size:11.5px;margin-top:5px;padding-top:5px;border-top:1px solid rgba(201,162,75,.25)}#hobj small.hdaily{color:#7fd49b;letter-spacing:.02em;text-transform:none;font-size:11.5px;margin-top:3px}
#hbtns button.off{opacity:.55}
@media (max-height:560px){#hbtns button{width:44px;height:44px}#hbtns span{display:none}}
.hme small,.hst small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42vw}
@media (max-width:640px){#hbtns{top:auto;bottom:118px}#hbtns button{width:44px;height:44px}#hbtns span{display:none}#hbtns{gap:5px}}
.lbtabs{display:flex;gap:8px;margin-bottom:10px}.lbt{width:100%;border-collapse:collapse;font:14px system-ui;margin-bottom:6px}.lbt th{text-align:left;color:#9a968c;font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:6px 4px;border-bottom:1px solid #2e3443}.lbt td{padding:8px 4px;border-bottom:1px solid #22262f;vertical-align:top}.lbt td:first-child{color:#c9a24b;font-weight:800;width:28px}.lbt td small{display:block;color:#9a968c;font-size:11px}.lbt td:nth-child(3),.lbt td:nth-child(4),.lbt th:nth-child(3),.lbt th:nth-child(4){text-align:right;white-space:nowrap}.lbt tr.me td{background:#2a2516}
a.wrow{color:inherit;text-decoration:none}