<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:version='2' expr:dir='data:blog.languageDirection'
      xmlns='http://www.w3.org/1999/xhtml'
      xmlns:b='http://www.google.com/2005/gml/b'
      xmlns:data='http://www.google.com/2005/gml/data'
      xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
  <meta content='width=device-width, initial-scale=1' name='viewport'/>
  <meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
  <title><data:view.title.escaped/></title>
  <b:include data='blog' name='all-head-content'/>
  <b:skin><![CDATA[
/* =====================================================
   ToolKuy - Portfolio (Blogger Template)
   Theme by ToolKuy - https://github.com/adi805
   Palette: white / ink / teal accent
   Monospace labels, editorial list, generous whitespace
   ===================================================== */
:root{
  --bg:#ffffff;
  --surface:#fafafa;
  --text:#18181b;
  --muted:#52525b;
  --border:#e4e4e7;
  --accent:#0d9488;
  --accent-hover:#0f766e;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.8;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-hover);text-decoration:underline}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
::selection{background:var(--accent);color:#fff}
.container{max-width:720px;margin:0 auto;padding:0 32px}
.site-header{border-top:4px solid var(--text);padding:64px 0 40px}
.site-title{font-size:2.2rem;font-weight:800;letter-spacing:-0.03em;line-height:1.2}
.site-title a{color:var(--text)}
.site-title a:hover{color:var(--accent);text-decoration:none}
.site-description{font-family:var(--mono);color:var(--muted);font-size:.88rem;margin-top:12px;letter-spacing:.01em}
.blog-posts{padding:8px 0 64px}
.post{border-bottom:1px solid var(--border);padding:40px 0}
.post:first-child{padding-top:24px}
.post-meta{display:flex;align-items:baseline;gap:14px;margin-bottom:10px}
.post-date{font-family:var(--mono);color:var(--accent);font-size:.8rem;letter-spacing:.02em}
.post-title{font-size:1.5rem;font-weight:700;letter-spacing:-0.02em;line-height:1.3}
.post-title a{color:var(--text)}
.post-title a:hover{color:var(--accent);text-decoration:none}
.post-body{color:#3f3f46;margin-top:14px;font-size:1rem}
.post-body p{margin-bottom:1em}
.post-body a{border-bottom:1px solid var(--accent)}
.post-labels{margin-top:20px}
.label{font-family:var(--mono);color:var(--muted);font-size:.78rem;margin-right:14px;letter-spacing:.01em}
.label::before{content:"/ "}
.label:hover{color:var(--accent);text-decoration:none}
.blog-pager{display:flex;justify-content:space-between;gap:16px;padding:32px 0 16px;border-top:1px solid var(--border)}
.blog-pager a{font-family:var(--mono);font-size:.82rem;color:var(--muted)}
.blog-pager a:hover{color:var(--accent)}
.older{margin-right:auto}
.newer{margin-left:auto}
.site-footer{border-top:1px solid var(--border);padding:28px 0 48px}
.attribution{font-family:var(--mono);color:var(--muted);font-size:.78rem;text-align:center}
.attribution a{color:var(--muted)}
.attribution a:hover{color:var(--accent)}
@media (max-width:640px){
  .container{padding:0 20px}
  .site-header{padding:44px 0 28px}
  .post{padding:28px 0}
  .blog-pager{flex-direction:column}
}

]]></b:skin>
</head>
<body expr:class='data:blog.pageType'>
  <header class='site-header'>
    <div class='container'>
      <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
        <b:widget id='Header1' locked='true' title='ToolKuy (Header)' type='Header'>
          <b:includable id='main'>
            <b:if cond='data:blog.url == data:blog.homepageUrl'>
              <h1 class='site-title'><data:title/></h1>
            <b:else/>
              <h2 class='site-title'><a expr:href='data:blog.homepageUrl'><data:title/></a></h2>
            </b:if>
            <b:if cond='data:description != &quot;&quot;'>
              <p class='site-description'><data:description/></p>
            </b:if>
          </b:includable>
        </b:widget>
      </b:section>
    </div>
  </header>

  <main class='main-content'>
    <div class='container'>
      <b:section class='content' id='content' name='content' showaddelement='yes'>
        <b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>
          <b:includable id='main' var='top'>
            <b:if cond='data:blog.pageType != &quot;error_page&quot;'>
              <div class='blog-posts'>
                <b:loop values='data:posts' var='post'>
                  <b:include data='post' name='post'/>
                </b:loop>
              </div>
              <b:include name='nextprev'/>
            </b:if>
          </b:includable>
          <b:includable id='post' var='post'>
            <article class='post'>
              <div class='post-meta'>
                <span class='post-date'><data:post.dateHeader/></span>
              </div>
              <h2 class='post-title'><a expr:href='data:post.url'><data:post.title/></a></h2>
              <div class='post-body entry-content'>
                <data:post.body/>
              </div>
              <b:include data='post' name='labels'/>
            </article>
          </b:includable>
          <b:includable id='labels' var='post'>
            <b:if cond='data:post.labels'>
              <div class='post-labels'>
                <b:loop values='data:post.labels' var='label'>
                  <a class='label' expr:href='data:label.url' rel='tag'><data:label.name/></a>
                </b:loop>
              </div>
            </b:if>
          </b:includable>
          <b:includable id='nextprev'>
            <nav class='blog-pager'>
              <b:if cond='data:olderPageUrl'>
                <a class='older' expr:href='data:olderPageUrl'>← <data:olderPageTitle/></a>
              </b:if>
              <b:if cond='data:newerPageUrl'>
                <a class='newer' expr:href='data:newerPageUrl'><data:newerPageTitle/> →</a>
              </b:if>
            </nav>
          </b:includable>
          <b:includable id='status-message'/>
        </b:widget>
      </b:section>
    </div>
  </main>

  <footer class='site-footer'>
    <div class='container'>
      <b:section class='attribution-section' id='attribution' maxwidgets='1' showaddelement='no'>
        <b:widget id='Attribution1' locked='true' title='' type='Attribution'>
          <b:includable id='main'>
            <div class='attribution'>
              <span>Powered by <a href='https://www.blogger.com'>Blogger</a> · Theme by ToolKuy</span>
            </div>
          </b:includable>
        </b:widget>
      </b:section>
    </div>
  </footer>
</body>
</html>
