:root {
    color-scheme:light;
    --page:#fffcf7; --ink:#30263d; --ink-soft:#665d70; --purple:#65429a;
    --line:#e8e1ec; --head:"Kanit","Noto Sans Thai",system-ui,sans-serif;
    --body:"Sarabun","Noto Sans Thai",system-ui,sans-serif;
  }
  * { box-sizing:border-box; }
  html { background:var(--page); scroll-behavior:smooth; scroll-padding-top:112px; }
  body { margin:0; background:var(--page); color:var(--ink); font:18px/1.75 var(--body); -webkit-font-smoothing:antialiased; }
  img { display:block; max-width:100%; height:auto; }
  a { color:inherit; text-decoration:none; }
  .wrap { width:min(100%,1200px); margin-inline:auto; padding-inline:32px; }
  h1,h2,h3 { margin:0; font-family:var(--head); font-weight:500; line-height:1.4; text-wrap:balance; }
  p { margin:0; }
  .kicker { color:var(--accent,var(--purple)); font:500 12px/1.6 var(--head); letter-spacing:.16em; text-transform:uppercase; }
  :focus-visible { outline:3px solid var(--purple); outline-offset:5px; }
  .skip-link { position:fixed; top:12px; left:16px; z-index:20; padding:10px 18px; border-radius:10px; background:var(--ink); color:white; transform:translateY(-180%); }
  .skip-link:focus { transform:translateY(0); }
  #main:focus { outline:none; }

  /* Compact navigation stays available throughout the product catalogue. */
  .site-header { position:sticky; top:0; z-index:10; border-bottom:1px solid var(--line); background:var(--page); }
  .header-inner { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:24px; min-height:84px; }
  .brand { display:flex; align-items:center; gap:10px; flex-shrink:0; min-height:48px; }
  .brand img { width:48px; height:auto; }
  .brand-name { font:600 23px/1.1 var(--head); letter-spacing:-.04em; }
  .brand-name small { display:block; margin-top:4px; color:var(--ink-soft); font:400 12px/1.4 var(--body); letter-spacing:0; }
  .brand { grid-column:1; grid-row:1; }
  .nav-shell { min-width:0; max-width:100%; position:relative; grid-column:2; grid-row:1; justify-self:end; }
  .product-nav { display:flex; gap:4px; padding:7px; overflow-x:auto; }
  .product-nav a { display:flex; align-items:center; justify-content:center; flex-shrink:0; min-height:44px; padding:8px 15px; border-radius:9px; color:var(--ink-soft); font:400 15px/1.6 var(--head); transition:background .18s,color .18s; }
  .product-nav a[aria-current="location"] { background:#eee5f8; color:var(--purple); }

  /* A quiet editorial opening lets the original owl artwork lead. */
  .top { position:relative; padding:64px 0 0; background:radial-gradient(ellipse at 85% 35%,#f1e9fa 0,transparent 48%),radial-gradient(ellipse at 8% 5%,#fff2df 0,transparent 42%); }
  .hero-grid { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:48px; min-height:400px; }
  .hero-copy { padding-block:20px; }
  .hero-eyebrow { display:inline-flex; align-items:center; gap:10px; margin-bottom:20px; }
  .hero-eyebrow::before { content:"✦"; color:#946d2e; font-size:18px; }
  .top h1 { font-size:clamp(36px,4.1vw,58px); line-height:1.35; letter-spacing:-.025em; }
  .top h1 > .hero-brand { display:block; color:var(--purple); font-size:1.18em; letter-spacing:-.04em; }
  .hero-copy > p { max-width:490px; margin-top:20px; color:var(--ink-soft); font-size:19px; }
  .hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
  .button { display:inline-flex; align-items:center; justify-content:center; gap:22px; min-height:52px; padding:12px 22px; border:1px solid #d8cce7; border-radius:12px; font:400 16px/1.6 var(--head); transition:background .18s,box-shadow .18s; }
  .button-primary { background:var(--purple); color:#fff; border-color:var(--purple); box-shadow:0 5px 14px #65429a18; }
  .hero-art { position:relative; display:grid; place-items:center; isolation:isolate; padding:22px; }
  .hero-art::before { content:""; position:absolute; z-index:-1; width:94%; aspect-ratio:1; border:1px solid #d8c8e8; border-radius:50%; box-shadow:0 0 0 24px #ffffff55,0 0 0 25px #e7dcf066; }
  .hero-art::after { content:"✧"; position:absolute; right:0; top:12%; color:#9c7438; font-size:46px; }
  .top .logo { width:min(100%,355px); filter:drop-shadow(0 15px 20px #49326813); }
  .common { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:64px; padding:26px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .common > div { padding:0 22px; color:var(--ink-soft); font-size:14px; }
  .common > div:first-child { padding-left:0; }
  .common > div + div { border-left:1px solid var(--line); }
  .common b { display:block; margin-bottom:3px; color:var(--ink); font:500 21px/1.5 var(--head); }

  /* Shared section palettes also label the model selector. */
  .theme-tarot { --wash:#f3edfc; --accent:#65429a; --edge:#ded0ef; }
  .theme-seamsi { --wash:#fff0e5; --accent:#934528; --edge:#f0d5c2; }
  .theme-sakura { --wash:#fceef3; --accent:#963f64; --edge:#f0d2df; }
  .theme-bazi { --wash:#edf5ee; --accent:#38684d; --edge:#ccdfcf; }
  .models { padding:72px 0 64px; }
  .section-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:28px; }
  .section-heading h2 { margin-top:8px; font-size:clamp(28px,3vw,36px); }
  .section-heading > p { color:var(--ink-soft); font-size:16px; }
  .model-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
  .model-card { display:flex; flex-direction:column; align-items:start; position:relative; min-height:190px; padding:24px; border:1px solid var(--edge); border-radius:18px; background:var(--wash); transition:box-shadow .18s,border-color .18s; }
  .model-number { max-width:calc(100% - 20px); color:var(--accent); font:400 12px/1.6 var(--head); letter-spacing:.1em; }
  .model-icon { display:grid; place-items:center; width:40px; height:40px; margin:18px 0 12px; border:1px solid var(--edge); border-radius:12px; background:#ffffffa6; color:var(--accent); }
  .model-icon svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
  .model-card h3 { color:var(--accent); font-size:22px; }
  .model-card p { margin-top:3px; color:var(--ink-soft); font-size:14px; }
  .model-arrow { position:absolute; right:22px; top:20px; color:var(--accent); font-size:22px; }

  /* Decorative line art stays at the outer edges, away from copy. */
  .product { position:relative; isolation:isolate; overflow:hidden; padding:76px 0; background:linear-gradient(135deg,#ffffff35,transparent 65%),var(--wash); border-top:1px solid var(--edge); }
  .product::before,.product::after { content:""; position:absolute; z-index:-1; pointer-events:none; }
  .product::before { top:-170px; right:-380px; width:500px; height:500px; border:1px solid var(--edge); border-radius:50%; box-shadow:0 0 0 28px var(--wash),0 0 0 29px var(--edge); opacity:.65; }
  #tarot::after { content:"✧"; left:2%; top:40%; color:var(--edge); font:400 96px/1 var(--head); }
  #seamsi::before { width:240px; height:500px; top:-220px; right:-100px; border-radius:46%; transform:rotate(-35deg); box-shadow:24px 0 0 var(--wash),25px 0 0 var(--edge),49px 0 0 var(--wash),50px 0 0 var(--edge); }
  #sakura::before { width:100px; height:180px; top:35px; right:-50px; border-radius:90% 0 90% 0; transform:rotate(24deg); box-shadow:-90px -70px 0 -22px var(--edge),-10px 180px 0 -25px var(--edge); opacity:.55; }
  #bazi::before { width:330px; height:330px; right:-240px; top:80px; box-shadow:0 0 0 22px var(--wash),0 0 0 23px var(--edge),0 0 0 55px var(--wash),0 0 0 56px var(--edge); }
  .p-head { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:center; }
  .product-alt .p-img { order:-1; }
  .p-img { align-self:center; padding:7px; border:1px solid var(--edge); border-radius:22px; background:#ffffffb3; box-shadow:0 12px 28px #30263d0a; }
  .p-img img { width:100%; border-radius:15px; }
  .p-text h2 { margin-top:14px; color:var(--accent); font-size:clamp(32px,3.5vw,44px); }
  .p-text .sub { margin-top:6px; color:var(--ink); font:400 17px/1.7 var(--head); }
  .p-text > p { margin-top:18px; color:var(--ink-soft); }
  .chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
  .chips span { padding:5px 13px; border:1px solid var(--edge); border-radius:8px; background:#ffffff85; color:var(--accent); font-size:14px; }
  .feats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:36px; }
  .feat { padding:24px; border:1px solid var(--edge); border-radius:16px; background:#fff; box-shadow:0 3px 10px #30263d03; }
  .feat img { width:64px; height:auto; margin-bottom:14px; }
  .feat h3 { color:var(--accent); font-size:20px; }
  .feat p { margin-top:10px; color:var(--ink-soft); font-size:16px; line-height:1.8; }

  /* The picker sits outside the scrolling product navigation. */
  .language-picker { position:relative; grid-column:3; grid-row:1; justify-self:end; z-index:1; }
  .language-toggle { display:flex; align-items:center; gap:8px; min-height:44px; padding:8px 12px; border:1px solid #d8cce7; border-radius:10px; background:#fff; color:var(--purple); cursor:pointer; font:500 14px/1.8 system-ui,sans-serif; transition:background .18s,border-color .18s; }
  .language-toggle img { width:24px; height:auto; border:1px solid #30263d14; border-radius:3px; }
  .language-chevron { width:12px; height:12px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.6; transition:transform .18s; }
  .language-toggle[aria-expanded="true"] { background:#eee5f8; border-color:var(--purple); }
  .language-toggle[aria-expanded="true"] .language-chevron { transform:rotate(180deg); }
  .language-toggle:disabled { cursor:default; opacity:.65; }
  .language-dropdown { position:absolute; top:calc(100% + 12px); right:0; width:min(300px,calc(100vw - 40px)); max-height:min(70vh,520px); max-height:min(70dvh,520px); overflow-y:auto; overscroll-behavior:contain; padding:8px; border:1px solid var(--line); border-radius:16px; background:var(--page); box-shadow:0 14px 36px #30263d24; scrollbar-width:thin; }
  .language-dropdown[hidden] { display:none; }
  .language-dropdown > .kicker { padding:8px 12px 10px; }
  .language-options { display:grid; gap:3px; }
  .language-option { display:grid; grid-template-columns:32px minmax(0,1fr) 16px; align-items:center; gap:0 12px; min-width:0; min-height:60px; padding:8px 12px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--ink); cursor:pointer; text-align:left; font:400 14px/1.6 system-ui,sans-serif; transition:background .18s,border-color .18s; }
  .language-option[aria-pressed="true"] { border-color:var(--purple); background:#eee5f8; }
  .language-option[aria-pressed="true"]::after { content:"✓"; grid-column:3; grid-row:1 / 3; color:var(--purple); font:600 14px/1.5 system-ui,sans-serif; }
  .language-option:focus-visible { outline-offset:-3px; }
  .language-option img { grid-column:1; grid-row:1 / 3; width:32px; height:auto; border:1px solid #30263d14; border-radius:4px; }
  .language-native { grid-column:2; grid-row:1; font-family:system-ui,sans-serif; line-height:1.8; }
  .language-option small { grid-column:2; grid-row:2; color:var(--ink-soft); font:400 11px/1.5 system-ui,sans-serif; }
  .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
  :where(h1,h2,h3,p,.common,.model-number,.button,.chips span,.language-option) { overflow-wrap:anywhere; }
  html:not([lang="th"]) { --head:system-ui,sans-serif; --body:system-ui,sans-serif; }
  html:not([lang="th"]) :is(h1,h2,h3) { line-height:1.5; }
  html:not([lang="th"]) :is(.kicker,.model-number) { letter-spacing:normal; text-transform:none; }
  html:is([lang="my"],[lang="km"],[lang="lo"]) :is(h1,h2,h3) { line-height:1.7; }
  html:is([lang="my"],[lang="km"],[lang="lo"]) .product-nav a { line-height:1.9; }
  footer { padding:0 0 28px; color:var(--ink-soft); font-size:13px; }
  .footer-inner { display:flex; align-items:center; gap:16px; padding-top:22px; border-top:1px solid var(--line); }
  footer img { width:52px; flex-shrink:0; }
  .footer-copy { flex:1; }
  .footer-copyright { white-space:nowrap; }

  @media (hover:hover) {
    .language-toggle:enabled:hover { background:#f3edf9; border-color:#bba4d6; }
    .language-option:enabled:hover { border-color:#bba4d6; background:#f3edf9; }
    .product-nav a:hover { color:var(--purple); background:#f3edf9; }
    .button-primary:hover { background:#533383; box-shadow:0 7px 18px #65429a26; }
    .model-card:hover { border-color:var(--accent); box-shadow:0 8px 20px #30263d0a; }
  }
  @media (max-width:1399px) {
    .product::before,.product::after { display:none; }
  }
  @media (max-width:1000px) {
    .hero-grid { gap:24px; }
    .p-head { gap:36px; }
    .model-card { padding:20px; }
    .product-nav a { padding-inline:11px; }
    .brand-name { font-size:21px; }
  }
  @media (max-width:800px) {
    html { scroll-padding-top:154px; }
    .wrap { padding-inline:24px; }
    .header-inner { grid-template-columns:minmax(0,1fr) auto; column-gap:12px; row-gap:0; padding-top:10px; }
    .brand { gap:8px; }
    .language-picker { grid-column:2; grid-row:1; }
    .brand img { width:38px; }
    .brand-name { font-size:21px; }
    .brand-name small { display:inline; margin-left:6px; }
    .nav-shell { grid-column:1 / -1; grid-row:2; justify-self:stretch; max-width:none; margin-inline:-24px; }
    .nav-shell::after { content:""; position:absolute; right:0; top:0; bottom:7px; width:28px; background:linear-gradient(90deg,transparent,var(--page)); pointer-events:none; }
    .product-nav { overflow-x:auto; padding:5px 24px 10px; scrollbar-width:thin; scrollbar-color:#b6a1cc transparent; }
    .product-nav a { padding-inline:14px; }
    .top { padding-top:30px; }
    .hero-grid { gap:28px; }
    .hero-copy > p { font-size:17px; }
    .hero-art { padding:12px; }
    .hero-art::after { right:-5px; font-size:32px; }
    .hero-actions { gap:10px; }
    .button { padding:10px 16px; gap:14px; }
    .common { margin-top:36px; grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:24px; }
    .common > div { padding-inline:18px; }
    .common > div:nth-child(odd) { padding-left:0; border-left:0; }
    .model-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .model-card { min-height:180px; }
    .section-heading { display:block; }
    .section-heading > p { margin-top:10px; }
    .models { padding:48px 0; }
    .product { padding:52px 0; }
    .p-head { grid-template-columns:1fr; gap:28px; }
    .product-alt .p-img { order:0; }
    .p-img { width:100%; max-width:600px; justify-self:center; }
    .feats { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .footer-inner { flex-wrap:wrap; }
    .footer-copyright { margin-left:68px; }
  }
  @media (max-width:560px) {
    .wrap { padding-inline:20px; }
    .brand-name small { display:none; }
    .nav-shell { margin-inline:-20px; }
    .product-nav { padding-inline:20px; }
    .hero-grid { grid-template-columns:1fr; gap:18px; }
    .hero-copy { padding-block:8px; }
    .hero-eyebrow { margin-bottom:14px; font-size:11px; }
    .top h1 { font-size:clamp(32px,8.8vw,44px); }
    .hero-copy > p { margin-top:14px; }
    .hero-actions { margin-top:22px; }
    .hero-art { width:min(78%,285px); justify-self:center; padding:16px; margin:12px 0 6px; }
    .hero-art::before { width:88%; box-shadow:0 0 0 16px #ffffff55,0 0 0 17px #e7dcf066; }
    .hero-art::after { font-size:28px; }
    .common { margin-top:28px; padding-block:22px; }
    .common b { font-size:19px; }
    .common > div { font-size:13px; }
    .model-grid { gap:12px; }
    .model-card { min-height:174px; padding:18px 15px; }
    .model-card h3 { font-size:20px; }
    .model-card p { font-size:13px; }
    .model-icon { margin-top:14px; }
    .model-arrow { right:15px; top:14px; }
    .product { padding:42px 0; }
    .p-head { gap:24px; }
    .p-text > p { font-size:17px; }
    .p-img { padding:5px; border-radius:17px; }
    .p-img img { border-radius:12px; }
    .feats { grid-template-columns:1fr; margin-top:24px; gap:12px; }
    .feat { padding:22px; }
    .feat img { width:56px; }
    .footer-inner { align-items:start; gap:12px; }
    .footer-copyright { margin-left:64px; }
  }
  @media (prefers-reduced-motion:reduce) {
    html { scroll-behavior:auto; }
    *,*::before,*::after { transition:none !important; }
  }

/* Shared navigation and the merchandise collection. */
.product-nav a[aria-current="page"] { background:var(--purple); color:#fff; }
.product-nav .shop-link { color:var(--purple); font-weight:500; background:#f3edf9; }
.product-nav .shop-link[aria-current="page"] { color:#fff; background:var(--purple); }
[hidden] { display:none !important; }
.shop-hero { padding:64px 0 42px; background:radial-gradient(ellipse at 85% 15%,#f0e7fa,transparent 55%),linear-gradient(110deg,#fff4e5,var(--page) 65%); }
.shop-intro { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); align-items:center; gap:64px; }
.shop-intro h1 { max-width:720px; margin-top:16px; color:var(--ink); font-size:clamp(34px,4.2vw,56px); line-height:1.3; letter-spacing:-.025em; }
.shop-intro .intro-copy { max-width:660px; margin-top:18px; color:var(--ink-soft); font-size:18px; }
.shop-notice { position:relative; padding:28px; border:1px solid #e2d6ed; border-radius:22px; background:#ffffffb3; }
.shop-notice .notice-star { display:block; margin-bottom:14px; color:var(--purple); font-size:27px; line-height:1; }
.shop-notice h2 { font-size:23px; color:var(--purple); }
.shop-notice p { margin-top:10px; color:var(--ink-soft); font-size:15px; line-height:1.9; }
.shop-categories { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:36px; }
.shop-category { display:flex; align-items:center; gap:12px; min-height:64px; padding:14px 18px; border:1px solid var(--edge); border-radius:12px; background:var(--wash); color:var(--accent); font:500 16px/1.6 var(--head); transition:border-color .18s,box-shadow .18s; }
.shop-category .category-index { flex-shrink:0; white-space:nowrap; font:400 12px/1.4 system-ui,sans-serif; opacity:.8; }
.shop-category .category-arrow { flex-shrink:0; margin-left:auto; }
.catalog-section { padding:64px 0; background:var(--wash); border-top:1px solid var(--edge); }
.catalog-section .section-heading { align-items:start; margin-bottom:28px; }
.catalog-section .section-heading > div { min-width:0; }
.catalog-section .section-heading h2 { color:var(--accent); }
.catalog-section .section-heading > p { max-width:460px; padding-top:6px; }
.catalog-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.catalog-grid-pair { grid-template-columns:repeat(2,minmax(0,1fr)); }
.catalog-grid-feature { grid-template-columns:1fr; }
.catalog-card { min-width:0; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--edge); border-radius:20px; background:#fff; box-shadow:0 4px 14px #30263d05; }
.catalog-art { position:relative; display:grid; place-items:center; min-width:0; aspect-ratio:4/3; background:linear-gradient(140deg,#ffffffa6,var(--wash)); border-bottom:1px solid var(--edge); }
.catalog-art-kiosk { padding:12px; }
.catalog-art-kiosk img { width:100%; height:100%; max-height:190px; object-fit:contain; }
.catalog-info { display:flex; flex:1; flex-direction:column; align-items:start; padding:22px; }
.catalog-kind { display:inline-flex; align-items:center; padding:4px 10px; border:1px solid var(--edge); border-radius:999px; color:var(--accent); background:var(--wash); font-size:12px; }
.catalog-info h3 { margin-top:12px; color:var(--ink); font-size:23px; }
.catalog-description { margin-top:10px; color:var(--ink-soft); font-size:15px; line-height:1.85; }
.catalog-status { margin-top:18px; padding-left:10px; border-left:2px solid var(--edge); color:var(--ink-soft); font-size:13px; }
.catalog-price { margin-top:12px; color:var(--accent); font:500 21px/1.6 var(--head); }
.catalog-actions { display:flex; flex-wrap:wrap; gap:10px; width:100%; margin-top:auto; padding-top:18px; }
.catalog-details,.catalog-buy { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:44px; padding:9px 14px; border:1px solid var(--edge); border-radius:10px; color:var(--accent); font:500 14px/1.6 var(--head); }
.catalog-buy { background:var(--accent); color:white; border-color:var(--accent); }
.catalog-preview-label { position:absolute; left:16px; bottom:14px; right:16px; color:var(--ink-soft); text-align:center; font-size:11px; line-height:1.7; }
.catalog-grid-pair .catalog-art { aspect-ratio:16/9; min-height:280px; }
.catalog-grid-feature .catalog-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.catalog-grid-feature .catalog-art { aspect-ratio:auto; min-height:330px; border-bottom:0; border-right:1px solid var(--edge); }
.catalog-grid-feature .catalog-info { align-self:center; padding:36px; }
.catalog-grid-feature .catalog-info h3 { font-size:30px; }
.catalog-grid-feature .catalog-description { font-size:17px; }
.mug-concept { position:relative; width:170px; height:155px; margin-right:30px; border:1px solid #e2d9ce; border-radius:10px 10px 44px 44px; background:linear-gradient(90deg,#f3eee6,#fff 30%,#fff 70%,#eae1d5); box-shadow:0 14px 15px #60432812; }
.mug-concept::before { content:""; position:absolute; z-index:0; width:56px; height:82px; right:-42px; top:16px; border:13px solid #f8f3ec; border-left-width:7px; border-radius:0 32px 32px 0; box-shadow:2px 1px 0 #dfd5c8; }
.mug-concept img { position:relative; width:104px; height:auto; margin:23px auto 0; }
.merch-concept { position:relative; width:165px; height:175px; margin-top:30px; display:grid; place-items:center; border:1px solid #dbcdb8; border-radius:8px 8px 22px 22px; background:linear-gradient(105deg,#f4e6d0,#fff5e4 60%,#e8d7bc); box-shadow:0 12px 16px #6043280d; }
.merch-concept::before { content:""; position:absolute; top:-43px; width:76px; height:65px; border:9px solid #ddc8a7; border-bottom:0; border-radius:42px 42px 0 0; }
.merch-concept img { position:relative; width:110px; height:auto; }
.sticker-concept { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; width:min(80%,340px); padding:18px; }
.sticker-concept .sticker-tile { display:grid; place-items:center; aspect-ratio:1; padding:7px; border:1px solid #ecdce4; border-radius:18px; background:#ffffffd9; box-shadow:0 5px 12px #963f640c; transform:rotate(-6deg); }
.sticker-concept .sticker-tile:nth-child(even) { transform:rotate(6deg); }
.sticker-concept img { width:100%; height:100%; max-height:85px; object-fit:contain; }
.wallpaper-concept { position:relative; display:grid; place-items:center; width:136px; aspect-ratio:9/16; padding:12px; border:5px solid #30263d; border-radius:24px; background:radial-gradient(ellipse at 15% 15%,#fff4d0,transparent 55%),linear-gradient(150deg,#e1d0f6,#f9f3ff 65%,#e3eddf); box-shadow:8px 12px 22px #30263d13; }
.wallpaper-concept::before { content:""; position:absolute; top:7px; width:38px; height:8px; border-radius:8px; background:#30263d; }
.wallpaper-concept::after { content:"✧"; position:absolute; bottom:30px; color:#80602d; font-size:28px; }
.wallpaper-concept img { width:110px; height:auto; }
.shop-footer { padding-top:26px; }
:where(.shop-category,.shop-notice,.catalog-info,.catalog-preview-label) { overflow-wrap:anywhere; }
@media (hover:hover) {
  .shop-category:hover { border-color:var(--accent); box-shadow:0 4px 12px #30263d0a; }
  .catalog-details:hover { background:var(--wash); }
  .catalog-buy:hover { filter:brightness(.93); }
}
@media (max-width:1000px) {
  .shop-intro { gap:32px; }
  .catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .catalog-grid-feature { grid-template-columns:1fr; }
  .catalog-art-kiosk img { max-height:240px; }
}
@media (max-width:800px) {
  .shop-hero { padding-top:36px; }
  .shop-intro { grid-template-columns:1fr; gap:24px; }
  .shop-notice { padding:22px; }
  .shop-notice .notice-star { display:none; }
  .shop-categories { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:28px; }
  .catalog-section { padding:46px 0; }
  .catalog-grid-feature .catalog-info { padding:28px; }
}
@media (max-width:560px) {
  .shop-hero { padding:30px 0; }
  .shop-intro h1 { font-size:36px; }
  .shop-intro .intro-copy { font-size:17px; }
  .shop-category { gap:8px; padding:12px; font-size:14px; }
  .shop-category .category-index { display:none; }
  .catalog-grid { grid-template-columns:1fr; }
  .catalog-grid-feature .catalog-card { grid-template-columns:1fr; }
  .catalog-grid-feature .catalog-art { min-height:300px; border-right:0; border-bottom:1px solid var(--edge); }
  .catalog-grid-feature .catalog-info { padding:24px; }
  .catalog-grid-feature .catalog-info h3 { font-size:26px; }
  .catalog-grid-feature .catalog-description { font-size:16px; }
  .catalog-grid-pair .catalog-art { min-height:270px; }
  .catalog-section { padding:36px 0; }
}

/* Native page navigation: the header stays steady while the content changes. */
@media (prefers-reduced-motion:no-preference) {
  @view-transition { navigation:auto; }

  .site-header { view-transition-name:site-header; }

  ::view-transition-old(root) {
    animation:drhuk-page-exit 160ms ease-out both;
  }
  ::view-transition-new(root) {
    animation:drhuk-page-enter 260ms cubic-bezier(.22,1,.36,1) both;
  }
  ::view-transition-group(site-header) { animation:none; }
  ::view-transition-old(site-header) { animation:none; opacity:0; }
  ::view-transition-new(site-header) { animation:none; }

  .page-entry-fallback main,
  .page-entry-fallback footer {
    animation:drhuk-page-enter 260ms cubic-bezier(.22,1,.36,1) backwards;
  }
  .page-entry-fallback.page-entry-anchor main,
  .page-entry-fallback.page-entry-anchor footer {
    animation-name:drhuk-page-fade-in;
  }

  @keyframes drhuk-page-exit {
    from { opacity:1; }
    to { opacity:0; }
  }
  @keyframes drhuk-page-enter {
    from { opacity:0; transform:translateY(8px); }
    to { opacity:1; transform:translateY(0); }
  }
  @keyframes drhuk-page-fade-in {
    from { opacity:0; }
    to { opacity:1; }
  }
}
@media (prefers-reduced-motion:reduce) {
  @view-transition { navigation:none; }
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) { animation:none !important; }
}