/* Original layout and palette, with restrained spacing/mobile refinements. */
:root{--brand:#0288d1;--cyan:#02b7e2;--table:#1976d2;--dark:#343a40;--orange:#ffb300;--ink:#30383c;--line:#dbe5ed}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:82px}body{margin:0;background:#fff;color:var(--ink);font:16px/1.65 -apple-system,BlinkMacSystemFont,"PingFang TC","Microsoft JhengHei",sans-serif}h1,h2,h3,p{margin-top:0}h2{font-size:30px;line-height:1.45;font-weight:600;margin-bottom:12px}h3{font-size:20px;line-height:1.5}a{color:#0088b5;text-decoration:none}a:hover{text-decoration:underline}img{max-width:100%;height:auto}button,input{font:inherit}button{cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #ffb300;outline-offset:3px}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.wrap{max-width:1140px;margin:auto;padding-inline:24px}.narrow{max-width:790px}.skip{position:fixed;top:-100px;left:15px;background:white;padding:10px;z-index:30}.skip:focus{top:8px}
.home-intro{padding:38px 0 28px;background:linear-gradient(-45deg,#fff 33%,transparent 0%),linear-gradient(-45deg,#02b7e2 100%,transparent 33%)}.two-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:34px}.search-input{display:flex;gap:9px;align-items:stretch}.search-input input{min-width:0;flex:1;width:100%;border:1px solid transparent;background:#e9e9e9;border-radius:6px;padding:9px 12px;color:#333;line-height:1.6}.search-input input:focus{outline:3px solid #a8d8f7;border-color:var(--brand);background:#fff}.search-input button{border:0;border-radius:6px;background:var(--brand);color:#fff;flex:0 0 44px;min-height:44px;display:flex;align-items:center;justify-content:center}.search-icon{display:block;width:14px;height:14px;border:2px solid currentColor;border-radius:50%;position:relative}.search-icon:after{content:"";position:absolute;width:7px;height:2px;right:-5px;bottom:-3px;background:currentColor;transform:rotate(45deg)}.facebook-link{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-size:14px;color:#235a9e;margin:12px 0 0;padding:4px 0}.facebook-link img{width:24px;height:24px;flex-shrink:0}.original-intro{margin:18px 0 0;font-size:16px;line-height:1.85;display:flow-root}.original-intro img{width:30%;float:left;margin:0 13px 9px 0;border:4px solid white;border-radius:5px;background:#fff;box-shadow:0 3px 10px #0003}.app-download>p{margin:0 0 14px}.store-badges{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.store-badges a{display:block;width:45%;max-width:235px;line-height:0}.store-badges img{display:block;width:100%;height:auto}
.press-section{padding:28px 0;text-align:center}.press-section h2,.about-section h2{color:var(--cyan)}.lead{font-size:20px;line-height:1.75;font-weight:400;margin-bottom:12px}.feature-section{background:var(--dark);color:#fff;padding:28px 0 38px}.section-heading{text-align:center}.feature-section h2,.feature-section h3{color:var(--orange)}.feature-columns{display:grid;grid-template-columns:minmax(0,1fr) 250px minmax(0,1fr);gap:50px;margin-top:32px;align-items:start}.feature-columns h3{margin:24px 0 9px}.feature-columns p{font-size:16px;line-height:1.8;margin-bottom:22px;color:#f0f1f2}.app-screenshot{width:224px;height:auto;justify-self:center}.about-section{padding:34px 0 40px;text-align:center}.about-section .lead{margin-bottom:24px}.about-demo{display:block;width:382px;max-width:100%;margin:auto}.feature-columns>div:first-child h3:first-child,.feature-columns>div:last-child h3:first-child{margin-top:20px}
footer{background:var(--dark);padding:35px 0 25px;text-align:center;color:#999}.social-links{display:flex;justify-content:center;gap:20px;margin-bottom:12px}.social-links a{color:#aaa;font-size:25px;font-weight:600;min-width:36px;line-height:36px}.social-links a:hover{color:#fff}.copyright{font-size:14px;margin:8px 0}.copyright a{color:#ddd}.index-link{font-size:12px;color:#aaa}
.lookup{padding-top:36px;padding-bottom:40px}.legacy-search-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:34px;align-items:start}.lookup-search{grid-column:1;grid-row:1;margin-bottom:6px}#word-result{display:contents}.legacy-word-main{grid-column:1;grid-row:2;min-width:0}.legacy-word-sidebar{grid-column:2;grid-row:1 / span 2;min-width:0}.result-heading{font-size:16px;font-weight:400;line-height:1.8;margin:0 0 18px}.word-tabs{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.word-tabs a{border:1px solid var(--brand);border-radius:5px;background:white;color:#333;padding:4px 12px;font-size:21px;min-width:42px;text-align:center}.word-tabs a[aria-current=true]{background:var(--brand);color:#fff}.player{width:300px;max-width:100%;margin:0 auto 22px}.character-stage{position:relative;aspect-ratio:1;background:white}.character-stage>img,.character-stage>canvas{display:block;width:100%;height:100%;object-fit:contain}.grid-lines{position:absolute;inset:0;pointer-events:none;background-size:100% 100%}.character-stage[data-grid=square] .grid-lines{background-image:url('/assets/legacy/grid.png')}.character-stage[data-grid=diagonal] .grid-lines{background-image:url('/assets/legacy/diagonal.png')}.player-controls{position:absolute;inset:0;pointer-events:none;z-index:2}.player-controls button{position:absolute;top:94.706%;transform:translate(-50%,-50%);width:50px;height:50px;display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:50%;background:#387ef5;color:#fff;font-size:19px;pointer-events:auto}.player-controls #reset{left:5.294%;background:#f23f43}.player-controls #play{left:94.706%}.player-controls #play:hover,.player-controls #play:focus-visible{box-shadow:0 0 0 4px #387ef540}.player-controls #reset:hover{background:#e13838}.player-controls button:disabled{opacity:.4;cursor:not-allowed}#frame-label{position:absolute;left:5.294%;top:5.294%;transform:translate(-50%,-50%);z-index:2;width:50px;height:50px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#f2f1f4;color:#333;font:20px/1 Arial,sans-serif;pointer-events:none}.grid-choice{display:flex;justify-content:center;gap:5px;margin-top:16px}.grid-choice button{border:1px solid transparent;background:var(--brand);color:#fff;border-radius:5px;font-size:16px;font-weight:600;min-height:36px;padding:5px 11px}.grid-choice button[aria-pressed=true]{color:#333;border-color:#333;background:#fff}.message{font-size:13px;color:#a33f25;margin:8px 0}.message:empty{display:none}
.info-table,.phrase-table{border-collapse:separate;border-spacing:0;width:100%;table-layout:fixed;margin:0 0 10px;font-size:15px;line-height:1.65}.info-table thead th,.phrase-table thead th{background:var(--table);color:#fff;font-weight:400;text-align:left;padding:6px 11px;border-right:1px solid #ffffff65}.info-table thead th:first-child,.phrase-table thead th:first-child{border-top-left-radius:3px}.info-table thead th:last-child,.phrase-table thead th:last-child{border-top-right-radius:3px;border-right:0}.info-table td{background:#edf6ff;padding:8px 11px;vertical-align:top;overflow-wrap:anywhere}.reading{border:0;background:#baddfb;border-radius:5px;display:block;width:100%;text-align:center;padding:5px 7px;min-height:34px;font-size:14px;line-height:1.5;color:#24465c;margin:2px 0;overflow-wrap:anywhere}.reading:hover{background:#a7d3fa}.reading-icon{display:inline-block;width:1.125em;height:1em;vertical-align:-.125em;background:currentColor;-webkit-mask:url('/assets/legacy/volume-up.svg') center/contain no-repeat;mask:url('/assets/legacy/volume-up.svg') center/contain no-repeat}.reading[aria-pressed=true]{outline:2px solid var(--brand)}.unavailable{font-size:13px;color:#71818d}.variants td>img{max-width:100%;height:auto;max-height:150px}.variant-inline{height:1.6em;width:auto;vertical-align:middle}.variants p{margin:0}.facebook-post{width:100%;max-width:500px;margin:22px auto 0}.facebook-post iframe{display:block;width:100%;max-width:100%;height:654px;border:0;background:#fff}.facebook-post p{margin:8px 0 0;font-size:13px;text-align:center}.ad-preview{max-width:336px;width:100%;height:250px;margin:25px auto;background:#fafbfc;border:1px dashed #d3dde4;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#8d9aa4;font-size:13px}.ad-preview small{font-size:11px}.phrase-table .phrase-col{width:20%}.phrase-table tbody th{font-weight:600;text-align:left;padding:8px 9px;overflow-wrap:anywhere;vertical-align:middle}.phrase-table tbody th a{color:#333}.phrase-table tbody td{padding:6px 8px;vertical-align:middle;overflow-wrap:anywhere}.phrase-table tbody:nth-of-type(odd){background:#edf6ff}.phrase-table tbody:nth-of-type(even){background:#fff}.phrase-table tbody tr:last-child td{padding-bottom:12px;border-bottom:1px solid #dfebf4}.phrase-table .definition{padding:3px 9px;font-size:14px}.dot{display:inline-block;border:1px solid #b1c0ca;color:#7c919f;border-radius:4px;font-size:10px;line-height:1.3;padding:2px 3px;margin-right:6px;vertical-align:1px}
.empty{padding-block:65px}.character-index{padding-block:40px}.character-index h1{font-size:30px}.character-index .eyebrow{font-size:13px;color:#71818d}.character-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(50px,1fr));gap:12px}.character-links a{padding:8px;text-align:center;border:1px solid var(--line);border-radius:5px;font-size:24px}.index-pages{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}.index-pages a{padding:5px 12px;border:1px solid var(--line)}.index-pages [aria-current=page]{background:var(--brand);color:#fff}
@media(max-width:1000px){.desktop-nav{margin-left:auto}.wrap{max-width:960px}.feature-columns{grid-template-columns:minmax(0,1fr) 224px minmax(0,1fr);gap:28px}.feature-columns h3{font-size:18px}.original-intro img{width:40%}}
@media(max-width:760px){.two-columns,.legacy-search-grid{gap:24px}.wrap{padding-inline:20px}.feature-columns{grid-template-columns:minmax(0,1fr) 180px minmax(0,1fr);gap:18px}.feature-columns h3{font-size:17px}.feature-columns p{font-size:14px}.lead{font-size:18px}.store-badges{gap:8px}.store-badges a{width:calc(50% - 4px)}.info-table,.phrase-table{font-size:14px}.info-table th,.info-table td{padding-inline:8px}}
@media(max-width:600px){.home-intro{padding:24px 0 28px;background:linear-gradient(-45deg,#fff 12%,transparent 0%),linear-gradient(-45deg,#02b7e2 100%,transparent 33%)}.two-columns{grid-template-columns:1fr;gap:24px}.original-intro img{width:36%;max-width:160px}.original-intro{font-size:15px;line-height:1.85}.app-download>p{font-size:15px;margin-bottom:12px}.store-badges a{width:calc(50% - 6px);max-width:210px}.store-badges{gap:12px}.press-section{padding:26px 0}.press-section h2{font-size:25px}.lead{font-size:17px;line-height:1.85}.feature-section{padding:28px 0}.feature-columns{grid-template-columns:1fr;gap:24px;margin-top:22px}.feature-columns h3{font-size:19px;margin-top:21px}.feature-columns p{font-size:15px;margin-bottom:16px}.app-screenshot{width:224px}.feature-columns>div:first-child h3:first-child,.feature-columns>div:last-child h3:first-child{margin-top:0}.about-section{padding:28px 0}.about-section .lead{font-size:17px}.about-demo{width:340px}.lookup{padding-top:24px}.legacy-search-grid{display:block}.legacy-word-sidebar{margin-top:32px}.result-heading{font-size:15px}.lookup-search{margin-bottom:8px}.player{margin-bottom:24px}.ad-preview{margin-block:22px}.phrase-table .reading{font-size:13px;padding-inline:4px}.phrase-table th,.phrase-table td{padding-inline:6px}.phrase-table thead th{padding-inline:8px}.phrase-table .definition{font-size:14px}.empty{padding-block:40px}.empty h1{font-size:28px}}
.legacy-search-grid{grid-template-rows:min-content 1fr}
.character-stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:url('/assets/legacy/blank.png') center/100% 100% no-repeat}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.phrase-highlight{color:#007bff}

/* volume-up: Font Awesome Free 5.3.1 by Fonticons, Inc.; CC BY 4.0. Original SVG unchanged; see /assets/legacy/FontAwesome-LICENSE.txt. */

.character-stage>.hd-word-image{padding:6.6666666667%}
/* Grid behind transparent glyphs; frame and controls stay above both. */
.character-stage{isolation:isolate}
.character-stage>.grid-lines{z-index:0}
.character-stage>img,.character-stage>canvas{position:relative;z-index:1}
.character-stage::after{z-index:2}
.character-stage>.player-controls,.character-stage>#frame-label{z-index:3}
.stroke-loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:4;width:54px;height:54px;display:grid;place-items:center;border-radius:50%;background:#fffffff0;box-shadow:0 2px 10px #173c5926;pointer-events:none}
.loading-ring{width:32px;height:32px;border:3px solid #d5e9f4;border-top-color:var(--brand);border-radius:50%;animation:stroke-loading-spin .8s linear infinite}
@keyframes stroke-loading-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.loading-ring{animation:none;border-top-color:var(--brand);border-right-color:var(--brand)}}
.facebook-follow{margin-top:24px;display:flex;align-items:center;flex-wrap:wrap;column-gap:8px}
.facebook-follow>p{margin:0}
.facebook-follow .facebook-link{margin:0}
.home-intro .facebook-follow{margin-top:18px;font-size:14px}
.home-intro .facebook-follow>p{font-size:inherit}
.home-intro .facebook-link{color:#153e50;padding:4px 0;gap:8px;font-weight:500;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.home-intro .facebook-link img{background:#fff;border-radius:50%;padding:2px}
.home-intro .facebook-link:hover{color:#092e44}
.home-intro .facebook-link:focus-visible{outline-color:#173c59;border-radius:3px}
@media(max-width:600px){.facebook-follow>p{font-size:15px}}

/* Homepage promotion and reserved display slot. */
.home-intro .app-download{margin-top:24px}
.home-intro .store-badges a,.legacy-word-sidebar .store-badges a{max-width:190px}
@media(max-width:600px){.home-intro .store-badges a,.legacy-word-sidebar .store-badges a{max-width:150px}}
.legacy-word-sidebar .landing-ad{margin:25px 0}
@media(max-width:680px){.home-intro .two-columns{grid-template-columns:1fr}}
@media(max-width:360px){.home-intro .landing-ad,.legacy-word-sidebar .landing-ad{margin-inline:-10px}}

/* Compact navigation and semantic groups on dictionary results only. */
.word-breadcrumbs{margin:0 0 14px;font-size:13px;line-height:1.6;color:#536b79}
.word-breadcrumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:0;list-style:none;margin:0;padding:0}
.word-breadcrumbs li{display:flex;align-items:center}
.word-breadcrumbs li+li::before{content:"";width:5px;height:5px;border-top:1px solid #8095a2;border-right:1px solid #8095a2;transform:rotate(45deg);margin:0 11px 0 9px}
.word-breadcrumbs a{color:#536b79;padding-block:4px}
.word-breadcrumbs a:hover{color:#007ba8}
.word-breadcrumbs [aria-current=page]{color:#263f4e;font-weight:600}
.word-section{margin:0 0 22px}
.result-section-title{font-size:17px;font-weight:600;line-height:1.5;color:#215269;margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid var(--line)}

/* Keep the viewport edge blue if the browser retains native elastic scrolling. */
html { overscroll-behavior-y: none; background: #0088cc; }
body { overscroll-behavior-y: none; }

/* Matches articles_site/style.css header; keep article content styles separate. */
.site-header {
  --brand:#0088cc; --accent:#00afd7; --link:#007fae; --heading:#163e52;
  --line:#e2edf1; --wash:#f3f9fb; --width:1200px;
  font:17px/1.85 -apple-system,BlinkMacSystemFont,"PingFang TC","Microsoft JhengHei",sans-serif;
  -webkit-font-smoothing:antialiased;
}
.site-header a:hover { text-decoration:none; }
.site-header a:focus-visible,.site-header summary:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
.site-header { background: var(--brand); border-bottom: 4px solid #00a6d5; }
.header-inner {
  max-width: var(--width); margin: auto; padding: 22px 28px;
  display: flex; align-items: center; justify-content: space-between; gap: 32px; min-height: 108px;
}
.brand { display: block; flex: 0 1 380px; line-height: 0; }
.brand img { width: 100%; height: auto; max-width: 380px; }
.main-nav { display: flex; gap: 34px; align-items: center; flex-shrink: 0; }
.main-nav a {
  position: relative; padding: 11px 0; color: white; font-size: 17px;
  font-weight: 600; letter-spacing: .04em; white-space: nowrap;
}
.main-nav a::after {
  content: ''; position: absolute; bottom: 1px; left: 0; width: 100%; height: 2px;
  background: #fff; transform: scaleX(0); transition: transform .18s ease;
}
.main-nav .nav-current::after, .main-nav a:hover::after { transform: scaleX(1); }
.main-nav a:hover { color: #e2f9ff; }
.mobile-menu { display: none; }

@media (max-width: 1050px) {
  .main-nav { gap: 24px; } .main-nav a { font-size: 16px; } .brand { flex-basis: 330px; }
}
@media (max-width: 800px) {
  .header-inner { gap: 16px; padding: 16px 24px; min-height: 80px; }
  .brand { flex: 1 1 auto; width: auto; min-width: 0; max-width: 300px; }
  .main-nav { display: none; }
  .mobile-menu { display: block; position: relative; flex: 0 0 44px; }
  .mobile-menu summary {
    width: 44px; height: 44px; display: flex; align-items: center;
    justify-content: center; color: #fff; cursor: pointer; list-style: none;
    border: 1px solid #ffffff50; border-radius: 8px; background: #ffffff0d;
  }
  .mobile-menu summary::-webkit-details-marker { display: none; }
  .menu-icon, .menu-icon::before, .menu-icon::after {
    display: block; width: 18px; height: 2px; border-radius: 1px; background: currentColor;
  }
  .menu-icon { position: relative; }
  .menu-icon::before, .menu-icon::after { content: ''; position: absolute; left: 0; }
  .menu-icon::before { top: -5px; } .menu-icon::after { top: 5px; }
  .mobile-menu[open] .menu-icon { background: transparent; }
  .mobile-menu[open] .menu-icon::before { top: 0; transform: rotate(45deg); }
  .mobile-menu[open] .menu-icon::after { top: 0; transform: rotate(-45deg); }
  .mobile-menu nav {
    position: absolute; right: 0; top: calc(100% + 12px); z-index: 20;
    width: min(260px, calc(100vw - 48px)); padding: 8px; background: #fff;
    border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 12px 28px #163e5229;
  }
  .mobile-menu nav a { display: block; padding: 12px 14px; border-radius: 6px; color: var(--heading); font-size: 16px; font-weight: 500; }
  .mobile-menu nav a:hover, .mobile-menu nav .nav-current { background: var(--wash); color: var(--link); }
}
@media (max-width: 520px) {
  .header-inner { padding-left: 22px; padding-right: 22px; }
}

/* Fixed display-ad dimensions; house creatives share the same reserved space. */
.landing-ad{margin-top:0;text-align:center;container-type:inline-size}
.landing-ad-label{display:block;margin-bottom:6px;font-size:11px;letter-spacing:.08em;color:#526b78}
.landing-ad-slot{position:relative;left:50%;transform:translateX(-50%);width:300px;height:250px;max-width:100%;background:#fafbfc;display:grid;place-items:center}
.landing-ad-slot>[data-house-slot]{width:100%;height:100%}
.landing-ad-slot>[data-paid-slot]{max-width:100%;line-height:0}
@container(min-width:336px){.landing-ad-slot{width:336px;height:280px}}
.landing-ad[data-ad-size=compact]:not([data-ad-state=house]) .landing-ad-slot{width:300px;height:250px}
.house-promo{height:100%;padding:17px 18px 15px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:5px;overflow:hidden;color:#193e55;background:#eff8fd;border:1px solid #c6dce9;text-decoration:none;text-align:center}
.house-promo-warm{color:#463923;background:#fcf7ed;border-color:#e0d1b5}
.house-promo:hover{text-decoration:none}.house-promo:hover .house-promo-cta{text-decoration:underline}
.house-promo-name{font-size:11px;letter-spacing:.06em;font-weight:600}
.house-promo strong{font-size:23px;line-height:1.35;font-weight:700}
.house-promo img{display:block;width:100%;height:auto;flex-shrink:0}
.house-promo-description{font-size:12px;line-height:1.5}
.house-promo-cta{display:inline-block;padding:5px 20px;border-radius:20px;background:#0088cc;color:#fff;font-size:13px;font-weight:600}
.house-promo-warm .house-promo-cta{background:#6d4d2e}


.house-promo-icon{padding-block:12px;gap:4px}
.house-promo-icon strong{font-size:21px}
.house-promo-icon img{width:64px;height:64px;border-radius:12px}

/* Local layout study only. Separate from all live ad selectors and controls. */
.display-ad-preview{margin:28px 0 36px;text-align:center;container-type:inline-size}
.display-ad-preview-label{display:block;margin-bottom:8px;color:#657b86;font-size:11px;line-height:18px;letter-spacing:.12em}
.display-ad-preview-surface{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:300px;max-width:100%;height:250px;margin-inline:auto;border:1px dashed #b9cdd8;background:#f4f8fa;color:#657b86}
.display-ad-preview-title{font-size:15px;font-weight:500;line-height:1.5}.display-ad-preview-note{font-size:11px;line-height:1.5;color:#7e929d}
@container(min-width:468px){.display-ad-preview-surface{width:468px;height:60px;gap:3px}}
@container(min-width:728px){.display-ad-preview-surface{width:728px;height:90px;gap:6px}}
.adsense-placement{width:100%;min-width:0;margin:28px 0 36px;text-align:center;container-type:inline-size}
.adsense-placement[hidden],.adsense-placement [hidden]{display:none!important}
/* Live responsive ads have no fixed/max height and are never clipped to the mock. */
.adsense-placement [data-adsense-live]{width:100%;min-width:0}