/* Sales Kit Hub only. The reference informs presentation, never business behavior. */
.sk-hub { margin:0; background:#f2f8fb; color:#0f1e3a; font:16px/1.65 Arial,sans-serif; font-synthesis:none; --sk-muted:#526077; --sk-red:#d80732; --sk-action:#e60033; --sk-line:#dfe8ef; background-image:linear-gradient(120deg,#f7fbfd,#eef6fa 55%,#f7fbfd); }
.sk-hub:lang(ja) { font-family:"Hiragino Sans","Yu Gothic","Noto Sans JP",sans-serif; }
.sk-hub:lang(th) { font-family:Thonburi,"Noto Sans Thai",Tahoma,sans-serif; line-height:1.8; }
.sk-hub * { box-sizing:border-box; }
.sk-hub :is(h1,h2,h3,p) { margin:0; }
.sk-hub img { display:block; max-width:100%; height:auto; }
.sk-hub a { color:inherit; text-decoration:none; touch-action:manipulation; }
.sk-hub :is(a,summary):focus-visible { outline:3px solid #b31639; outline-offset:4px; }
.sk-hub svg { width:24px; height:24px; flex-shrink:0; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.sk-hub .sk-skip { position:absolute; top:8px; left:12px; z-index:30; padding:12px; background:white; transform:translateY(-200%); }
.sk-hub .sk-skip:focus { transform:none; }
.sk-main { max-width:1120px; padding:34px 28px 16px; margin:auto; }
.sk-hero { display:flex; justify-content:space-between; align-items:center; gap:28px; padding:0 10px; margin-bottom:28px; }
.sk-hero>div { min-width:0; }
.sk-eyebrow { color:var(--sk-red); font-size:14px; font-weight:700; }
.sk-hero h1 { font-size:42px; line-height:1.4; margin-top:7px; }
.sk-phrase { display:inline-block; max-width:100%; }
.sk-intro { color:var(--sk-muted); font-size:18px; line-height:1.7; margin-top:9px!important; text-wrap:pretty; }
.sk-hero>img { width:108px; flex-shrink:0; }
.sk-guide { display:grid; grid-template-columns:minmax(0,1fr) 176px; align-items:center; gap:24px; padding:23px 28px; border:1px solid #ffcd38; border-radius:17px; background:linear-gradient(110deg,#fff9df,#fff5ce); box-shadow:inset 0 0 0 2px #ffffff70; }
.sk-guide-copy { min-width:0; }
.sk-guide-label { color:var(--sk-red); font-size:14px; font-weight:700; }
.sk-guide h2 { font-size:24px; line-height:1.6; margin-top:4px; }
.sk-guide p { color:#5b512f; font-size:16px; margin-top:4px; }
.sk-guide-cta { display:inline-flex; align-items:center; justify-content:center; gap:18px; max-width:100%; min-height:46px; padding:10px 22px; margin-top:15px; border-radius:9px; color:white; background:var(--sk-action); box-shadow:0 3px 0 #9a002012; font-size:16px; font-weight:700; line-height:1.6; }
.sk-guide-cta svg { width:21px; }
.sk-guide-art { position:relative; display:flex; align-items:center; padding:8px 2px; }
.sk-guide-cover { position:relative; z-index:1; display:flex; align-items:center; flex-direction:column; gap:4px; flex:0 0 100px; padding:17px 8px 11px; background:white; border:1px solid #f0e9d0; border-radius:6px; transform:rotate(-6deg); box-shadow:0 5px 9px #74602b20; text-align:center; }
.sk-guide-cover strong { font:700 11px/1.5 Arial,sans-serif; }
.sk-guide-cover>span { font-size:11px; font-weight:700; line-height:1.6; text-wrap:balance; }
.sk-guide-cover img { width:50px; margin-top:5px; }
.sk-checklist { display:grid; grid-template-columns:14px minmax(0,1fr); align-items:center; gap:8px 6px; flex:1; min-width:0; margin-left:-4px; padding:14px 8px; transform:rotate(5deg); background:white; border:1px solid #f0e9d0; border-radius:6px; box-shadow:0 5px 9px #74602b20; }
.sk-checklist span { display:grid; place-items:center; width:14px; height:14px; color:white; background:var(--sk-action); font:700 9px/1 Arial,sans-serif; border-radius:50%; }
.sk-checklist i { height:3px; background:#d5dce4; border-radius:3px; }
.sk-tools { scroll-margin-top:20px; margin-top:30px; }
.sk-tools>h2 { position:relative; padding-left:18px; font-size:24px; line-height:1.65; margin-bottom:16px; }
.sk-tools>h2::before { content:""; position:absolute; top:.27em; bottom:.27em; left:0; width:6px; border-radius:6px; background:var(--sk-action); }
.sk-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.sk-card { container-type:inline-size; container-name:tool; display:flex; flex-direction:column; min-width:0; position:relative; padding:18px 17px 10px; border:1px solid #e4edf4; border-radius:16px; background:white; box-shadow:0 3px 14px #3a6a9210; transition:box-shadow .15s,border-color .15s; }
.sk-card:hover { border-color:#afbac9; box-shadow:0 8px 24px #0f1e3a12; }
.sk-card-main { display:flex; flex-direction:column; flex:1; min-width:0; border-radius:6px; }
.sk-card-secondary { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:44px; margin-top:10px; padding:10px 0; border-top:1px solid #e4edf4; color:var(--sk-muted)!important; font-size:14px; line-height:1.8; }
.sk-card-secondary span { min-width:0; }
.sk-card-secondary svg { width:18px; height:18px; }
.sk-card-heading { display:grid; grid-template-columns:48px minmax(0,1fr) 18px; align-items:center; gap:10px; }
.sk-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:50%; color:#d80732; background:#ffe1e7; box-shadow:inset 0 0 0 6px #ffffff40; }
.sk-icon svg { width:28px; height:28px; stroke-width:2; }
.sk-card-pdf .sk-icon { color:#147fe0; background:#dfedff; }
.sk-card-demo .sk-icon { color:#e60033; background:#ffe1e7; }
.sk-card-demo .sk-icon rect { fill:#e60033; }
.sk-card-demo .sk-icon path { fill:white; stroke:white; }
.sk-card-slides .sk-icon { color:#6941bb; background:#eee6ff; }
.sk-card-line .sk-icon { color:#0a842e; background:#d9f7d8; }
.sk-card-qr .sk-icon { color:#d56306; background:#fff0d9; }
.sk-arrow { display:flex; color:#0f1e3a; }
.sk-arrow svg { width:18px; height:22px; stroke-width:2.2; }
.sk-card h3 { min-width:0; font-size:20px; line-height:1.55; }
:is(.sk-card,.sk-card-main)>p { color:var(--sk-muted); font-size:14px; line-height:1.75; padding:3px 0 14px 58px; }
.sk-preview { display:flex; position:relative; align-items:center; justify-content:center; min-height:226px; margin-top:auto; border-radius:11px; padding:12px 9px; background:linear-gradient(180deg,#fff,#f8fbfd); }
.sk-preview-talk { background:white; gap:6px; padding-left:0; padding-right:0; }
.sk-talk-scene { position:relative; align-self:stretch; flex:1 1 54%; min-width:0; overflow:hidden; }
.sk-preview .sk-people { position:absolute; bottom:0; left:0; width:180%; max-width:none; height:auto; }
.sk-talk-labels { display:flex; flex:0 1 43%; min-width:0; flex-direction:column; gap:8px; padding-bottom:6px; }
.sk-talk-labels span { padding:6px 5px; background:#e1eeff; color:#153e75; text-align:center; border-radius:8px; font-size:13px; line-height:1.6; font-weight:700; }
.sk-talk-labels span:nth-child(2) { background:#ffe1e7; color:#bd1235; }
.sk-talk-labels span:nth-child(3) { background:#edf0f4; color:#243551; }
.sk-preview-pdf { background:white; }
.sk-paper-stack { position:relative; width:110px; margin:0 13px 0 -7px; }
.sk-paper-stack::before,.sk-paper-stack::after { content:""; position:absolute; inset:3px -6px 0 6px; background:repeating-linear-gradient(180deg,#fff 0 14px,#edf2f6 14px 17px,#fff 17px 26px); border:1px solid #e0e6ec; border-radius:3px; transform:translateX(12px) rotate(8deg); box-shadow:0 3px 5px #0f1e3a10; }
.sk-paper-stack::after { transform:translateX(5px) rotate(4deg); }
.sk-preview .sk-document { position:relative; z-index:1; width:100%; border:1px solid #e0e6ec; border-radius:3px; box-shadow:0 3px 8px #0f1e3a14; transform:rotate(-5deg); }
.sk-format { position:absolute; z-index:2; right:9px; bottom:13px; border-radius:5px; padding:2px 7px; background:var(--sk-action); color:white; font:700 11px/1.8 Arial,sans-serif; }
.sk-preview-slides { background:white; padding:18px 9px; }
.sk-slide-stack { position:relative; width:100%; margin-right:8px; }
.sk-slide-stack::before,.sk-slide-stack::after { content:""; position:absolute; inset:0; border:1px solid #e0e6ec; border-radius:4px; background:repeating-linear-gradient(180deg,#fff 0 13px,#edf2f6 13px 16px,#fff 16px 25px); transform:translate(8px,4px) rotate(4deg); box-shadow:0 3px 7px #0f1e3a12; }
.sk-slide-stack::after { transform:translate(4px,2px) rotate(2deg); }
.sk-slide-stack img { position:relative; z-index:1; width:100%; aspect-ratio:16/9; border:1px solid #dfe6ed; border-radius:4px; box-shadow:0 3px 7px #0f1e3a12; }
.sk-preview-demo { background:linear-gradient(180deg,#fff,#f3f8fd); align-items:flex-end; padding-bottom:0; }
.sk-phone { position:relative; width:147px; padding:15px 9px 9px; border:4px solid #172238; border-bottom:0; border-radius:21px 21px 0 0; background:white; box-shadow:0 0 0 2px #ced4de,0 3px 12px #0f1e3a17; display:flex; flex-direction:column; gap:6px; font-size:9px; line-height:1.5; }
.sk-phone-notch { position:absolute; top:0; left:32%; width:36%; height:6px; background:#172238; border-radius:0 0 5px 5px; }
.sk-phone .sk-phone-logo { width:49px; margin:0 auto 2px; }
.sk-demo-label { color:#526077; font-size:.85em; }
.sk-phone strong { font-size:10px; line-height:1.6; }
.sk-answer { display:flex; gap:4px; align-items:center; border:1px solid #dce2e9; border-radius:5px; padding:4px 3px; }
.sk-answer i { flex-shrink:0; height:7px; width:7px; border:1px solid #7e8a9c; border-radius:50%; }
.sk-phone-action { text-align:center; background:var(--sk-action); color:white; border-radius:5px; padding:4px; }
.sk-preview-line { background:#eaf4fc; align-items:center; padding:18px 14px; }
.sk-chat { width:100%; }
.sk-chat-label { display:block; color:#267641; font:700 12px/1.5 Arial,sans-serif; margin-bottom:10px; }
.sk-message { background:#a9efb1; color:#173a27; padding:13px; border-radius:13px 13px 3px 13px; box-shadow:0 3px 7px #194d3020; font-size:13px; line-height:1.8; }
.sk-message-lines { display:flex; gap:5px; justify-content:flex-end; margin-top:9px; }
.sk-message-lines i { width:14px; height:3px; background:#9ab0c4; border-radius:5px; }
.sk-preview-qr { gap:8px; padding:16px 2px; background:linear-gradient(180deg,#fff,#fafbfe); }
.sk-qr-sheet,.sk-partner-sheet { background:white; border:1px solid #e1e8ef; border-radius:7px; box-shadow:0 3px 9px #0f1e3a0c; }
.sk-qr-sheet { padding:12px 7px; text-align:center; flex:0 1 44%; min-width:0; }
.sk-qr-sheet>span { display:block; font-size:11px; font-weight:700; line-height:1.6; }
.sk-qr-sheet>svg { width:58px; max-width:100%; height:auto; margin:8px auto; color:#526077; }
.sk-qr-sheet strong { display:block; font-size:10px; color:#526077; line-height:1.7; }
.sk-partner-sheet { flex:1; min-width:0; padding:14px 9px; }
.sk-partner-sheet>span { display:block; margin-top:9px; font-size:11px; line-height:1.8; }
.sk-partner-sheet svg { width:21px; height:21px; color:#d56306; }
.sk-footer { display:flex; flex-wrap:wrap; align-items:center; gap:0 10px; max-width:1120px; margin:auto; padding:18px 28px 30px; color:var(--sk-muted); font-size:14px; line-height:1.8; }
.sk-footer a { display:inline-flex; align-items:center; min-height:44px; max-width:100%; padding:8px 0; text-decoration:underline; text-decoration-color:#afbac9; text-underline-offset:4px; }
.sk-footer a:hover { text-decoration-color:currentColor; }
@container tool (max-width:230px) {
  .sk-card-heading { grid-template-columns:minmax(0,1fr) 18px; gap:8px; }
  .sk-icon { grid-column:1; grid-row:1; width:42px; height:42px; }
  .sk-icon svg { width:25px; height:25px; }
  .sk-arrow { grid-column:2; grid-row:1; }
  .sk-card h3 { grid-column:1/-1; grid-row:2; font-size:17px; line-height:1.65; }
  :is(.sk-card,.sk-card-main)>p { padding-left:0; }
}
@media (max-width:1023px) {
  .sk-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:599px) {
  .sk-main { padding:25px 14px 8px; }
  .sk-hero { gap:16px; padding:0 3px; margin-bottom:23px; }
  .sk-hero h1 { font-size:29px; line-height:1.45; }
  .sk-hero>img { width:76px; }
  .sk-intro { font-size:15px; line-height:1.8; margin-top:8px!important; }
  .sk-eyebrow { font-size:13px; }
  .sk-guide { grid-template-columns:minmax(0,1fr) 88px; padding:19px 16px; gap:10px; border-radius:14px; }
  .sk-guide h2 { font-size:19px; line-height:1.65; }
  .sk-guide p { font-size:14px; }
  .sk-guide-label { font-size:13px; }
  .sk-guide-art { padding:6px 0; }
  .sk-guide-cover { flex-basis:66px; padding:12px 5px 8px; gap:3px; }
  .sk-guide-cover strong { font-size:9px; }
  .sk-guide-cover>span { font-size:9px; }
  .sk-guide-cover img { width:36px; }
  .sk-checklist { grid-template-columns:11px minmax(0,1fr); padding:10px 4px; gap:7px 3px; margin-left:-10px; }
  .sk-checklist span { width:11px; height:11px; font-size:7px; }
  .sk-guide-cta { min-height:44px; margin-top:12px; padding:9px 14px; font-size:15px; gap:10px; }
  .sk-guide-cta svg { width:18px; }
  .sk-tools { margin-top:25px; }
  .sk-tools>h2 { padding-left:15px; font-size:20px; margin-bottom:13px; }
  .sk-tools>h2::before { width:5px; }
  .sk-grid { gap:11px; }
  .sk-card { padding:13px 11px 8px; border-radius:13px; }
  :is(.sk-card,.sk-card-main)>p { font-size:14px; line-height:1.8; padding-top:3px; padding-bottom:12px; }
  .sk-preview { min-height:192px; padding-left:5px; padding-right:5px; margin-left:-5px; margin-right:-5px; }
  .sk-talk-labels { gap:7px; }
  .sk-talk-labels span { font-size:10px; padding:5px 3px; }
  .sk-paper-stack { width:82px; margin-right:10px; }
  .sk-format { right:4px; bottom:17px; font-size:10px; }
  .sk-slide-stack { margin-right:5px; }
  .sk-phone { width:113px; border-width:3px; padding:12px 6px 7px; font-size:7px; gap:5px; border-radius:17px 17px 0 0; }
  .sk-phone .sk-phone-logo { width:38px; }
  .sk-phone strong { font-size:8px; }
  .sk-answer { padding:3px 2px; gap:3px; }
  .sk-answer i { width:6px; height:6px; }
  .sk-preview-line { padding:12px 9px; }
  .sk-message { font-size:11px; padding:10px; }
  .sk-preview-qr { gap:5px; padding-left:0; padding-right:0; }
  .sk-qr-sheet { padding:9px 4px; }
  .sk-qr-sheet>span { font-size:9px; }
  .sk-qr-sheet>svg { width:40px; margin:7px auto; }
  .sk-qr-sheet strong { font-size:8px; }
  .sk-partner-sheet { padding:12px 7px; }
  .sk-partner-sheet>span { font-size:9px; }
  .sk-partner-sheet svg { width:18px; height:18px; }
  .sk-footer { padding-left:16px; }
}
@media (max-width:359px) {
  .sk-grid { grid-template-columns:minmax(0,1fr); }
  .sk-card { padding:16px 16px 8px; }
  .sk-card h3 { font-size:18px; }
  .sk-preview { min-height:194px; }
  .sk-hero>img { width:53px; }
  .sk-hero h1 { font-size:26px; }
  .sk-guide { grid-template-columns:minmax(0,1fr); }
  .sk-guide-art { display:none; }
  .sk-talk-scene { max-width:135px; }
}
@media (prefers-reduced-motion:reduce) { .sk-card { transition:none; } }