/* Craic Hub trading terminal, 9 Nov 2026 */
/* sticky search: lives inside the sticky header on every page */
.hts{order:9;flex:1 0 100%;width:100%;position:relative;padding:8px max(12px,calc((100vw - 1240px)/2)) 10px;box-sizing:border-box}
header .gs{display:none!important}
.hts-f{display:flex;align-items:center;gap:8px;background:rgba(18,30,52,.85);border:1px solid var(--line,rgba(120,200,255,.14));border-radius:14px;padding:0 6px 0 14px;min-height:46px}
.hts-f:focus-within{border-color:var(--acc,#2EE6B6);box-shadow:0 0 0 3px rgba(46,230,182,.16)}
.hts-i{font-size:15px;opacity:.8}
.hts-f input{flex:1;min-width:0;background:transparent!important;border:0!important;box-shadow:none!important;color:var(--txt,#E6F1FF);font-size:16px;padding:12px 4px;outline:none}
.hts-f input::-webkit-search-cancel-button{display:none}
.hts-x{min-width:44px;min-height:44px;background:none;border:0;color:var(--mut,#8197B5);font-size:16px;cursor:pointer}
.hts-r{position:absolute;left:max(12px,calc((100vw - 1240px)/2));right:max(12px,calc((100vw - 1240px)/2));top:calc(100% - 4px);z-index:300;background:#0d1a30;border:1px solid var(--line,rgba(120,200,255,.14));border-radius:14px;box-shadow:0 20px 50px -10px rgba(0,0,0,.8);max-height:min(62vh,520px);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:6px}
.hts-h{font-size:12px;color:var(--mut,#8197B5);padding:8px 10px}
.hts-o{display:grid;grid-template-columns:32px 1fr auto auto;align-items:center;gap:10px;min-height:52px;padding:8px 10px;border-radius:10px;color:var(--txt,#E6F1FF);text-decoration:none}
.hts-o:hover,.hts-o.on{background:rgba(46,230,182,.08)}
.hts-o img,.hts-o .ph{width:32px;height:32px;border-radius:50%;object-fit:cover}
.ph{display:inline-flex;align-items:center;justify-content:center;background:rgba(46,230,182,.14);color:var(--acc,#2EE6B6);font-weight:700;font-size:12px;border-radius:50%;flex:0 0 auto}
.hts-n{display:flex;flex-direction:column;min-width:0}.hts-n b{font-size:14px}.hts-n small{font-size:12px;color:var(--mut,#8197B5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hts-ch{display:none;font-size:11px;padding:3px 7px;border-radius:999px;background:rgba(120,200,255,.1);color:var(--mut,#8197B5);white-space:nowrap}
.hts-p{display:flex;flex-direction:column;align-items:flex-end;font-size:13px}.hts-p small{font-size:11px;color:var(--mut,#8197B5)}
@media(max-width:520px){.hts{padding:6px 10px 8px}.hts-o{grid-template-columns:32px 1fr auto}.hts-ch{display:none}}
.ht-c{font-style:normal;font-size:12px;font-weight:600;margin-left:6px}.ht-c.up{color:var(--up,#2EE6B6)}.ht-c.dn{color:var(--dn,#FF5C7A)}
/* layout */
.ht{width:100%;max-width:1240px;margin:0 auto;padding:12px 12px 28px;box-sizing:border-box;min-width:0}
.ht *{box-sizing:border-box}
.ht-hero{text-align:center;padding:8px 6px 4px}.ht-hero h2{font-size:clamp(22px,4.4vw,34px);margin:4px 0 6px}.ht-hero p{color:var(--mut,#8197B5);margin:0 auto 6px;max-width:640px;font-size:14.5px}
.ht-bc{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px;color:var(--mut,#8197B5);margin:2px 0 10px}.ht-bc a{color:var(--mut,#8197B5);text-decoration:none;padding:10px 2px;min-height:44px;display:inline-flex;align-items:center}.ht-bc a:hover{color:var(--acc,#2EE6B6)}.ht-bc b{color:var(--txt,#E6F1FF)}
/* carousel */
.ht-car{display:flex;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:4px 2px 12px;margin:0 0 6px;scrollbar-width:thin;touch-action:pan-x pan-y}
.ht-ci{scroll-snap-align:start;flex:0 0 auto;display:flex;align-items:center;gap:10px;min-width:150px;min-height:60px;padding:10px 14px;border-radius:16px;background:var(--card,rgba(18,30,52,.62));border:1px solid var(--line,rgba(120,200,255,.14));color:var(--txt,#E6F1FF);text-decoration:none}
.ht-ci.feat{border-color:rgba(46,230,182,.5);background:linear-gradient(135deg,rgba(46,230,182,.14),rgba(18,30,52,.7))}
.ht-ci.on{outline:2px solid var(--acc,#2EE6B6);outline-offset:-2px}
.ht-cic{width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:rgba(120,200,255,.12);font-weight:700;overflow:hidden;flex:0 0 30px}.ht-cic img{width:30px;height:30px;object-fit:cover}
.ht-cn{display:flex;flex-direction:column;line-height:1.2}.ht-cn b{font-size:14px}.ht-cn small{font-size:12.5px;color:var(--mut,#8197B5)}
.ht-cc .ht-c{margin:0}
/* grid */
.ht-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
@media(max-width:980px){.ht-grid{grid-template-columns:minmax(0,1fr)}}
.ht-main{min-width:0}
.ht-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:2px 0 10px}
.ht-id{display:flex;align-items:center;gap:10px;min-width:0}.ht-id img,.ht-id .ph{width:44px;height:44px;border-radius:50%;object-fit:cover}
.ht-id h1{font-size:20px;margin:0;line-height:1.2}.ht-id h1 span{color:var(--mut,#8197B5);font-weight:500;font-size:14px}.ht-id small{color:var(--mut,#8197B5);font-size:13px}
.ht-px{display:flex;align-items:baseline;gap:4px;margin-left:auto}.ht-px b{font-size:22px}.ht-px small{color:var(--mut,#8197B5);font-size:12px}
.ht-pn{display:flex;gap:8px}.ht-nb{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:64px;padding:0 12px;border-radius:12px;border:1px solid var(--line,rgba(120,200,255,.14));color:var(--txt,#E6F1FF);text-decoration:none;font-size:13px;background:rgba(18,30,52,.6)}
@media(max-width:600px){.ht-px{margin-left:0;width:100%}.ht-pn{width:100%}.ht-nb{flex:1}}
.ht-chart{position:relative;width:100%;height:clamp(360px,58vh,560px);border-radius:16px 16px 0 0;overflow:hidden;background:#0b1424;border:1px solid var(--line,rgba(120,200,255,.14));border-bottom:0}
.ht-chart iframe{width:100%;height:100%;border:0;display:block}
.ht-chart .ht-mut{padding:16px}
@media(max-width:600px){.ht-chart{height:380px}}
.ht-mut{color:var(--mut,#8197B5);font-size:13px}
/* trade bar */
.htb{width:100%;background:linear-gradient(180deg,rgba(16,30,54,.96),rgba(10,20,38,.98));border:1px solid rgba(46,230,182,.35);border-radius:0 0 16px 16px;padding:12px;position:relative;z-index:2}
.htb-ext{border-radius:16px;margin:10px 0 14px}
.htb-row{display:grid;grid-template-columns:auto minmax(150px,1.2fr) minmax(130px,1fr) auto auto;gap:10px;align-items:stretch}
.htb-side{display:flex;background:rgba(6,11,23,.6);border-radius:12px;padding:3px;gap:3px;align-self:center}
.htb-side button{min-height:44px;min-width:64px;border:0;border-radius:10px;background:transparent;color:var(--mut,#8197B5);font-weight:700;font-size:14px;cursor:pointer;touch-action:manipulation}
.htb-side button.on[data-s=buy]{background:rgba(46,230,182,.18);color:var(--up,#2EE6B6)}.htb-side button.on[data-s=sell]{background:rgba(255,92,122,.16);color:var(--dn,#FF5C7A)}
.htb-amt,.htb-q{display:flex;flex-direction:column;justify-content:center;background:rgba(6,11,23,.55);border:1px solid var(--line,rgba(120,200,255,.14));border-radius:12px;padding:6px 12px;min-height:56px;min-width:0}
.htb-amt:focus-within{border-color:var(--acc,#2EE6B6)}
.htb-lbl{font-size:11px;color:var(--mut,#8197B5);text-transform:uppercase;letter-spacing:.04em}
.htb-in{display:flex;align-items:center;gap:8px}.htb-in input{flex:1;min-width:0;width:100%;background:transparent!important;border:0!important;box-shadow:none!important;color:var(--txt,#E6F1FF);font-size:18px;font-weight:700;padding:2px 0;outline:none}
.htb-unit{font-size:13px;color:var(--mut,#8197B5);white-space:nowrap}
.htb-out{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.htb-imp{font-size:11px;color:var(--mut,#8197B5)}.htb-imp.hi{color:var(--warn,#FFC857)}
.htb-w,.htb-go{min-height:56px;padding:0 18px;border-radius:12px;font-weight:800;font-size:15px;cursor:pointer;touch-action:manipulation;white-space:nowrap}
.htb-w{background:transparent;border:1px solid var(--acc,#2EE6B6);color:var(--acc,#2EE6B6)}.htb-w.con{border-color:var(--line,rgba(120,200,255,.25));color:var(--txt,#E6F1FF);max-width:180px;overflow:hidden;text-overflow:ellipsis}
.htb-go{background:var(--acc,#2EE6B6);border:0;color:#04121C;min-width:140px}.htb-go.sell{background:var(--dn,#FF5C7A);color:#fff}
.htb-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.htb-chips button{min-height:44px;padding:0 14px;border-radius:999px;border:1px solid var(--line,rgba(120,200,255,.18));background:rgba(18,30,52,.6);color:var(--txt,#E6F1FF);font-size:13px;cursor:pointer;touch-action:manipulation}
.htb-note{font-size:12px;color:var(--mut,#8197B5);margin:10px 2px 0}
.htb-panel{margin-top:12px;border-top:1px solid var(--line,rgba(120,200,255,.14));padding-top:10px}
.htb-ph{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.htb-close{min-width:44px;min-height:44px;border:0;background:none;color:var(--txt,#E6F1FF);font-size:18px;cursor:pointer}
.htb-panel .v2box{max-width:520px;margin:0 auto}.htb-det{max-width:520px;margin:10px auto 0}.htb-det summary{min-height:44px;display:flex;align-items:center;cursor:pointer;color:var(--acc,#2EE6B6)}
.htb-lifi{min-height:560px;max-width:520px;margin:0 auto}
@media(max-width:860px){.htb-row{grid-template-columns:1fr 1fr}.htb-side{grid-column:1/-1;align-self:stretch}.htb-side button{flex:1}.htb-amt,.htb-q{grid-column:span 1}.htb-w,.htb-go{min-height:52px}}
@media(max-width:420px){.htb-row{grid-template-columns:1fr}.htb-amt,.htb-q{grid-column:1/-1}.htb-w{order:5}.htb-go{order:4}}
/* info + side */
.ht-info{margin-top:16px;background:var(--card,rgba(18,30,52,.62));border:1px solid var(--line,rgba(120,200,255,.14));border-radius:16px;padding:14px}
.ht-info h2,.ht-side h2{font-size:16px;margin:0 0 10px}
.ht-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}@media(max-width:600px){.ht-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ht-stats div{background:rgba(6,11,23,.45);border-radius:10px;padding:8px 10px;min-width:0}.ht-stats small{display:block;font-size:11px;color:var(--mut,#8197B5)}.ht-stats b{font-size:14px;white-space:nowrap}.ht-stats .ht-c{margin:0;font-size:14px}
.ht-ca{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}.ht-ca small{color:var(--mut,#8197B5)}.ht-ca code{font-size:12px;word-break:break-all;flex:1 1 220px;min-width:0}
.ht-ca button,.ht-ca a{min-height:44px;display:inline-flex;align-items:center;padding:0 12px;border-radius:10px;border:1px solid var(--line,rgba(120,200,255,.2));background:rgba(18,30,52,.6);color:var(--txt,#E6F1FF);text-decoration:none;font-size:13px;cursor:pointer}
.ht-links,.ht-more-l{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.ht-links a{min-height:44px;display:inline-flex;align-items:center;padding:0 12px;border-radius:999px;background:rgba(120,200,255,.08);color:var(--txt,#E6F1FF);text-decoration:none;font-size:13px}
.ht-more-l .btn{min-height:44px;display:inline-flex;align-items:center}
.ht-side{background:var(--card,rgba(18,30,52,.62));border:1px solid var(--line,rgba(120,200,255,.14));border-radius:16px;padding:12px;position:sticky;top:170px}
@media(max-width:980px){.ht-side{position:static}}
.ht-tr{display:grid;grid-template-columns:20px 26px 1fr auto;gap:8px;align-items:center;min-height:48px;padding:6px;border-radius:10px;color:var(--txt,#E6F1FF);text-decoration:none}.ht-tr:hover{background:rgba(46,230,182,.07)}
.ht-tr img,.ht-tr .ph{width:26px;height:26px;border-radius:50%}.ht-n{font-size:12px;color:var(--mut,#8197B5)}.ht-tn{display:flex;flex-direction:column;min-width:0}.ht-tn b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ht-tn small{font-size:11px;color:var(--mut,#8197B5)}
.ht-tp{display:flex;flex-direction:column;align-items:flex-end;font-size:12.5px}.ht-tp .ht-c{margin:0}
.ht-all{display:flex;align-items:center;justify-content:center;min-height:44px;margin-top:6px;color:var(--acc,#2EE6B6);text-decoration:none}
.ht-links2{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-top:18px}.ht-links2 a{min-height:52px;display:flex;align-items:center;justify-content:center;border-radius:14px;background:var(--card,rgba(18,30,52,.62));border:1px solid var(--line,rgba(120,200,255,.14));color:var(--txt,#E6F1FF);text-decoration:none;font-weight:600}
.ht-nfa{font-size:12px;color:var(--mut,#8197B5);margin-top:16px;text-align:center}
.ht-hero{margin-top:18px}
.ht-pnav{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:14px}.ht-pnav>span{font-size:13px;color:var(--mut,#8197B5)}.ht-pnav .ht-pn{display:flex;gap:8px;flex:1;flex-wrap:wrap}
@media(max-width:600px){.ht-pnav .ht-pn .ht-nb{flex:1 1 30%}}
#cbh{order:3}
.nw{white-space:nowrap}
#app>.ht{padding-top:4px}
@media(max-width:860px){.htb-chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.htb-chips button{padding:0 4px}}
/* mobile tap targets (QA 9 Nov 2026): grow hit areas to 44px without changing the look */
@media(max-width:860px){header .walb{min-height:44px}header .burg{min-width:44px;min-height:44px}.ch-tabs button,.mtabs button{min-height:44px}
.tcb,.fm-x,#lgSw{position:relative}.tcb::after,.fm-x::after,#lgSw::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:max(100%,44px);transform:translate(-50%,-50%)}}
