/*
Theme Name: Text Stack
Theme URI: https://inklr-com-test.local/
Author: Codex
Description: Text-first WordPress classic theme adapted from the Text Stack home and single post prototypes. It uses classic PHP templates, a dynamic posts loop, widget sidebar, menus, comments, and archive/search/page states.
Version: 0.1.10
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: textstack
*/


/* Home prototype CSS */
/*
    TEXT STACK — WordPress conventional blog home / posts index sample

    Direction:
    - This is a normal WordPress blog home, equivalent to home.php / index.php when the site shows latest posts.
    - The page frame is: header, path, main + full-height sidebar column, footer.
    - Main content is a posts loop, not a landing page and not a magazine front page.
    - No thumbnails are required. Typography, meta, rules, and bordered modules carry the design.
    - Mobile keeps the wireframe: every major area stays inside visible thin-line boxes.
  */

  :root{
    --bg:#f4f4f4;
    --panel:#ffffff;
    --panel2:#fafafa;
    --panel3:#f0f0f0;
    --line:#c9c9c9;
    --line-strong:#a9a9a9;
    --line2:#dedede;
    --ink:#101010;
    --muted:#666666;
    --soft:#888888;
    --black:#050505;
    --content:820px;
    --sidebar:405px;
    --sans:"IBM Plex Sans JP","Noto Sans TC","PingFang TC","Hiragino Sans","Yu Gothic","Noto Sans CJK JP",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --mono:"IBM Plex Mono","SFMono-Regular",Menlo,Monaco,Consolas,"Roboto Mono","Noto Sans Mono CJK JP",monospace;
  }

  *{box-sizing:border-box}

  html{
    background:var(--bg);
    -webkit-text-size-adjust:100%;
  }

  body{
    margin:0;
    color:var(--ink);
    background:
      linear-gradient(180deg, rgba(255,255,255,.68), rgba(244,244,244,.96)),
      repeating-linear-gradient(90deg, rgba(0,0,0,.018) 0 1px, transparent 1px 76px),
      repeating-linear-gradient(0deg, rgba(0,0,0,.012) 0 1px, transparent 1px 76px),
      var(--bg);
    font-family:var(--sans);
    line-height:1.74;
    letter-spacing:.008em;
    overflow-x:hidden;
  }

  a{color:inherit;text-decoration:none}
  p{margin:0}

  .shell{
    width:min(1280px, calc(100vw - 24px));
    margin:0 auto;
    padding:14px 0 48px;
  }

  .topbar{
    min-height:50px;
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:18px;
    padding:0 14px;
    background:var(--black);
    color:#fff;
    border:1px solid var(--black);
  }

  .brand{
    font-family:var(--mono);
    font-size:13px;
    letter-spacing:.07em;
    font-weight:700;
    white-space:nowrap;
  }

  .brand:before{content:"// ";color:#999}
  .brand:after{content:" .blog";color:#999;font-weight:400}

  .topbar nav{
    display:flex;
    justify-content:flex-end;
    gap:16px;
    font-family:var(--mono);
    font-size:10.5px;
    color:#d8d8d8;
    white-space:nowrap;
  }

  .hamb{display:inline-grid;gap:4px}
  .hamb i{display:block;width:19px;height:1px;background:#ddd}

  .path{
    min-height:40px;
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    align-items:center;
    padding:0 14px;
    border:1px solid var(--line);
    border-top:0;
    background:var(--panel2);
    font-family:var(--mono);
    font-size:10.5px;
    color:var(--muted);
  }

  .path span:after{content:"/";margin-left:6px;color:#999}
  .path span:last-child:after{content:"";margin:0}

  .home-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) var(--sidebar);
    gap:14px;
    align-items:start;
    margin-top:14px;
  }

  .home-layout.no-sidebar{
    display:block;
  }

  .home-layout.no-sidebar .main{
    max-width:var(--content);
    margin-inline:auto;
  }

  .main,
  .sidebar{
    border:1px solid var(--line);
    background:var(--panel);
    min-width:0;
  }

  .sidebar{
    align-self:stretch;
    background:var(--panel2);
    box-shadow:inset -1px 0 0 var(--line-strong);
  }

  .home-head{
    border-bottom:1px solid var(--line);
    background:linear-gradient(180deg,#fff,#f7f7f7);
  }

  .home-head-inner{
    padding:26px 24px 22px;
  }

  .meta{
    display:flex;
    flex-wrap:wrap;
    gap:6px 8px;
    align-items:center;
    font-family:var(--mono);
    font-size:10.5px;
    color:var(--muted);
  }

  .tag{
    display:inline-flex;
    align-items:center;
    min-height:21px;
    padding:2px 7px 1px;
    border:1px solid currentColor;
    border-radius:4px;
    line-height:1;
    font-family:var(--mono);
    font-size:10.5px;
  }

  .tag.dark{background:var(--black);color:#fff;border-color:var(--black)}
  .tag.soft{background:#e9e9e9;color:var(--ink)}

  h1{
    margin:18px 0 0;
    max-width:760px;
    font-size:clamp(30px,4.6vw,48px);
    line-height:1.04;
    letter-spacing:-.052em;
    font-weight:800;
  }

  .deck{
    margin-top:15px;
    max-width:680px;
    font-size:14.5px;
    line-height:1.84;
    color:var(--muted);
  }

  .author-summary{
    display:grid;
    grid-template-columns:auto minmax(0, 1fr);
    gap:16px;
    margin-top:18px;
    max-width:720px;
  }

  .author-summary .deck{
    margin-top:0;
  }

  .author-link{
    font-family:var(--mono);
    font-size:11px;
    margin-top:8px;
  }

  .filter-row{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    padding:12px 14px;
    border-bottom:1px solid var(--line);
    background:var(--panel2);
  }

  .filter-row ul{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    list-style:none;
    margin:0;
    padding:0;
  }

  .filter-row li{
    flex:0 0 auto;
    margin:0;
  }

  .filter-row a{
    min-height:24px;
    display:inline-flex;
    align-items:center;
    padding:2px 8px 1px;
    border:1px solid var(--line);
    background:#fff;
    font-family:var(--mono);
    font-size:10.5px;
    color:var(--muted);
  }

  .filter-row a.active,
  .filter-row .current-menu-item > a,
  .filter-row .current_page_item > a,
  .filter-row .current-menu-parent > a{
    background:var(--black);
    border-color:var(--black);
    color:#fff;
  }

  .loop-head,
  .side-head,
  .pagination-head{
    min-height:44px;
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:12px;
    align-items:center;
    padding:0 14px;
    border-bottom:1px solid var(--line);
    background:var(--panel2);
  }

  .section-id,
  .side-id{
    font-family:var(--mono);
    font-size:11.5px;
    letter-spacing:.05em;
    font-weight:700;
    white-space:nowrap;
  }

  .section-id:before,
  .side-id:before{content:"$ ";color:var(--muted)}

  .rule{height:1px;background:var(--line2)}

  .note{
    max-width:340px;
    text-align:right;
    font-size:11.5px;
    color:var(--muted);
    line-height:1.5;
  }

  .post-list{
    background:var(--panel);
  }

  .post-card{
    display:grid;
    grid-template-columns:86px minmax(0,1fr);
    gap:18px;
    padding:22px 18px;
    border-bottom:1px solid var(--line);
    background:var(--panel);
  }

  .post-card:nth-child(even){background:var(--panel2)}

  .post-card:hover{
    outline:2px solid var(--black);
    outline-offset:-2px;
  }

  .post-no{
    padding-top:2px;
    font-family:var(--mono);
    font-size:10.5px;
    color:var(--muted);
    line-height:1.5;
  }

  .post-no b{
    display:block;
    margin-top:4px;
    font-size:22px;
    line-height:1;
    letter-spacing:-.05em;
    color:rgba(0,0,0,.28);
  }

  .post-meta{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    align-items:center;
    font-family:var(--mono);
    font-size:10.5px;
    color:var(--muted);
  }

  .post-meta span:after{content:"｜";margin-left:7px;color:#999}
  .post-meta span:last-child:after{content:"";margin:0}

  .post-title{
    margin:9px 0 0;
    font-size:clamp(21px,2.8vw,30px);
    line-height:1.18;
    letter-spacing:-.035em;
    font-weight:780;
  }

  .post-title a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}

  .excerpt{
    margin-top:11px;
    max-width:660px;
    font-size:14px;
    line-height:1.82;
    color:var(--muted);
  }

  .read-more{
    display:inline-flex;
    margin-top:13px;
    padding:5px 8px 4px;
    border:1px solid var(--line);
    background:#fff;
    font-family:var(--mono);
    font-size:10.5px;
    color:var(--muted);
  }

  .read-more:hover{background:var(--black);border-color:var(--black);color:#fff}

  .sticky-post{
    background:var(--black);
    color:#fff;
  }

  .sticky-post .post-meta,
  .sticky-post .excerpt,
  .sticky-post .post-no,
  .sticky-post .read-more{color:#cfcfcf}

  .sticky-post .read-more{background:var(--black);border-color:rgba(255,255,255,.34)}
  .sticky-post .post-no b{color:rgba(255,255,255,.22)}

  .pagination{
    padding:14px;
    background:var(--panel2);
  }

  .page-links{
    display:grid;
    grid-template-columns:1fr auto 1fr;
    gap:8px;
    align-items:center;
  }

  .page-links a,
  .page-links span{
    min-height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 12px;
    border:1px solid var(--line);
    background:var(--panel);
    font-family:var(--mono);
    font-size:10.5px;
    color:var(--muted);
  }

  .page-links .current{background:var(--black);border-color:var(--black);color:#fff}

  .sidebar-inner{
    display:grid;
    gap:0;
  }

  .side-block{
    padding:14px;
    border-bottom:1px solid var(--line);
    background:var(--panel2);
  }

  .side-block:nth-child(even){background:var(--panel)}

  .side-block p{
    margin-top:10px;
    font-size:12.5px;
    line-height:1.72;
    color:var(--muted);
  }

  .side-list{
    margin:12px 0 0;
    padding:0;
    list-style:none;
    border-top:1px solid rgba(0,0,0,.13);
    font-family:var(--mono);
    font-size:10.5px;
  }

  .side-list li,
  .side-list a{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
    align-items:start;
    padding:8px 0;
    border-bottom:1px solid rgba(0,0,0,.13);
  }

  .side-list small{color:var(--muted)}

  .calendar-grid{
    margin-top:12px;
    display:grid;
    grid-template-columns:repeat(7,1fr);
    border-top:1px solid var(--line);
    border-left:1px solid var(--line);
    font-family:var(--mono);
    font-size:10px;
    color:var(--muted);
  }

  .calendar-grid span{
    min-height:28px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-right:1px solid var(--line);
    border-bottom:1px solid var(--line);
    background:#fff;
  }

  .calendar-grid .on{background:var(--black);color:#fff}

  .footer{
    margin-top:14px;
    border:1px solid var(--black);
    background:var(--black);
    color:#fff;
  }

  .footer-grid{
    display:grid;
    grid-template-columns:1.1fr .9fr .9fr;
    gap:1px;
    background:#333;
  }

  .footer-cell{
    min-height:130px;
    padding:18px;
    background:var(--black);
  }

  .footer h2,
  .footer h3{
    margin:0 0 10px;
    font-family:var(--mono);
    font-size:12px;
    letter-spacing:.06em;
  }

  .footer p,
  .footer a{
    display:block;
    font-size:12px;
    line-height:1.75;
    color:#cfcfcf;
  }

  @media(max-width:860px){
    .shell{
      width:calc(100vw - 16px);
      padding:8px 0 34px;
    }

    .topbar{
      grid-template-columns:auto 1fr auto;
      min-height:48px;
      padding:0 12px;
    }

    .topbar nav a{display:none}

    .home-layout{
      grid-template-columns:1fr;
      gap:10px;
      margin-top:10px;
    }

    .home-head-inner{
      padding:22px 16px 18px;
    }

    h1{
      font-size:31px;
      line-height:1.06;
    }

    .deck{
      font-size:14px;
      line-height:1.78;
    }

    .filter-row{
      padding:10px;
      overflow:auto;
      flex-wrap:nowrap;
      scrollbar-width:none;
    }

    .filter-row::-webkit-scrollbar{display:none}
    .filter-row ul{flex-wrap:nowrap;min-width:max-content}
    .filter-row a{flex:0 0 auto}

    .loop-head,
    .side-head,
    .pagination-head{
      display:block;
      min-height:0;
      padding:11px 12px;
    }

    .rule{display:none}

    .note{
      max-width:none;
      margin-top:6px;
      text-align:left;
      font-size:11.5px;
    }

    .post-card{
      grid-template-columns:58px minmax(0,1fr);
      gap:12px;
      padding:18px 12px;
    }

    .post-no{
      font-size:10px;
    }

    .post-no b{
      font-size:20px;
    }

    .post-title{
      font-size:21px;
      line-height:1.22;
    }

    .excerpt{
      font-size:13.5px;
      line-height:1.78;
    }

    .page-links{
      grid-template-columns:1fr 44px 1fr;
    }

    .sidebar{
      display:block;
      border:1px solid var(--line);
    }

    .side-block{
      padding:13px 12px;
    }

    .footer-grid{
      grid-template-columns:1fr;
    }
  }

/* Single prototype CSS */
/*
    TEXT STACK — Mobile-first Single Post
    Direction:
    - post.record and article.index are never placed in a right column.
    - post.record is a single horizontal category / author line.
    - article.index aligns to article content and uses the actual in-body headings.
    - The page frame is header, main/sidebar grid, then footer.
    - The sidebar occupies the full right column beside the whole main area.
    - Without sidebar, the main area stays centered at reading width.
    - Smaller title, calmer spacing, stronger thin-line frame.
    - Mobile reading is the primary layout, not a compressed desktop page.
    - Mobile keeps the wireframe as the main visual identity.
  */

  :root{
    --bg:#f4f4f4;
    --panel:#ffffff;
    --panel2:#fafafa;
    --panel3:#f0f0f0;
    --line:#c9c9c9;
    --line-strong:#a9a9a9;
    --line2:#dddddd;
    --ink:#101010;
    --muted:#666666;
    --soft:#8a8a8a;
    --black:#050505;
    --code:#f7f7f7;
    --content:720px;
    --sidebar:390px;
    --sans:"IBM Plex Sans JP","Noto Sans TC","PingFang TC","Hiragino Sans","Yu Gothic","Noto Sans CJK JP",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --mono:"IBM Plex Mono","SFMono-Regular",Menlo,Monaco,Consolas,"Roboto Mono","Noto Sans Mono CJK JP",monospace;
  }

  *{box-sizing:border-box}

  html{
    background:var(--bg);
    scroll-behavior:smooth;
    -webkit-text-size-adjust:100%;
  }

  body{
    margin:0;
    color:var(--ink);
    background:
      linear-gradient(180deg, rgba(255,255,255,.68), rgba(244,244,244,.96)),
      repeating-linear-gradient(90deg, rgba(0,0,0,.018) 0 1px, transparent 1px 76px),
      repeating-linear-gradient(0deg, rgba(0,0,0,.012) 0 1px, transparent 1px 76px),
      var(--bg);
    font-family:var(--sans);
    line-height:1.74;
    letter-spacing:.008em;
    overflow-x:hidden;
  }

  a{color:inherit;text-decoration:none}
  p{margin:0}

  .shell{
    width:min(1280px, calc(100vw - 24px));
    margin:0 auto;
    padding:14px 0 48px;
  }

  .topbar{
    height:50px;
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:18px;
    padding:0 14px;
    background:var(--black);
    color:#fff;
    border:1px solid var(--black);
  }

  .brand{
    font-family:var(--mono);
    font-size:13px;
    letter-spacing:.07em;
    font-weight:700;
    white-space:nowrap;
  }

  .brand:before{content:"// ";color:#999}
  .brand:after{content:" .blog";color:#999;font-weight:400}

  .topbar nav{
    display:flex;
    justify-content:flex-end;
    gap:16px;
    font-family:var(--mono);
    font-size:10.5px;
    color:#d8d8d8;
    white-space:nowrap;
  }

  .hamb{display:inline-grid;gap:4px}
  .hamb i{display:block;width:19px;height:1px;background:#ddd}

  .path{
    min-height:40px;
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    align-items:center;
    padding:0 14px;
    border:1px solid var(--line);
    border-top:0;
    background:var(--panel2);
    font-family:var(--mono);
    font-size:10.5px;
    color:var(--muted);
  }

  .path span:after{content:"/";margin-left:6px;color:#999}
  .path span:last-child:after{content:"";margin:0}

  .article-head{
    border:0;
    border-bottom:1px solid var(--line);
    background:var(--panel);
  }

  .headline{
    max-width:var(--content);
    margin:0 auto;
    padding:32px 24px 24px;
  }

  .meta{
    display:flex;
    flex-wrap:wrap;
    gap:6px 8px;
    align-items:center;
    font-family:var(--mono);
    font-size:10.5px;
    color:var(--muted);
  }

  .tag{
    display:inline-flex;
    align-items:center;
    min-height:21px;
    padding:2px 7px 1px;
    border:1px solid currentColor;
    border-radius:4px;
    line-height:1;
    font-family:var(--mono);
    font-size:10.5px;
  }

  .tag.dark{background:var(--black);color:#fff;border-color:var(--black)}
  .tag.soft{background:#e9e9e9;color:var(--ink)}

  h1{
    margin:20px 0 0;
    max-width:760px;
    font-size:clamp(30px, 5vw, 52px);
    line-height:1.03;
    letter-spacing:-.055em;
    font-weight:800;
  }

  .article-head .headline h1{
    font-size:clamp(24px, 3vw, 32px);
    letter-spacing:-.025em;
    line-height:1.16;
  }

  .deck{
    margin-top:18px;
    max-width:680px;
    font-size:14.5px;
    line-height:1.86;
    color:var(--muted);
  }

  .article-tools{
    border-top:1px solid var(--line);
    background:var(--panel2);
  }

  .article-tools-inner{
    max-width:var(--content);
    margin:0 auto;
    padding:0 24px;
  }

  .tool-block{
    background:transparent;
    padding:14px 0 15px;
    min-width:0;
  }

  .tool-block + .tool-block{
    border-top:1px solid var(--line);
  }

  .tool-block h2,
  .side-block h2,
  .module-head{
    margin:0;
    font-family:var(--mono);
    font-size:11.5px;
    letter-spacing:.05em;
    font-weight:700;
  }

  .mini-list{
    margin:12px 0 0;
    padding:0;
    list-style:none;
    border-top:1px solid rgba(0,0,0,.14);
    font-family:var(--mono);
    font-size:10.5px;
  }

  .mini-list li{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
    padding:7px 0;
    border-bottom:1px solid rgba(0,0,0,.14);
  }

  .mini-list small{color:var(--muted)}
  .mini-list a{overflow-wrap:anywhere}

  .record-line{
    margin:0;
    display:flex;
    align-items:center;
    gap:8px;
    white-space:nowrap;
    overflow:auto;
    scrollbar-width:none;
    font-family:var(--mono);
    font-size:12px;
    line-height:1.6;
    color:var(--ink);
  }

  .record-line::-webkit-scrollbar{display:none}

  .record-line strong{
    font-weight:700;
  }

  .record-line span{
    color:var(--soft);
  }

  .index-list{
    margin:11px 0 0;
    padding:0;
    list-style:none;
    border-top:1px solid rgba(0,0,0,.16);
  }

  .index-list li{
    border-bottom:1px solid rgba(0,0,0,.16);
  }

  .index-list a{
    display:block;
    padding:8px 0 9px;
    font-size:14.5px;
    line-height:1.52;
    letter-spacing:-.01em;
  }

  .index-list .sub{
    padding-left:16px;
    font-size:13.5px;
    color:#333;
  }

  .reading-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) var(--sidebar);
    gap:1px;
    background:var(--line);
    border-left:1px solid var(--line);
    border-right:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }

  .reading-layout.no-sidebar{
    display:block;
    background:transparent;
  }

  .reading-layout.no-sidebar .post-main{
    max-width:calc(var(--content) + 48px);
    margin:0 auto;
    border-left:1px solid var(--line);
    border-right:1px solid var(--line);
  }

  .post-main,
  .site-sidebar{
    background:var(--panel);
    min-width:0;
  }

  .content{
    max-width:var(--content);
    margin:0 auto;
    padding:38px 24px 48px;
  }

  .content > p{
    margin-top:21px;
    font-size:16.5px;
    line-height:2.02;
  }

  .content > p:first-child{margin-top:0}

  .content h2{
    margin:44px 0 0;
    padding-top:13px;
    border-top:1px solid var(--line);
    font-size:20px;
    line-height:1.42;
    letter-spacing:-.025em;
    font-weight:760;
  }

  .content h3{
    margin:30px 0 0;
    font-size:17px;
    line-height:1.44;
    letter-spacing:-.018em;
    font-weight:760;
  }

  .content blockquote{
    margin:30px 0;
    padding:16px 18px;
    border:1px solid var(--line);
    border-left:3px solid var(--black);
    background:var(--panel2);
    color:#333;
    font-size:15.5px;
    line-height:1.9;
  }

  .content pre{
    margin:30px 0;
    padding:16px;
    overflow:auto;
    border:1px solid var(--line);
    background:var(--code);
    font-family:var(--mono);
    font-size:11.5px;
    line-height:1.7;
  }

  .content ul,
  .content ol{
    margin:20px 0 0;
    padding-left:1.25em;
  }

  .content li{
    margin:8px 0;
    font-size:15.5px;
    line-height:1.86;
  }

  .note-box{
    margin:30px 0;
    padding:16px;
    border:1px solid var(--line);
    background:var(--panel3);
  }

  .note-box .label{
    display:block;
    margin-bottom:7px;
    font-family:var(--mono);
    font-size:10.5px;
    color:var(--muted);
  }

  .post-foot{
    border-top:1px solid var(--line);
    background:var(--panel2);
  }

  .foot-inner{
    max-width:var(--content);
    margin:0 auto;
    padding:18px 24px;
    display:flex;
    flex-wrap:wrap;
    gap:7px;
  }

  .site-sidebar{
    padding:14px;
    background:var(--panel2);
    box-shadow:inset -1px 0 0 var(--line-strong);
  }

  .side-block{
    border:1px solid var(--line);
    background:var(--panel);
    padding:13px;
  }

  .side-block + .side-block{margin-top:12px}

  .side-block p{
    margin-top:10px;
    font-size:12.5px;
    line-height:1.72;
    color:var(--muted);
  }

  .module{
    margin:14px;
    border:1px solid var(--line);
    background:var(--panel);
  }

  .post-foot + .module{
    margin-top:14px;
  }

  .module-head{
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:0 14px;
    border-bottom:1px solid var(--line);
    background:var(--panel2);
  }

  .module-head span:last-child{color:var(--muted);font-size:10.5px;font-weight:400}

  .prev-next,
  .related,
  .comments{
    display:grid;
    gap:1px;
    background:var(--line);
  }

  .prev-next{grid-template-columns:1fr 1fr}
  .related{grid-template-columns:repeat(2,1fr)}

  .nav-card,
  .author,
  .related-card,
  .comment-card,
  .comment-form{
    background:var(--panel);
    padding:16px;
  }

  .nav-card:last-child{text-align:right}

  .kicker{
    display:block;
    margin-bottom:8px;
    font-family:var(--mono);
    font-size:10.5px;
    color:var(--muted);
  }

  .nav-card h3,
  .related-card h3{
    margin:0;
    font-size:17px;
    line-height:1.34;
    letter-spacing:-.026em;
  }

  .author{
    display:grid;
    grid-template-columns:68px 1fr;
    gap:14px;
    align-items:start;
  }

  .avatar{
    width:68px;
    height:68px;
    border:1px solid var(--line);
    background:
      linear-gradient(135deg,#fff 0 49%,#d5d5d5 49% 51%,#f5f5f5 51% 100%);
  }

  .author h3,
  .comment-card h3{
    margin:0;
    font-size:16.5px;
    line-height:1.38;
  }

  .author p,
  .related-card p,
  .comment-card p{
    margin-top:8px;
    font-size:13px;
    line-height:1.74;
    color:var(--muted);
  }

  .field-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;
  }

  input,
  textarea{
    width:100%;
    border:1px solid var(--line);
    background:#fff;
    padding:10px 11px;
    font:13px/1.5 var(--sans);
    color:var(--ink);
  }

  textarea{min-height:108px;margin-top:9px;resize:vertical}

  button{
    margin-top:9px;
    min-width:170px;
    border:1px solid var(--black);
    background:var(--black);
    color:#fff;
    padding:11px 16px;
    font-family:var(--mono);
    font-size:10.5px;
    cursor:pointer;
  }

  footer{
    margin-top:14px;
    border:1px solid var(--black);
    background:var(--black);
    color:#fff;
    padding:18px;
    display:flex;
    justify-content:space-between;
    gap:18px;
    font-family:var(--mono);
    font-size:10.5px;
  }

  footer span:last-child{color:#cfcfcf}

  @media(max-width:920px){
    .shell{width:min(100vw - 18px,1280px)}
    .topbar{grid-template-columns:1fr auto}
    .topbar nav{justify-content:flex-end}
    .topbar nav a{display:none}
    .reading-layout{grid-template-columns:1fr}
    .site-sidebar{
      display:block;
      border-top:1px solid var(--line);
      padding:12px;
    }
  }

  @media(max-width:640px){
    .shell{
      width:calc(100vw - 16px);
      padding:8px 0 42px;
    }

    .topbar{
      height:50px;
      padding:0 13px;
      border:1px solid var(--black);
    }

    .brand{font-size:12.5px}

    .path,
    .reading-layout,
    footer{
      border-left:1px solid var(--line);
      border-right:1px solid var(--line);
    }

    .path{
      min-height:38px;
      padding:0 13px;
      font-size:10px;
      border-top:0;
    }

    .article-head{
      border-bottom:1px solid var(--line);
    }

    .headline{padding:25px 15px 21px}
    h1{margin-top:18px;font-size:30px;line-height:1.08;letter-spacing:-.04em}
    .deck{margin-top:15px;font-size:14px;line-height:1.82}
    .meta,.tag{font-size:10px}

    .article-tools{
      border-top:1px solid var(--line);
      border-bottom:1px solid var(--line);
    }

    .article-tools-inner{padding:0 15px}
    .tool-block{padding:13px 0 14px}
    .record-line{font-size:11.5px}
    .index-list a{font-size:14.5px;line-height:1.5}
    .index-list .sub{font-size:13.5px;padding-left:14px}

    .content{padding:31px 15px 42px}
    .content > p{margin-top:20px;font-size:16px;line-height:1.96}
    .content h2{margin-top:40px;font-size:18px;line-height:1.45}
    .content h3{margin-top:28px;font-size:16px;line-height:1.42}
    .content blockquote{margin:28px 0;padding:15px;font-size:15px;line-height:1.84}
    .content li{font-size:15px;line-height:1.8}

    .foot-inner{padding:16px 15px}

    .module{
      margin:12px;
      border:1px solid var(--line);
    }

    .prev-next{grid-template-columns:1fr}
    .nav-card:last-child{text-align:left}
    .nav-card,.author,.comment-card,.comment-form{padding:15px}

    .related-card{padding:14px 12px}
    .related-card h3{font-size:15.5px;line-height:1.36}
    .related-card p{font-size:12.2px;line-height:1.65}

    .author{grid-template-columns:1fr}
    .avatar{width:64px;height:64px}
    .field-row{grid-template-columns:1fr}

    .site-sidebar{
      padding:12px;
      border-top:1px solid var(--line);
      background:var(--panel2);
    }

    .side-block{
      border:1px solid var(--line);
      padding:13px;
      background:var(--panel);
    }

    footer{
      display:block;
      line-height:1.8;
      border:1px solid var(--black);
      margin-top:12px;
    }
  }

/* WordPress integration layer */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}

.screen-reader-text:focus {
  background: #fff;
  border: 1px solid var(--black);
  clip: auto !important;
  clip-path: none;
  color: var(--ink);
  display: block;
  font: 12px/1.5 var(--mono);
  height: auto;
  left: 12px;
  padding: 10px 12px;
  top: 12px;
  width: auto;
  z-index: 100000;
}

.skip-link { position: absolute; }
.shell { padding-top: 0; }
.admin-bar .shell { padding-top: 46px; }
@media (min-width: 783px) { .admin-bar .shell { padding-top: 46px; } }

.topbar {
  grid-template-columns: auto 1fr;
}

.topbar .menu-toggle {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  display: none;
  padding: 0;
  margin: 0;
  min-width: 0;
  cursor: pointer;
}

.topbar .menu-toggle:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.topbar .menu-toggle .hamb { display: inline-grid; }
.topbar nav ul { display: flex; gap: 16px; list-style: none; margin: 0; padding: 0; }
.topbar nav li { margin: 0; }
.topbar nav a { color: inherit; }
.topbar nav .current-menu-item > a,
.topbar nav .current_page_item > a { color: #fff; text-decoration: underline; text-underline-offset: 4px; }

.menu-strip {
  flex-wrap: nowrap;
  gap: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  white-space: nowrap;
}

.menu-strip::-webkit-scrollbar { display: none; }

.menu-strip ul {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  list-style: none;
  margin: 0;
  min-width: max-content;
  padding: 0;
}

.menu-strip li {
  flex: 0 0 auto;
}

.menu-strip a {
  align-items: center;
  border-right: 1px solid var(--line);
  display: flex;
  min-height: 40px;
  padding: 0 14px;
}

.menu-strip .current-menu-item > a,
.menu-strip .current_page_item > a {
  background: var(--black);
  color: #fff;
}

.footer-path {
  border-top: 1px solid var(--line);
  margin-top: 14px;
}

.footer-path + .footer {
  margin-top: 0;
}

.path a:hover,
.filter-row a:hover,
.side-list a:hover,
.mini-list a:hover { text-decoration: underline; text-underline-offset: 3px; }

.site-title-fallback { font-family: var(--mono); }
.wp-caption,
.wp-caption-text,
.gallery-caption { max-width: 100%; color: var(--muted); font-size: 12px; }
.alignleft { float: left; margin: .4rem 1.2rem 1rem 0; }
.alignright { float: right; margin: .4rem 0 1rem 1.2rem; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.bypostauthor { outline: 1px solid var(--line); }

.content img,
.post-content img,
.entry-content img { max-width: 100%; height: auto; }
.content figure { margin: 28px 0; }
.content figcaption { margin-top: 8px; font-size: 12px; color: var(--muted); font-family: var(--mono); }
.content a,
.entry-content a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.content table { width: 100%; border-collapse: collapse; margin: 28px 0; font-size: 14px; }
.content th,
.content td { border: 1px solid var(--line); padding: 9px 10px; text-align: left; }
.content .wp-block-separator { border: 0; border-top: 1px solid var(--line); margin: 32px 0; }

.home-layout.no-sidebar .main,
.reading-layout.no-sidebar .post-main { max-width: var(--content); }

.site-footer { display: block; padding: 0; }
.site-footer .footer-grid { width: 100%; }
.footer-cell ul { list-style: none; margin: 0; padding: 0; }
.footer-cell li { margin: 0 0 6px; }
.footer-cell .widget { margin: 0; }
.footer-cell .widget + .widget { margin-top: 18px; }
.footer-cell .network-links { margin: 0; }
.footer-cell .network-links-title {
  color: #fff;
  display: block;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  margin: 0 0 10px;
}
.footer-cell .network-links ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.footer-cell .network-links li {
  margin: 0 0 6px;
}
.footer-cell .network-links a {
  color: #cfcfcf;
  display: block;
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.75;
}
.footer-cell .network-links a:hover {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.footer-copyright {
  border-top: 1px solid #333;
  min-height: 46px;
  padding: 14px 24px;
}
.footer-copyright .widget,
.footer-copyright p {
  margin: 0;
}
.footer-copyright,
.footer-copyright p,
.footer-copyright a {
  color: #cfcfcf;
  font-family: var(--mono);
  font-size: 10.5px;
  line-height: 1.7;
}

.sidebar .widget,
.site-sidebar .widget { margin: 0; }
.sidebar .widget + .widget,
.site-sidebar .widget + .widget { margin-top: 0; }
.sidebar .wp-block-latest-posts,
.site-sidebar .wp-block-latest-posts {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
}
.sidebar .wp-block-latest-posts li,
.site-sidebar .wp-block-latest-posts li {
  margin: 0;
  padding: 4px 0 4px 16px;
  position: relative;
}
.sidebar .wp-block-latest-posts li::before,
.site-sidebar .wp-block-latest-posts li::before {
  color: var(--muted);
  content: "-";
  font-family: var(--mono);
  left: 0;
  position: absolute;
  top: 4px;
}
.sidebar .wp-block-search,
.site-sidebar .wp-block-search { margin-top: 10px; }
.sidebar .wp-block-search__inside-wrapper,
.site-sidebar .wp-block-search__inside-wrapper {
  align-items: stretch;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) clamp(82px, 26%, 112px);
}
.sidebar .wp-block-search__label,
.site-sidebar .wp-block-search__label {
  display: block;
  margin: 0 0 7px;
}
.sidebar input[type="search"],
.site-sidebar input[type="search"] {
  box-sizing: border-box;
  min-height: 42px;
  width: 100%;
}
.sidebar .wp-block-search__button,
.site-sidebar .wp-block-search__button {
  background: var(--black);
  border-color: var(--black);
  color: #fff;
  margin: 0;
  min-height: 42px;
  min-width: 0;
  padding-left: 12px;
  padding-right: 12px;
  width: auto;
}

.post-card.sticky { background: var(--black); color: #fff; }
.post-card.sticky .post-meta,
.post-card.sticky .excerpt,
.post-card.sticky .post-no,
.post-card.sticky .read-more { color: #cfcfcf; }
.post-card.sticky .read-more { background: var(--black); border-color: rgba(255,255,255,.34); }
.post-card.sticky .post-no b { color: rgba(255,255,255,.22); }

.loop-head,
.side-head,
.pagination-head {
  font-weight: 400;
}

.section-id,
.side-id {
  font-weight: 400;
}

.note,
.note-widget,
.note-widget p,
.note-widget :where(h1, h2, h3, h4, h5, h6),
.note-widget-title {
  font-weight: 400;
}

.note p,
.note .widget,
.note-widget,
.note-widget p,
.note-widget :where(ul, ol) {
  margin: 0;
}

.note-widget-title {
  display: block;
}

.post-card {
  grid-template-columns: 64px minmax(0,1fr);
}

.post-no b {
  display: none;
}

.page-links .nav-links { display: contents; }
.page-links .page-numbers,
.page-links .prev,
.page-links .next { min-height: 36px; display: flex; align-items: center; justify-content: center; padding: 0 12px; border: 1px solid var(--line); background: var(--panel); font-family: var(--mono); font-size: 10.5px; color: var(--muted); }
.page-links .current { background: var(--black); border-color: var(--black); color: #fff; }

.comment-list { list-style: none; margin: 0; padding: 0; }
.comment-list .children { list-style: none; margin: 1px 0 0; padding: 0 0 0 18px; }
.comment-card .comment-meta { font-family: var(--mono); font-size: 10.5px; color: var(--muted); }
.comment-card .reply { margin-top: 8px; font-family: var(--mono); font-size: 10.5px; }
.comment-form label { display: block; margin: 10px 0 5px; font-family: var(--mono); font-size: 10.5px; color: var(--muted); }
.comment-form .comment-form-cookies-consent { display: flex; gap: 8px; align-items: flex-start; }
.comment-form .comment-form-cookies-consent input { width: auto; margin-top: 4px; }
.comment-form .submit { min-width: 170px; border: 1px solid var(--black); background: var(--black); color: #fff; padding: 11px 16px; font-family: var(--mono); font-size: 10.5px; cursor: pointer; }

.not-found-search { margin-top: 16px; }

@media(max-width:920px){
  .topbar {
    grid-template-columns: minmax(0, 1fr) 48px;
    grid-template-rows: minmax(48px, auto);
    align-items: stretch;
    gap: 0;
    height: auto;
    min-height: 48px;
    padding: 0;
    overflow: visible;
    position: relative;
    z-index: 30;
  }

  .topbar .brand {
    align-items: center;
    display: flex;
    grid-column: 1;
    grid-row: 1;
    min-height: 48px;
    overflow: hidden;
    padding: 0 12px;
    text-overflow: ellipsis;
  }

  .topbar .menu-toggle {
    align-items: center;
    border-left: 1px solid #333;
    display: flex;
    grid-column: 2;
    grid-row: 1;
    justify-content: center;
    min-height: 48px;
    min-width: 48px;
  }

  .topbar nav {
    background: var(--black);
    border: 1px solid #333;
    box-shadow: 0 18px 38px rgba(0,0,0,.26);
    clip-path: inset(0 0 0 100%);
    display: block;
    justify-content: initial;
    max-height: min(420px, calc(100vh - 120px));
    opacity: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    pointer-events: none;
    position: absolute;
    right: -1px;
    top: 100%;
    transform: translateX(0);
    transition: transform .24s cubic-bezier(.4,0,.2,1), opacity .18s ease, clip-path .24s cubic-bezier(.4,0,.2,1), visibility 0s linear .24s;
    visibility: hidden;
    white-space: normal;
    width: min(320px, calc(100vw - 24px));
  }

  .topbar nav ul {
    display: grid;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .topbar nav li {
    border-top: 1px solid #333;
  }

  .topbar nav li:first-child {
    border-top: 0;
  }

  .topbar nav a {
    display: block;
    padding: 12px 14px;
  }

  .topbar.is-open nav {
    clip-path: inset(0);
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
    transition-delay: 0s;
    visibility: visible;
  }
}

@media (prefers-reduced-motion: reduce) {
  .topbar nav {
    transition: none;
    transform: none;
  }
}