:root {
    --paper:#F6F1E8; --paper-deep:#EBE4D6; --surface:#FFFBF4; --surface-2:#E8E0D2;
    --ink:#2A3B4A; --title:#0E2A4A; --muted:#5C6B78; --soft:#8A8074;
    --blue:#12324F; --midnight:#0A1E33; --gold:#C4A574; --green:#6A9A8B; --terracotta:#C17B5A;
    --border:rgba(18,50,79,.16); --accent-border:rgba(196,165,116,.45);
    --shadow:0 16px 36px rgba(10,30,51,.10); --radius:14px; --shell:min(1200px,calc(100% - 32px));
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif; font-size:16px; line-height:1.78; overflow-x:hidden; }
body.no-scroll { overflow:hidden; }
a { color:var(--blue); text-decoration:none; }
a:hover { color:var(--terracotta); }
a:focus-visible,button:focus-visible,input:focus-visible { outline:3px solid rgba(106,154,139,.48); outline-offset:3px; }
button,input { font:inherit; }
button { cursor:pointer; }
img { max-width:100%; }
.shell { width:var(--shell); margin-inline:auto; }
.skip-link { position:fixed; z-index:999; left:16px; top:-80px; background:var(--midnight); color:var(--paper); padding:10px 14px; border-radius:8px; }
.skip-link:focus { top:12px; }
.top-fixed { position:fixed; inset:0 0 auto 0; z-index:100; box-shadow:0 5px 20px rgba(10,30,51,.05); }
.tide-line { height:22px; background:var(--midnight); color:var(--paper); font-size:12px; }
.tide-inner { height:22px; display:flex; align-items:center; justify-content:space-between; }
.text-button { min-height:22px; min-width:44px; position:relative; border:0; background:transparent; color:var(--paper); padding:0 4px; }
.text-button::after { content:""; position:absolute; inset:-11px -8px; }
.harbor-bar { height:64px; background:var(--paper); border-bottom:1px solid var(--border); }
.harbor-inner { height:64px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; }
.brand-link { display:inline-flex; align-items:center; justify-self:start; min-height:44px; }
.site-logo { display:block; width:auto; height:34px; max-width:170px; object-fit:contain; object-position:left center; }
.site-logo-text { color:var(--title); font-weight:800; font-size:24px; letter-spacing:.04em; }
.manifest-button,.app-link { min-height:44px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px; padding:0 16px; }
.manifest-button { border:1px solid var(--accent-border); background:var(--surface); color:var(--blue); font-weight:700; }
.app-link { justify-self:end; background:linear-gradient(135deg,#1A4A72 0%,#12324F 55%,#0A1E33 100%); color:var(--paper); font-weight:700; }
.app-link:hover { color:var(--paper); filter:brightness(1.05); }
.stack-strip { height:44px; background:var(--surface-2); border-bottom:1px solid var(--accent-border); }
.stack-inner { height:44px; display:flex; align-items:center; gap:8px; overflow:hidden; }
.stack-inner a { color:var(--title); height:44px; display:inline-flex; align-items:center; padding:5px 10px; border-radius:7px; white-space:nowrap; }
.stack-inner a.active { background:var(--blue); color:var(--paper); }
.site-main { padding-top:150px; min-height:60vh; }
.page-hero,.home-cover { margin:28px auto 24px; }
.eyebrow { display:inline-block; margin:0 0 8px; color:var(--terracotta); font-weight:800; letter-spacing:.08em; font-size:13px; }
h1,h2,h3 { color:var(--title); line-height:1.28; margin-top:0; }
h1 { font-size:clamp(28px,3vw,32px); margin-bottom:14px; }
h2 { font-size:clamp(22px,2.4vw,27px); }
h3 { font-size:18px; }
p { margin:0 0 1em; }
.lead { max-width:880px; font-size:17px; color:var(--muted); }
.media-slot { width:100%; background:linear-gradient(145deg,var(--surface-2),var(--paper)); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; min-height:190px; display:flex; align-items:center; justify-content:center; }
.media-slot img { display:block; width:100%; height:100%; object-fit:contain; object-position:center; }
.media-slot.banner { max-height:300px; aspect-ratio:16/7.5; background:var(--midnight); }
.media-slot.banner.is-empty::after { content:"st站 · ST STATION"; color:var(--paper); font-weight:800; font-size:clamp(24px,5vw,48px); letter-spacing:.06em; }
.media-slot.column { height:220px; }
.media-slot.feature { height:260px; }
.media-slot.app-visual { max-height:420px; min-height:320px; }
.media-slot.app-visual img { max-height:420px; width:auto; }
.home-intro { margin-top:18px; }
.home-intro h1 { margin:2px 0 10px; }
.action-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.btn-primary,.btn-secondary { min-height:44px; padding:9px 16px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; font-weight:800; }
.btn-primary { background:linear-gradient(135deg,#1A4A72 0%,#12324F 55%,#0A1E33 100%); color:var(--paper); }
.btn-primary:hover { color:var(--paper); }
.btn-secondary { background:var(--surface); border:1px solid var(--accent-border); color:var(--blue); }
.section-block { width:var(--shell); margin:42px auto; }
.section-heading { display:flex; gap:18px; align-items:end; justify-content:space-between; margin-bottom:18px; }
.section-heading p { color:var(--muted); max-width:690px; margin:0; }
.ticket-grid,.card-grid,.status-grid,.number-grid,.footer-groups { display:grid; gap:16px; }
.ticket-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.ticket-card,.info-card,.status-card,.number-card,.article-card,.faq-item,.note-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; }
.ticket-card .body,.info-card,.status-card,.number-card,.article-card,.faq-item,.note-card { padding:18px; }
.ticket-card p,.info-card p,.status-card p,.number-card p,.article-card p,.faq-item p,.note-card p { color:var(--ink); }
.ticket-card .media-slot { border:0; border-radius:0; height:200px; min-height:180px; background:var(--paper-deep); }
.ticket-card .more { font-weight:800; }
.split-feature { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:22px; align-items:center; }
.number-list { display:grid; gap:10px; }
.number-item { display:grid; grid-template-columns:58px 1fr; gap:12px; align-items:start; padding:14px 0; border-top:1px solid var(--border); }
.number-item:first-child { border-top:0; }
.number-item .num { color:var(--gold); font-weight:900; font-size:30px; line-height:1; }
.vertical-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.vertical-grid article { padding:18px; background:var(--surface); border:1px solid var(--border); border-radius:12px; }
.status-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.status-card { border-top:4px solid var(--green); }
.status-card:nth-child(2) { border-top-color:var(--gold); }
.status-card:nth-child(3) { border-top-color:var(--terracotta); }
.status-card:nth-child(4) { border-top-color:var(--blue); }
.steps { counter-reset:step; display:grid; gap:14px; }
.step { position:relative; padding:18px 18px 18px 76px; background:var(--surface); border:1px solid var(--border); border-radius:12px; }
.step::before { counter-increment:step; content:counter(step,decimal-leading-zero); position:absolute; left:18px; top:17px; color:var(--gold); font-size:28px; font-weight:900; }
.editor-note { border-left:4px solid var(--gold); background:var(--surface); padding:20px; border-radius:0 12px 12px 0; }
.editor-note .label { color:var(--terracotta); font-weight:900; }
.link-inline { font-weight:800; border-bottom:1px solid var(--accent-border); }
.content-shell { width:var(--shell); margin:0 auto 52px; }
.prose-section { margin:30px 0; }
.prose-section h2 { margin-bottom:10px; }
.card-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.card-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.card-grid .article-card { height:100%; }
.index-list { display:grid; gap:12px; }
.index-row { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:16px; display:grid; grid-template-columns:150px 1fr auto; gap:16px; align-items:center; }
.index-row .tag { color:var(--green); font-weight:800; }
.index-row a { min-height:44px; display:inline-flex; align-items:center; font-weight:800; }
.notice { background:var(--paper-deep); border:1px solid var(--accent-border); border-radius:12px; padding:16px 18px; color:var(--title); }
.signal-list { display:grid; gap:16px; }
.signal-item { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:18px; display:grid; grid-template-columns:80px 1fr auto; gap:16px; align-items:center; }
.signal-mark { width:58px; height:58px; border-radius:12px; display:grid; place-items:center; background:var(--blue); color:var(--paper); font-weight:900; }
.longline { border-left:3px solid var(--gold); padding-left:22px; }
.longline section { margin:0 0 26px; }
.list-cards { display:grid; gap:12px; }
.list-card { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:18px; }
.big-number { color:var(--gold); font-size:40px; font-weight:900; line-height:1; margin-bottom:8px; }
.letter { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:22px; margin:18px 0; }
.letter header { display:flex; justify-content:space-between; gap:12px; margin-bottom:10px; }
.letter .opinion { color:var(--terracotta); font-weight:900; }
.app-layout { display:grid; grid-template-columns:minmax(280px,.75fr) minmax(0,1.25fr); gap:28px; align-items:center; }
.app-icon-wrap { display:flex; align-items:center; gap:14px; margin:16px 0; }
.app-icon { width:64px; height:64px; object-fit:contain; border-radius:14px; }
.pill-set { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 18px; }
.pill { padding:5px 10px; border:1px solid var(--accent-border); background:var(--surface); border-radius:8px; color:var(--title); }
.faq-list { display:grid; gap:14px; }
.faq-item h2 { font-size:19px; margin-bottom:8px; }
.policy section { padding:20px 0; border-top:1px solid var(--border); }
.policy section:first-child { border-top:0; }
.site-footer { background:var(--midnight); color:var(--paper); padding:46px 0 26px; }
.footer-top { display:grid; grid-template-columns:1.1fr 2fr; gap:34px; }
.footer-brand { color:var(--paper); }
.footer-brand strong { display:block; font-size:22px; }
.footer-brand span { color:#D8C9AE; }
.footer-brand p { margin-top:14px; color:#E7E0D6; max-width:430px; }
.footer-logo-link { display:inline-flex; margin-bottom:12px; }
.footer-logo { filter:none; }
.footer-groups { grid-template-columns:repeat(4,minmax(0,1fr)); }
.footer-groups section { display:flex; flex-direction:column; gap:7px; }
.footer-groups h2 { color:var(--paper); font-size:16px; margin-bottom:4px; }
.footer-groups a { color:#F1E9DD; min-height:44px; display:flex; align-items:center; }
.footer-groups a:hover { color:#D8B98A; }
.footer-note { border-top:1px solid rgba(246,241,232,.16); margin-top:30px; padding-top:20px; color:#D9D4CC; font-size:14px; }
.overlay { position:fixed; inset:0; z-index:110; background:rgba(10,30,51,.55); opacity:0; visibility:hidden; pointer-events:none; transition:.22s ease; }
.overlay.open { opacity:1; visibility:visible; pointer-events:auto; }
.manifest-drawer { position:fixed; z-index:120; top:0; right:0; width:min(400px,86vw); height:100dvh; background:var(--surface); box-shadow:-18px 0 48px rgba(10,30,51,.18); transform:translateX(102%); visibility:hidden; pointer-events:none; transition:transform .24s ease,visibility .24s; display:flex; flex-direction:column; }
.manifest-drawer.open { transform:translateX(0); visibility:visible; pointer-events:auto; }
.drawer-head { min-height:76px; padding:12px 16px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; gap:12px; }
.drawer-brand { display:flex; align-items:center; gap:10px; }
.drawer-brand div { display:flex; flex-direction:column; line-height:1.25; }
.drawer-brand span { font-size:11px; color:var(--muted); }
.drawer-logo { max-width:110px; height:30px; }
.icon-close,#searchClose { min-height:44px; min-width:56px; border:1px solid var(--accent-border); background:var(--paper); color:var(--blue); border-radius:9px; }
.drawer-scroll { overflow-y:auto; padding:10px 16px 28px; }
.drawer-group { padding:14px 0; border-bottom:1px solid var(--border); }
.drawer-group:last-child { border-bottom:0; }
.drawer-group h2 { font-size:15px; color:var(--terracotta); margin-bottom:8px; }
.drawer-group a { display:block; padding:9px 0; color:var(--title); }
.drawer-group a strong,.drawer-group a span { display:block; }
.drawer-group a span { color:var(--muted); font-size:13px; line-height:1.45; margin-top:2px; }
.search-layer { position:fixed; z-index:115; top:86px; left:0; right:0; visibility:hidden; opacity:0; pointer-events:none; transform:translateY(-8px); transition:.2s ease; }
.search-layer.open { visibility:visible; opacity:1; pointer-events:auto; transform:translateY(0); }
.search-card { width:min(760px,calc(100% - 32px)); margin:14px auto 0; background:var(--surface); border:1px solid var(--accent-border); border-radius:14px; box-shadow:var(--shadow); padding:18px; }
.search-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:12px; }
.search-card label { display:block; color:var(--muted); margin-bottom:8px; }
.search-card input { width:100%; height:46px; border:1px solid var(--border); border-radius:9px; background:var(--paper); color:var(--title); padding:0 13px; }
.search-presets { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.search-presets a { min-height:44px; display:inline-flex; align-items:center; padding:0 12px; background:var(--paper-deep); border-radius:8px; color:var(--blue); }
.mobile-bottom { display:none; }
.muted { color:var(--muted); }
.kicker-line { width:76px; height:3px; background:linear-gradient(90deg,var(--gold),var(--green),var(--terracotta)); margin-bottom:14px; border-radius:4px; }
@media (max-width:900px) {
    .ticket-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .status-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .footer-top { grid-template-columns:1fr; }
    .split-feature,.app-layout { grid-template-columns:1fr; }
    .app-layout .media-slot { max-width:520px; margin-inline:auto; }
    .index-row { grid-template-columns:120px 1fr; }
    .index-row a { grid-column:2; }
    .signal-item { grid-template-columns:70px 1fr; }
    .signal-item > a { grid-column:2; }
}
@media (max-width:700px) {
    :root { --shell:calc(100% - 32px); }
    body { line-height:1.72; padding-bottom:calc(50px + env(safe-area-inset-bottom)); }
    .stack-strip { display:none; }
    .site-main { padding-top:106px; }
    .harbor-inner { grid-template-columns:1fr auto 1fr; gap:8px; }
    .site-logo { max-width:112px; height:30px; }
    .site-logo-text { font-size:21px; }
    .manifest-button,.app-link { padding:0 10px; font-size:14px; }
    .home-cover,.page-hero { margin-top:20px; }
    .media-slot.banner { aspect-ratio:16/9; }
    .ticket-grid,.card-grid,.card-grid.two,.status-grid,.vertical-grid { grid-template-columns:1fr; }
    .ticket-card .media-slot { height:190px; }
    .section-block { margin:34px auto; }
    .section-heading { display:block; }
    .section-heading p { margin-top:8px; }
    .footer-groups { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .mobile-bottom { position:fixed; z-index:90; left:0; right:0; bottom:0; height:calc(50px + env(safe-area-inset-bottom)); padding-bottom:env(safe-area-inset-bottom); background:var(--surface); border-top:1px solid var(--border); display:grid; grid-template-columns:repeat(5,1fr); }
    .mobile-bottom a { min-width:0; display:flex; align-items:center; justify-content:center; color:var(--title); font-size:13px; min-height:50px; }
    .mobile-bottom a.active { background:var(--blue); color:var(--paper); }
    .search-layer { top:86px; }
    .search-card { margin-top:8px; width:calc(100% - 24px); }
    .number-item { grid-template-columns:50px 1fr; }
    .footer-note { padding-bottom:12px; }
}
@media (max-width:420px) {
    .tide-inner { font-size:11px; }
    .harbor-inner { gap:5px; }
    .manifest-button,.app-link { padding:0 8px; font-size:13px; }
    .site-logo { max-width:88px; }
    .footer-groups { grid-template-columns:1fr 1fr; gap:20px 14px; }
    .signal-item { grid-template-columns:58px 1fr; gap:10px; }
    .signal-mark { width:52px; height:52px; }
}

.brand-statement { background:var(--surface); border:1px solid var(--accent-border); border-radius:16px; padding:clamp(18px,3vw,32px); box-shadow:var(--shadow); }
.brand-statement .prose-section:first-child { margin-top:0; }