.template-detail[data-astro-cid-zgccyzh5]{max-width:900px;margin:0 auto;padding:var(--space-6)}.template-detail__breadcrumbs[data-astro-cid-zgccyzh5]{font-size:var(--fs-sm);margin-bottom:var(--space-4)}.template-detail__breadcrumbs[data-astro-cid-zgccyzh5] a[data-astro-cid-zgccyzh5]{color:var(--color-primary-600);text-decoration:none}.template-detail__header[data-astro-cid-zgccyzh5]{margin-bottom:var(--space-4)}.template-detail__title[data-astro-cid-zgccyzh5]{font-size:var(--fs-2xl);font-weight:var(--fw-bold);margin-bottom:var(--space-2)}.template-detail__description[data-astro-cid-zgccyzh5]{color:var(--color-text-secondary)}.template-detail__page-share[data-astro-cid-zgccyzh5]{margin-bottom:var(--space-6);padding:var(--space-4);background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.template-detail__expression[data-astro-cid-zgccyzh5]{display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-2)}.template-detail__expression-label[data-astro-cid-zgccyzh5]{font-weight:var(--fw-semibold)}.template-detail__expression-code[data-astro-cid-zgccyzh5]{background:var(--color-bg-elevated);padding:2px 6px;border-radius:var(--radius-sm);border:1px solid var(--color-border)}.template-detail__faq[data-astro-cid-zgccyzh5]{margin-top:var(--space-10)}.template-detail__pager[data-astro-cid-zgccyzh5]{display:flex;justify-content:space-between;gap:var(--space-4);margin:var(--space-8) 0}.template-detail__pager[data-astro-cid-zgccyzh5] a[data-astro-cid-zgccyzh5]{color:var(--color-primary-600);text-decoration:none}.template-detail__related[data-astro-cid-zgccyzh5]{margin-top:var(--space-10)}.template-detail__related[data-astro-cid-zgccyzh5] ul[data-astro-cid-zgccyzh5]{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--space-2)}@media(max-width:768px){.template-detail[data-astro-cid-zgccyzh5]{padding:var(--space-4)}}.navbar{position:sticky;top:0;z-index:100;background:var(--color-bg);border-bottom:1px solid var(--color-border);box-shadow:var(--shadow-sm)}.navbar__container{max-width:1200px;margin:0 auto;padding:var(--space-4) var(--space-6);display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}.navbar__brand{text-decoration:none;color:var(--color-text);display:flex;align-items:center}.navbar__title{font-size:var(--fs-lg);font-weight:var(--fw-bold);margin:0;transition:var(--transition-fast)}.navbar__brand:hover .navbar__title{color:var(--color-primary-600)}.navbar__nav{display:flex;align-items:center;gap:var(--space-4);margin-left:auto;margin-right:var(--space-4)}.navbar__link{color:var(--color-text-secondary);text-decoration:none;font-size:var(--fs-base);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);transition:var(--transition-fast)}.navbar__link:hover{color:var(--color-primary-600);background:var(--color-bg-hover)}.navbar__controls{display:flex;align-items:center;gap:var(--space-2)}.navbar__theme-button{background:transparent;border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);font-size:var(--fs-lg);cursor:pointer;transition:var(--transition-fast);display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}.navbar__theme-button:hover{background:var(--color-bg-hover);border-color:var(--color-primary-300)}.navbar__theme-button:active{transform:scale(.95)}.dark-theme .navbar__theme-button{background:var(--color-neutral-800);border-color:var(--color-neutral-700)}.dark-theme .navbar__theme-button:hover{background:var(--color-neutral-700);border-color:var(--color-primary-400)}.dark-theme .navbar__link:hover{background:var(--color-neutral-800)}@media(max-width:640px){.navbar__container{padding:var(--space-3) var(--space-4)}.navbar__title{font-size:var(--fs-base)}.navbar__nav{margin-right:var(--space-2)}.navbar__link{font-size:var(--fs-sm);padding:var(--space-1) var(--space-2)}.navbar__theme-button{min-width:40px;min-height:40px;padding:var(--space-1) var(--space-2)}}.social-share{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;margin:var(--space-4) 0;position:relative}.social-share__label{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--color-text-secondary)}.social-share__buttons{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}.social-share__button{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-elevated);cursor:pointer;transition:var(--transition-fast);color:var(--color-text)}.social-share__button:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.social-share__button:active{transform:translateY(0)}.social-share__button--twitter{color:#1da1f2}.social-share__button--twitter:hover{background:#1da1f2;color:#fff;border-color:#1da1f2}.social-share__button--line{color:#00b900}.social-share__button--line:hover{background:#00b900;color:#fff;border-color:#00b900}.social-share__button--facebook{color:#1877f2}.social-share__button--facebook:hover{background:#1877f2;color:#fff;border-color:#1877f2}.social-share__button--hatena{color:#00a4de}.social-share__button--hatena:hover{background:#00a4de;color:#fff;border-color:#00a4de}.social-share__button--pocket{color:#ef4056}.social-share__button--pocket:hover{background:#ef4056;color:#fff;border-color:#ef4056}.social-share__button--copy{color:var(--color-primary-600)}.social-share__button--copy:hover{background:var(--color-primary-600);color:#fff;border-color:var(--color-primary-600)}.social-share__copied{position:absolute;top:100%;right:0;margin-top:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--color-success, #10b981);color:#fff;font-size:var(--fs-sm);border-radius:var(--radius-md);box-shadow:var(--shadow-md);animation:fadeInOut 3s ease-in-out}@keyframes fadeInOut{0%{opacity:0;transform:translateY(-10px)}10%{opacity:1;transform:translateY(0)}90%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px)}}.dark-theme .social-share__button{background:var(--color-bg-elevated);border-color:var(--color-border);color:var(--color-text)}.dark-theme .social-share__button:hover{box-shadow:var(--shadow-md)}.dark-theme .social-share__copied{background:var(--color-success-600);color:#fff}@media(max-width:640px){.social-share{flex-direction:column;align-items:flex-start}.social-share__buttons{width:100%;justify-content:flex-start;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:var(--space-2)}.social-share__button{min-width:40px;min-height:40px;flex-shrink:0}.social-share__copied{right:auto;left:0}}.template-calculator{max-width:800px;margin:0 auto;padding:var(--space-4);background:var(--color-bg-elevated);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}.template-calculator__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-4);padding-bottom:var(--space-3);border-bottom:1px solid var(--color-border)}.template-calculator__title{font-size:var(--fs-xl);font-weight:var(--fw-semibold);margin:0}.template-calculator__add-button{padding:var(--space-2) var(--space-4);background:var(--color-primary-500);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--fs-sm);cursor:pointer;transition:var(--transition-fast)}.template-calculator__add-button:hover{background:var(--color-primary-600)}.template-calculator__categories{display:flex;gap:var(--space-2);margin-bottom:var(--space-3);flex-wrap:wrap}.template-calculator__category{padding:var(--space-1) var(--space-3);background:transparent;color:var(--color-text-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--fs-sm);cursor:pointer;transition:var(--transition-fast)}.template-calculator__category:hover{background:var(--color-bg-hover)}.template-calculator__category.is-active{background:var(--color-primary-100);color:var(--color-primary-700);border-color:var(--color-primary-300)}.template-calculator__list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-3);margin-bottom:var(--space-4);max-height:400px;overflow-y:auto}.template-calculator__empty{grid-column:1 / -1;text-align:center;padding:var(--space-6);color:var(--color-text-secondary)}.template-calculator__item{padding:var(--space-3);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-fast)}.template-calculator__item:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.template-calculator__item.is-selected{border-color:var(--color-primary-500);background:var(--color-primary-50)}.template-calculator__item-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-2)}.template-calculator__item-name{font-size:var(--fs-md);font-weight:var(--fw-medium);margin:0}.template-calculator__item-category{padding:2px 6px;background:var(--color-neutral-200);color:var(--color-neutral-700);font-size:var(--fs-xs);border-radius:var(--radius-sm)}.template-calculator__item-expression{font-family:var(--font-mono);font-size:var(--fs-sm);color:var(--color-text-secondary);margin-bottom:var(--space-2);padding:var(--space-2);background:var(--color-neutral-100);border-radius:var(--radius-sm)}.template-calculator__item-description{font-size:var(--fs-sm);color:var(--color-text-secondary);margin-bottom:var(--space-2)}.template-calculator__item-actions{display:flex;gap:var(--space-2);margin-top:var(--space-2)}.template-calculator__item-action{padding:var(--space-1) var(--space-2);background:var(--color-bg-elevated);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--fs-xs);cursor:pointer;transition:var(--transition-fast)}.template-calculator__item-action:hover{background:var(--color-bg-hover)}.template-calculator__item-action--delete{color:var(--color-danger);border-color:var(--color-danger-200)}.template-calculator__item-action--delete:hover{background:var(--color-danger-50)}.template-calculator__calc{padding:var(--space-4);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--space-3)}.template-calculator__calc-title{font-size:var(--fs-lg);font-weight:var(--fw-medium);margin:0 0 var(--space-2) 0}.template-calculator__calc-expression{font-family:var(--font-mono);font-size:var(--fs-sm);color:var(--color-text-secondary);padding:var(--space-2);background:var(--color-neutral-100);border-radius:var(--radius-sm);margin-bottom:var(--space-3)}.template-calculator__variables{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--space-3);margin-bottom:var(--space-3)}.template-calculator__variable{display:flex;align-items:center;gap:var(--space-2)}.template-calculator__variable-label{font-weight:var(--fw-medium);min-width:30px}.template-calculator__variable-input{flex:1;padding:var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--fs-md);font-family:var(--font-mono)}.template-calculator__variable-input:focus{outline:2px solid var(--color-focus);outline-offset:-1px}.template-calculator__calc-button{width:100%;padding:var(--space-3);background:var(--color-success-500);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--fs-md);font-weight:var(--fw-medium);cursor:pointer;transition:var(--transition-fast)}.template-calculator__calc-button:hover{background:var(--color-success-600)}.template-calculator__result{display:flex;justify-content:center;align-items:center;gap:var(--space-3);padding:var(--space-4);margin-top:var(--space-3);background:var(--color-success-50);border:1px solid var(--color-success-200);border-radius:var(--radius-md)}.template-calculator__result-label{font-size:var(--fs-md);color:var(--color-text-secondary)}.template-calculator__result-value{font-size:var(--fs-2xl);font-weight:var(--fw-semibold);color:var(--color-success-700);font-family:var(--font-mono)}.template-calculator__example{margin-top:var(--space-2);padding:var(--space-2);background:var(--color-info-50);border-left:3px solid var(--color-info-500);border-radius:var(--radius-sm);font-size:var(--fs-sm);color:var(--color-text-secondary)}.template-calculator__error{padding:var(--space-3);background:var(--color-danger-50);border:1px solid var(--color-danger-200);border-radius:var(--radius-md);color:var(--color-danger-700);margin-top:var(--space-3)}.template-calculator__modal{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.template-calculator__modal-content{background:var(--color-bg-elevated);border-radius:var(--radius-lg);padding:var(--space-5);max-width:500px;width:90%;max-height:80vh;overflow-y:auto}.template-calculator__modal-title{font-size:var(--fs-xl);font-weight:var(--fw-semibold);margin:0 0 var(--space-4) 0}.template-calculator__form{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-4)}.template-calculator__form-field{display:flex;flex-direction:column;gap:var(--space-1)}.template-calculator__form-field label{font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--color-text-secondary)}.template-calculator__form-field input,.template-calculator__form-field textarea{padding:var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--fs-md)}.template-calculator__form-field textarea{min-height:80px;resize:vertical}.template-calculator__form-help{font-size:var(--fs-xs);color:var(--color-text-secondary);margin-top:var(--space-1)}.template-calculator__modal-actions{display:flex;gap:var(--space-2);justify-content:flex-end}.template-calculator__modal-button{padding:var(--space-2) var(--space-4);border:none;border-radius:var(--radius-md);font-size:var(--fs-md);cursor:pointer;transition:var(--transition-fast)}.template-calculator__modal-button--save{background:var(--color-primary-500);color:#fff}.template-calculator__modal-button--save:hover{background:var(--color-primary-600)}.template-calculator__modal-button--cancel{background:var(--color-neutral-200);color:var(--color-text)}.template-calculator__modal-button--cancel:hover{background:var(--color-neutral-300)}@media(prefers-color-scheme:dark){.template-calculator__item{background:var(--color-neutral-800)}.template-calculator__item.is-selected{background:var(--color-primary-900)}.template-calculator__item-category{background:var(--color-neutral-700);color:var(--color-neutral-200)}.template-calculator__item-expression,.template-calculator__calc-expression,.template-calculator__calc{background:var(--color-neutral-800)}.template-calculator__result{background:var(--color-success-900);border-color:var(--color-success-700)}.template-calculator__result-value{color:var(--color-success-200)}.template-calculator__example{background:var(--color-info-900);border-color:var(--color-info-600)}.template-calculator__error{background:var(--color-danger-900);border-color:var(--color-danger-700);color:var(--color-danger-200)}.template-calculator__category.is-active{background:var(--color-primary-900);color:var(--color-primary-200);border-color:var(--color-primary-600)}}.dark-theme .template-calculator__item{background:var(--color-neutral-800)}.dark-theme .template-calculator__item.is-selected{background:var(--color-primary-900)}.dark-theme .template-calculator__item-category{background:var(--color-neutral-700);color:var(--color-neutral-200)}.dark-theme .template-calculator__item-expression,.dark-theme .template-calculator__calc-expression,.dark-theme .template-calculator__calc{background:var(--color-neutral-800)}.dark-theme .template-calculator__result{background:var(--color-success-900);border-color:var(--color-success-700)}.dark-theme .template-calculator__result-value{color:var(--color-success-200)}.dark-theme .template-calculator__example{background:var(--color-info-900);border-color:var(--color-info-600)}.dark-theme .template-calculator__error{background:var(--color-danger-900);border-color:var(--color-danger-700);color:var(--color-danger-200)}.dark-theme .template-calculator__category.is-active{background:var(--color-primary-900);color:var(--color-primary-200);border-color:var(--color-primary-600)}.template-form{padding:var(--space-4)}.template-form__header{margin-bottom:var(--space-4)}.template-form__title{font-size:var(--fs-xl);font-weight:var(--fw-semibold);margin:0 0 var(--space-2) 0}.template-form__description{font-size:var(--fs-base);color:var(--color-text-secondary);margin:0}.template-form__expression{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3);background:var(--color-neutral-100);border-radius:var(--radius-md);margin-bottom:var(--space-4)}.template-form__expression-label{font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--color-text-secondary)}.template-form__expression-code{font-family:var(--font-mono);font-size:var(--fs-md);color:var(--color-text);flex:1}.template-form__variables{display:grid;gap:var(--space-3);margin-bottom:var(--space-4)}.template-form__variable{display:flex;flex-direction:column;gap:var(--space-1)}.template-form__variable-label{font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--color-text)}.template-form__variable-input{padding:var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--fs-md);font-family:var(--font-mono);transition:var(--transition-fast)}.template-form__variable-input:focus{outline:2px solid var(--color-focus);outline-offset:-1px}.template-form__calc-button{width:100%;padding:var(--space-3);background:var(--color-primary-500);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--fs-md);font-weight:var(--fw-medium);cursor:pointer;transition:var(--transition-fast)}.template-form__calc-button:hover:not(:disabled){background:var(--color-primary-600)}.template-form__calc-button:disabled{opacity:.5;cursor:not-allowed}.template-form__result{display:flex;justify-content:center;align-items:center;gap:var(--space-3);padding:var(--space-4);margin-top:var(--space-4);background:var(--color-success-50);border:1px solid var(--color-success-200);border-radius:var(--radius-md)}.template-form__result-label{font-size:var(--fs-md);color:var(--color-text-secondary)}.template-form__result-value{font-size:var(--fs-2xl);font-weight:var(--fw-semibold);color:var(--color-success-700);font-family:var(--font-mono)}.template-form__error{padding:var(--space-3);background:var(--color-danger-50);border:1px solid var(--color-danger-200);border-radius:var(--radius-md);color:var(--color-danger-700);margin-top:var(--space-4)}.template-form__example{display:flex;gap:var(--space-2);margin-top:var(--space-4);padding:var(--space-3);background:var(--color-info-50);border-left:3px solid var(--color-info-500);border-radius:var(--radius-sm)}.template-form__example-label{font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--color-info-700)}.template-form__example-text{font-size:var(--fs-sm);color:var(--color-text-secondary)}@media(prefers-color-scheme:dark){.template-form__expression{background:var(--color-neutral-800)}.template-form__result{background:var(--color-success-900);border-color:var(--color-success-700)}.template-form__result-value{color:var(--color-success-200)}.template-form__error{background:var(--color-danger-900);border-color:var(--color-danger-700);color:var(--color-danger-200)}.template-form__example{background:var(--color-info-900);border-color:var(--color-info-600)}}.dark-theme .template-form__expression{background:var(--color-neutral-800)}.dark-theme .template-form__result{background:var(--color-success-900);border-color:var(--color-success-700)}.dark-theme .template-form__result-value{color:var(--color-success-200)}.dark-theme .template-form__error{background:var(--color-danger-900);border-color:var(--color-danger-700);color:var(--color-danger-200)}.dark-theme .template-form__example{background:var(--color-info-900);border-color:var(--color-info-600)}.template-form__share{margin-top:var(--space-6);padding-top:var(--space-4);border-top:1px solid var(--color-border)}.template-form__share-title{font-size:var(--fs-lg);font-weight:var(--fw-semibold);margin:0 0 var(--space-3) 0}.template-form__share-option{margin-bottom:var(--space-4)}.template-form__share-label{font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--color-text-secondary);margin:0 0 var(--space-2) 0}@media(max-width:600px){.template-calculator{padding:var(--space-3);border-radius:0}.template-calculator__list{grid-template-columns:1fr}.template-calculator__modal-content{width:100%;height:100%;max-height:100vh;border-radius:0}.template-form{padding:var(--space-3)}.template-form__variables{grid-template-columns:1fr}.template-form__share{margin-top:var(--space-4);padding-top:var(--space-3)}}.template-detail{padding:var(--space-4)}.template-detail--compact{padding:var(--space-3)}.template-detail__section{margin-bottom:var(--space-4)}.template-detail__section:last-child{margin-bottom:0}.template-detail__section-title{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--color-text-secondary);margin-bottom:var(--space-2);text-transform:uppercase;letter-spacing:.05em}.template-detail__expression{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3)}.template-detail__expression code{font-family:SF Mono,Monaco,Inconsolata,Fira Code,Droid Sans Mono,Source Code Pro,monospace;font-size:var(--fs-base);color:var(--color-primary-600);word-break:break-all}.template-detail__variables{display:flex;flex-wrap:wrap;gap:var(--space-2)}.template-detail__variable-badge{display:inline-flex;align-items:center;padding:var(--space-1) var(--space-3);background:var(--color-secondary-100);color:var(--color-secondary-700);border-radius:var(--radius-sm);font-size:var(--fs-sm);font-weight:var(--fw-medium);font-family:SF Mono,Monaco,monospace}.template-detail__example{background:var(--color-success-50);border:1px solid var(--color-success-200);border-radius:var(--radius-md);padding:var(--space-3)}.template-detail__example code{font-family:SF Mono,Monaco,monospace;font-size:var(--fs-sm);color:var(--color-success-700)}.template-detail__description{color:var(--color-text);line-height:1.6;margin:0}.template-detail__faqs{margin:0}.template-detail__faq-item{margin-bottom:var(--space-4);padding-bottom:var(--space-4);border-bottom:1px solid var(--color-border)}.template-detail__faq-item:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.template-detail__faq-question{font-size:var(--fs-base);font-weight:var(--fw-semibold);color:var(--color-text);margin-bottom:var(--space-2)}.template-detail__faq-question:before{content:"Q: ";color:var(--color-primary-500);font-weight:var(--fw-bold)}.template-detail__faq-answer{font-size:var(--fs-sm);color:var(--color-text-secondary);line-height:1.6;margin:0;margin-left:var(--space-4)}.template-detail__faq-answer:before{content:"A: ";color:var(--color-success-600);font-weight:var(--fw-semibold);margin-left:calc(var(--space-4) * -1)}@media(prefers-color-scheme:dark){.template-detail__expression code{color:var(--color-primary-300)}.template-detail__variable-badge{background:var(--color-neutral-700);color:var(--color-secondary-300)}.template-detail__example{background:var(--color-neutral-800);border-color:var(--color-success-800)}.template-detail__example code{color:var(--color-success-300)}}.dark-theme .template-detail__expression code{color:var(--color-primary-300)}.dark-theme .template-detail__variable-badge{background:var(--color-neutral-700);color:var(--color-secondary-300)}.dark-theme .template-detail__example{background:var(--color-neutral-800);border-color:var(--color-success-800)}.dark-theme .template-detail__example code{color:var(--color-success-300)}@media(max-width:768px){.template-detail{padding:var(--space-3)}.template-detail__expression code,.template-detail__example code{font-size:var(--fs-sm)}.template-detail__faq-answer{margin-left:0}.template-detail__faq-answer:before{margin-left:0}}