/* Ship's Clock — guide & history pages (extends sc-site.css) */
.navlinks{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.navlinks a{font-family:'Cinzel',serif;font-size:11px;font-weight:700;letter-spacing:.10em;text-transform:uppercase;color:var(--muted);padding:9px 12px;border-radius:10px;border:1px solid transparent;text-decoration:none!important;white-space:nowrap}
.navlinks a:hover{color:var(--brass2);background:rgba(212,160,23,.06)}
.navlinks a[aria-current="page"]{color:var(--brass2);border-color:rgba(212,160,23,.35);background:rgba(212,160,23,.08)}
@media(max-width:760px){.topbar{padding:10px 14px;gap:8px}.navlinks a{padding:7px 8px;font-size:10px;letter-spacing:.06em}.nav-badges{display:none!important}.brand-sub{display:none}}

.crumbs{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.08em;color:var(--muted);padding:22px 0 0}
.crumbs a{color:var(--muted)} .crumbs a:hover{color:var(--brass2)}

.article-hero{display:grid;grid-template-columns:1.15fr .85fr;gap:32px;align-items:center;padding:34px 0 30px}
@media(max-width:900px){.article-hero{grid-template-columns:1fr;padding:24px 0 16px}}
.article-hero .lead{font-size:17px}
.byline{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:-6px;margin-bottom:22px}

.prose{max-width:74ch}
.prose p{font-size:17.5px;line-height:1.8;color:rgba(232,240,250,.86);margin:0 0 18px}
.prose p strong,.prose li strong{color:var(--brass2);font-weight:normal}
.prose h3{font-family:'Cinzel',serif;font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--brass2);margin:26px 0 10px}
.prose ul,.prose ol{margin:0 0 18px 1.2em;color:rgba(232,240,250,.86);font-size:17px;line-height:1.75}
.prose li{margin-bottom:6px}
.prose a{border-bottom:1px solid rgba(240,208,96,.35)}
.prose a:hover{text-decoration:none;border-bottom-color:var(--brass2)}
.section .prose h2,.section h2{margin-bottom:14px}

.answer{border-left:3px solid var(--brass);background:rgba(212,160,23,.06);padding:16px 20px;border-radius:0 12px 12px 0;margin:6px 0 22px;font-size:18px;line-height:1.75;color:var(--ice)}
.answer b{color:var(--brass2);font-weight:normal}

.toc{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 6px}
.toc a{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:8px 12px;border-radius:999px;border:1px solid var(--border2);background:rgba(255,255,255,.03);color:var(--ice)}
.toc a:hover{border-color:rgba(212,160,23,.4);text-decoration:none;color:var(--brass2)}

.two{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}
.two.flip>:first-child{order:2}
@media(max-width:860px){.two{grid-template-columns:1fr}.two.flip>:first-child{order:0}}

figure.fig{margin:0;border:1px solid var(--border2);border-radius:16px;background:rgba(4,8,15,.55);padding:16px}
figure.fig svg{display:block;width:100%;height:auto}
figure.fig figcaption{font-size:14px;color:var(--muted);margin-top:10px;line-height:1.55;text-align:center}

/* live bell widget */
.bellnow{border:1px solid rgba(212,160,23,.35);border-radius:22px;padding:22px;background:radial-gradient(500px 260px at 50% 0,rgba(212,160,23,.14),transparent 65%),linear-gradient(180deg,rgba(12,22,38,.92),rgba(4,8,15,.92));box-shadow:0 30px 80px rgba(0,0,0,.6);text-align:center}
.bellnow .k{font-family:'Cinzel',serif;font-size:10px;font-weight:900;letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
.bellnow .big{font-family:'Cinzel Decorative','Cinzel',serif;font-size:clamp(34px,6vw,52px);color:var(--brass2);line-height:1.05;margin:10px 0 4px;text-shadow:0 0 40px rgba(212,160,23,.3)}
.bellnow .dots{display:flex;justify-content:center;gap:6px;margin:10px 0 12px;min-height:22px;flex-wrap:wrap}
.bellnow .dots i{width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3c0,#d4a017 55%,#7a5a08);box-shadow:0 0 12px rgba(212,160,23,.45);display:inline-block}
.bellnow .dots i.gap{background:none;box-shadow:none;width:8px}
.bellnow .dots i.on{animation:ding .5s ease-out}
@keyframes ding{0%{transform:scale(1.6);filter:brightness(1.8)}100%{transform:scale(1)}}
.bellnow .meta{color:var(--muted);font-size:15px;line-height:1.6}
.bellnow .meta b{color:var(--ice);font-weight:normal}
.bellnow .row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px}
.bellnow select{background:#060e1c;color:var(--ice);border:1px solid var(--border2);border-radius:10px;padding:10px;font-family:'Cinzel',serif;font-size:12px}
.bellnow .tiny{font-size:12px;color:var(--muted);margin-top:12px}

/* strike-pattern figure */
.strikes{display:grid;gap:8px}
.strikes .r{display:grid;grid-template-columns:84px 1fr 120px;align-items:center;gap:10px;font-family:'Cinzel',serif;font-size:12px;color:var(--muted)}
.strikes .r b{color:var(--brass2);font-weight:700}
.strikes .r .p{display:flex;gap:4px;align-items:center}
.strikes .r .p i{width:13px;height:13px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3c0,#d4a017 55%,#7a5a08)}
.strikes .r .p i.g{width:12px;background:none}
.strikes .r .s{font-family:'IM Fell English',serif;font-style:italic;font-size:13px;color:rgba(232,240,250,.7)}
@media(max-width:520px){.strikes .r{grid-template-columns:62px 1fr}.strikes .r .s{display:none}}

/* watch cards */
.watches{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:8px}
.wcard{border:1px solid var(--border2);border-radius:14px;padding:16px;background:rgba(255,255,255,.025);border-top:3px solid var(--c,#d4a017)}
.wcard.now{box-shadow:0 0 0 1px rgba(255,114,0,.6),0 0 30px rgba(255,114,0,.15)}
.wcard .n{font-family:'Cinzel',serif;font-weight:900;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--ice)}
.wcard .t{font-family:'Cinzel',serif;font-size:12px;color:var(--brass2);margin:2px 0 8px}
.wcard p{font-size:14.5px;color:var(--muted);line-height:1.55}

/* full chart */
.chartwrap{overflow-x:auto;border-radius:14px}
table.chart{width:100%;border-collapse:separate;border-spacing:0;font-family:'Cinzel',serif;font-size:12.5px;border:1px solid rgba(255,255,255,.1);border-radius:14px;overflow:hidden;background:rgba(7,14,24,.5)}
table.chart th,table.chart td{padding:8px 12px;border-bottom:1px solid rgba(255,255,255,.06);text-align:left;white-space:nowrap}
table.chart thead th{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass2);background:rgba(212,160,23,.08)}
table.chart td.b{color:var(--brass2)}
table.chart tr.eight td{background:rgba(212,160,23,.07)}
table.chart tr.eight td.b{font-weight:900}
table.chart tr.now td{background:rgba(255,114,0,.16)}
table.chart td.w{color:var(--muted)}
.chartcols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:820px){.chartcols{grid-template-columns:1fr}}

/* compare table */
table.cmp{width:100%;border-collapse:collapse;font-size:15px}
table.cmp th,table.cmp td{border-bottom:1px solid rgba(255,255,255,.08);padding:10px 12px;text-align:left;vertical-align:top}
table.cmp th{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--brass2)}
table.cmp td{color:rgba(232,240,250,.84)}

/* FAQ */
.faq details{border:1px solid var(--border2);border-radius:14px;background:rgba(255,255,255,.025);margin-bottom:10px;overflow:hidden}
.faq summary{cursor:pointer;list-style:none;padding:16px 18px;font-family:'Cinzel',serif;font-size:14px;font-weight:700;letter-spacing:.04em;color:var(--ice);display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--brass2);font-size:18px;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details>div{padding:0 18px 16px;color:rgba(232,240,250,.84);font-size:16px;line-height:1.7}

/* screenshots strip */
.shots{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 14px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.shots img{flex:0 0 auto;width:210px;height:auto;border-radius:18px;border:1px solid rgba(212,160,23,.22);box-shadow:0 18px 40px rgba(0,0,0,.55);scroll-snap-align:start;background:#060e1c}
@media(max-width:560px){.shots img{width:62vw}}
.shots-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap}
.proof{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin:4px 0 18px;font-family:'Cinzel',serif;font-size:12px;letter-spacing:.06em;color:var(--muted)}
.proof b{color:var(--brass2);font-weight:900}
.proof span{display:inline-flex;align-items:center;gap:8px}

/* timeline */
.tl{position:relative;margin:10px 0 0;padding-left:34px}
.tl::before{content:"";position:absolute;left:11px;top:4px;bottom:4px;width:2px;background:linear-gradient(180deg,rgba(212,160,23,.7),rgba(31,140,180,.5))}
.tl .ev{position:relative;margin-bottom:22px}
.tl .ev::before{content:"";position:absolute;left:-30px;top:6px;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3c0,#d4a017 55%,#7a5a08);box-shadow:0 0 0 4px rgba(4,8,15,1),0 0 16px rgba(212,160,23,.5)}
.tl .yr{font-family:'Cinzel Decorative','Cinzel',serif;font-size:18px;color:var(--brass2)}
.tl .ti{font-family:'Cinzel',serif;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ice);margin:2px 0 4px}
.tl p{font-size:15.5px;color:var(--muted);line-height:1.65;max-width:70ch}

.sources{font-size:14px;color:var(--muted);line-height:1.7}
.sources li{margin-bottom:4px}
.sources a{color:var(--muted);border-bottom:1px solid rgba(143,168,196,.3)}

.pull{font-family:'Cinzel Decorative',serif;color:var(--brass2);font-size:clamp(18px,2.6vw,24px);line-height:1.45;text-align:center;max-width:46ch;margin:6px auto}
.next{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:700px){.next{grid-template-columns:1fr}}
.next a{display:block;border:1px solid var(--border);border-radius:16px;padding:20px;background:rgba(212,160,23,.05);text-decoration:none!important}
.next a:hover{background:rgba(212,160,23,.1)}
.next .k{font-family:'Cinzel',serif;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass)}
.next .h{font-family:'Cinzel',serif;font-size:17px;font-weight:700;color:var(--ice);margin:6px 0 4px}
.next p{font-size:14px;color:var(--muted)}
.two>*,.chartcols>*,.article-hero>*{min-width:0}
.section-inner{min-width:0;overflow-wrap:anywhere}
.bottom-cta-btns{flex-wrap:wrap;max-width:100%}.bottom-cta>*{min-width:0}
