/* Time capsule (time-capsule.php). Loaded after pdf-tools.css for the hero, fields, notices and
   FAQ grid. Adds: the letter-paper form with starter lines and goals, the envelope panel with
   date presets and the live countdown, the sealed card, the cancel prompt, and the opened letter
   on a night-sky background. */
.tc-hero:before{content:"2570"}
.tc-hero-stats strong{font-size:3.2rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.ct-mini-btn{background:#fff;border:1px solid var(--line)!important;color:var(--navy);border-radius:999px;padding:9px 16px;font-size:.84rem;gap:8px;white-space:nowrap;display:inline-flex;align-items:center;cursor:pointer}
.ct-mini-btn .icon{width:16px;height:16px}

/* ---------- app section ---------- */
.tc-app{padding-top:48px;background:linear-gradient(180deg,#f6f8fb 0%,#fff 320px)}
.tc-app [hidden],.tc-sky [hidden]{display:none!important}
.tc-notice{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-left:5px solid var(--blue);border-radius:14px;padding:16px 18px;margin:0 0 24px;box-shadow:0 1px 2px rgba(7,20,42,.07),0 12px 30px rgba(11,37,69,.06)}
.tc-notice>.icon{width:24px;height:24px;flex:none;color:var(--blue);margin-top:2px}
.tc-notice div{display:flex;flex-direction:column;gap:4px;font-size:.9rem;line-height:1.55;color:#4e5e72}
.tc-notice b{color:var(--navy);font-size:1rem}
.tc-notice.is-success{border-left-color:#137a45}.tc-notice.is-success>.icon{color:#137a45}
.tc-notice.is-error{border-left-color:#b32626}.tc-notice.is-error>.icon{color:#b32626}
.tc-notice.is-warn{border-left-color:#b56a00;background:#fffaf0}.tc-notice.is-warn>.icon{color:#b56a00}
.tc-notice-date{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--navy);margin-top:4px}
.tc-notice-date .icon{width:16px;height:16px}
.tc-form{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,.9fr);gap:28px;align-items:start}

/* ---------- letter paper ---------- */
.tc-paper{position:relative;background:#fffdf7;border:1px solid #eadfc4;border-radius:4px;padding:34px 38px 26px;box-shadow:0 1px 0 #fff inset,0 24px 60px rgba(60,40,10,.12),0 2px 6px rgba(60,40,10,.08);background-image:linear-gradient(90deg,transparent 54px,rgba(200,30,111,.18) 54px,rgba(200,30,111,.18) 55px,transparent 55px)}
.tc-paper::before{content:"";position:absolute;inset:0 0 auto;height:26px;background:linear-gradient(180deg,rgba(0,0,0,.03),transparent);pointer-events:none;border-radius:4px 4px 0 0}
.tc-paper-top{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.tc-inline{display:flex;align-items:baseline;gap:12px;font-size:.95rem}
.tc-inline span{flex:none;font:700 .74rem Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#a58b52;width:56px}
.tc-inline input{flex:1;border:0;border-bottom:1px dashed #d9caa5;background:transparent;padding:6px 4px;font:inherit;font-size:1.02rem;color:var(--navy);min-width:0}
.tc-inline input:focus{outline:none;border-bottom-color:var(--magenta)}
#tc-subject{font-weight:700;font-size:1.15rem}
.tc-body-field{display:block}
.tc-body-field textarea{width:100%;min-height:320px;border:0;background:repeating-linear-gradient(transparent 0 31px,#eadfc4 31px 32px);background-attachment:local;line-height:32px;font:inherit;font-size:1.05rem;color:#1f2a3a;padding:0 4px;resize:none;overflow:hidden}
.tc-body-field textarea:focus{outline:none}
.tc-body-field.is-error textarea{box-shadow:0 0 0 2px rgba(179,38,38,.35);border-radius:2px}
.tc-paper-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-top:14px}
.tc-starters{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.tc-starters small{width:100%;font-size:.72rem;color:#a58b52;font-weight:700;letter-spacing:.06em}
.tc-starters button{border:1px dashed #d9caa5;background:#fff;color:#6b5a33;border-radius:999px;padding:5px 12px;font-size:.78rem;cursor:pointer;transition:.15s}
.tc-starters button:hover{border-color:var(--magenta);color:var(--magenta);border-style:solid}
.tc-count{font:700 .72rem Manrope,sans-serif;color:#a58b52;white-space:nowrap}
.tc-goals{border:1px solid #eadfc4;border-radius:8px;padding:14px 16px 12px;margin:22px 0 0;background:#fff8e6}
.tc-goals legend{display:inline-flex;align-items:center;gap:6px;padding:0 8px;font:700 .8rem Manrope,sans-serif;color:#8a5a00;letter-spacing:.04em}
.tc-goals legend .icon{width:15px;height:15px;color:#e0a100}
.tc-goals label{display:flex;align-items:center;gap:10px;margin:6px 0}
.tc-goals label span{width:22px;height:22px;border-radius:50%;background:#fff;border:1px solid #e0cc98;display:grid;place-items:center;font:800 .72rem Manrope,sans-serif;color:#8a5a00;flex:none}
.tc-goals input{flex:1;border:0;border-bottom:1px dashed #d9caa5;background:transparent;padding:6px 4px;font:inherit;font-size:.95rem;min-width:0}
.tc-goals input:focus{outline:none;border-bottom-color:var(--magenta)}

/* ---------- envelope ---------- */
.tc-envelope{position:sticky;top:96px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;display:flex;flex-direction:column;gap:16px;box-shadow:0 1px 2px rgba(7,20,42,.07),0 20px 50px rgba(11,37,69,.08)}
.tc-envelope::before{content:"";position:absolute;inset:0 0 auto;height:6px;border-radius:14px 14px 0 0;background:repeating-linear-gradient(90deg,#0b2545 0 14px,#fff 14px 20px,var(--brand-pink) 20px 34px,#fff 34px 40px)}
.tc-envelope h2{display:flex;align-items:center;gap:8px;font-size:1.05rem;margin:6px 0 0}
.tc-envelope h2 .icon{width:20px;height:20px;color:var(--magenta)}
.tc-envelope .pdft-field.is-error input{border-color:#b32626;box-shadow:0 0 0 3px rgba(179,38,38,.15)}
.tc-envelope input[type=email],.tc-envelope input[type=date]{border:1px solid var(--line);border-radius:8px;padding:10px 12px;font:inherit;font-size:.95rem;width:100%}
.tc-envelope input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(47,111,176,.15)}
.tc-envelope .pdft-field small{font-size:.74rem;color:#687482;line-height:1.5}
.tc-presets{display:flex;gap:6px;flex-wrap:wrap;margin:2px 0 8px}
.tc-presets button{border:1px solid var(--line);background:#f6f8fb;color:var(--navy);border-radius:999px;padding:7px 12px;font-size:.8rem;font-weight:700;cursor:pointer;transition:.15s}
.tc-presets button:hover{border-color:var(--blue)}
.tc-presets button.is-active{background:var(--navy);border-color:var(--navy);color:#fff}
.tc-preview{display:flex;align-items:center;gap:8px;margin:10px 0 0;font-size:.86rem;color:#4e5e72;background:#f6f8fb;border-radius:8px;padding:9px 12px}
.tc-preview .icon{width:16px;height:16px;color:var(--blue);flex:none}
.tc-preview b{color:var(--navy)}
.tc-preview.is-error{background:#fde8e8;color:#b32626}.tc-preview.is-error .icon{color:#b32626}
.tc-submit{width:100%;justify-content:center;border-radius:14px;padding:15px 20px;font-size:1.02rem;gap:10px}
.tc-submit .icon{width:20px;height:20px}
.tc-submit:disabled{opacity:.6;cursor:wait}
.tc-fine{margin:0;font-size:.74rem;color:#687482;line-height:1.55}
.tc-draft{display:flex;align-items:center;gap:6px;margin:0;font-size:.74rem;color:#137a45;background:#e6f7ee;border-radius:4px;padding:6px 10px}
.tc-draft .icon{width:14px;height:14px}
.tc-draft button{margin-left:auto;background:none;border:0;color:#4e5e72;text-decoration:underline;font-size:.72rem;cursor:pointer}

/* ---------- night sky pages (sealed card, cancel, opened letter) ---------- */
.tc-sky{position:relative;min-height:72vh;padding:110px 0 72px;background:radial-gradient(circle at 20% 10%,rgba(200,30,111,.35),transparent 40%),radial-gradient(circle at 85% 80%,rgba(47,111,176,.4),transparent 45%),linear-gradient(170deg,#070f22 0%,#0b2545 60%,#1a0d2a 100%);color:#fff;overflow:hidden}
.tc-sky::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#fff 1px,transparent 1.3px),radial-gradient(rgba(255,255,255,.6) .8px,transparent 1.1px);background-size:140px 140px,90px 90px;background-position:0 0,40px 60px;opacity:.5;animation:tc-twinkle 6s ease-in-out infinite alternate;pointer-events:none}
@keyframes tc-twinkle{from{opacity:.35}to{opacity:.65}}
.tc-narrow{max-width:760px;position:relative}
.tc-eyebrow{display:inline-flex;align-items:center;gap:6px;font:800 .7rem Manrope,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#f2a6ff}
.tc-eyebrow .icon{width:14px;height:14px}
.tc-sealed{background:#fff;color:var(--navy);border-radius:20px;padding:44px 40px 36px;text-align:center;box-shadow:0 1px 2px rgba(7,20,42,.07),0 40px 90px rgba(0,0,0,.45);animation:tc-rise .6s var(--ease)}
@keyframes tc-rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.tc-wax{width:84px;height:84px;margin:-86px auto 18px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff6aa8,var(--brand-pink) 60%,#7a0f45);display:grid;place-items:center;color:#fff;box-shadow:0 14px 30px rgba(200,30,111,.5),0 0 0 6px #fff}
.tc-wax .icon{width:36px;height:36px}
.tc-sealed.is-cancel .tc-wax{background:radial-gradient(circle at 35% 30%,#ff8a80,#b32626 60%,#5a0f0f);box-shadow:0 14px 30px rgba(179,38,38,.45),0 0 0 6px #fff}
.tc-sealed h1{font-size:2.1rem;letter-spacing:-.03em;margin:8px 0 10px;line-height:1.15}
.tc-sealed h1 em{font-style:normal;color:var(--magenta);font-size:3.6rem;line-height:1;vertical-align:-4px;font-family:Manrope,sans-serif}
.tc-sealed>p{margin:0 auto;max-width:520px;color:#4e5e72;line-height:1.7;font-size:.98rem}
.tc-sealed-tips{list-style:none;margin:24px auto 0;padding:0;max-width:520px;display:flex;flex-direction:column;gap:10px;text-align:left}
.tc-sealed-tips li{display:flex;gap:10px;align-items:flex-start;font-size:.86rem;line-height:1.55;color:#4e5e72;background:#f6f8fb;border-radius:8px;padding:10px 14px}
.tc-sealed-tips .icon{width:18px;height:18px;flex:none;color:var(--blue);margin-top:2px}
.tc-sealed-tips a{color:var(--magenta);font-weight:700}
.tc-open-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:26px}
.tc-cancel-form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:22px}
.tc-danger{background:#b32626!important;border-color:#b32626!important}
/* the opened letter */
.tc-open-head{text-align:center;margin-bottom:28px}
.tc-open-head h1{font-size:2.4rem;letter-spacing:-.03em;margin:10px 0 8px}
.tc-open-head p{margin:0;color:#c9d6e6;font-size:.95rem}
.tc-open-head b{color:#fff}
.tc-paper-read{color:#1f2a3a;padding:48px 52px 40px;animation:tc-rise .7s var(--ease)}
.tc-stamp{position:absolute;top:22px;right:22px;display:flex;flex-direction:column;align-items:center;gap:2px;width:78px;height:78px;border:3px double var(--brand-pink);border-radius:50%;color:var(--brand-pink);transform:rotate(-12deg);justify-content:center;font:800 .58rem Manrope,sans-serif;letter-spacing:.14em;opacity:.85}
.tc-stamp .icon{width:24px;height:24px}
.tc-paper-read h2{font-size:1.5rem;margin:0 0 14px;color:var(--navy);padding-right:90px}
.tc-greeting{font-size:1.05rem;margin:0 0 14px;color:var(--navy);font-weight:600}
.tc-body{font-size:1.05rem;line-height:32px;white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere}
.tc-goals-read{margin-top:26px;border:1px solid #eadfc4;border-radius:8px;padding:14px 16px;background:#fff8e6}
.tc-goals-read b{display:block;font:700 .74rem Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#8a5a00;margin-bottom:8px}
.tc-goals-read ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.tc-goals-read label{display:flex;gap:10px;align-items:flex-start;cursor:pointer;font-size:.98rem;line-height:1.5}
.tc-goals-read input{margin-top:5px;accent-color:#137a45}
.tc-goals-read input:checked+span{text-decoration:line-through;color:#687482}
.tc-goals-read small{display:block;margin-top:8px;font-size:.72rem;color:#a58b52}
.tc-open-page .tc-fine{text-align:center;color:#9fb4c9;margin-top:18px}

/* ---------- responsive / print ---------- */
@media (max-width:980px){.tc-form{grid-template-columns:1fr}.tc-envelope{position:static}}
@media (max-width:720px){
  .tc-paper{padding:26px 20px 20px;background-image:none}
  .tc-paper-read{padding:70px 22px 26px}
  .tc-paper-read h2{padding-right:0}
  .tc-stamp{top:14px;right:14px;width:66px;height:66px;font-size:.5rem}
  .tc-inline{flex-direction:column;align-items:stretch;gap:2px}
  .tc-inline span{width:auto}
  .tc-sealed{padding:40px 22px 28px;border-radius:14px}
  .tc-sealed h1{font-size:1.7rem}.tc-sealed h1 em{font-size:2.8rem}
  .tc-open-head h1{font-size:1.8rem}
  .tc-sky{padding:90px 0 50px}
}
@media print{
  .tc-sky{background:#fff;color:#000;min-height:0;padding:0}
  .tc-sky::before,.tc-open-actions,.tc-open-page .tc-fine,header,footer,.site-header,.site-footer{display:none!important}
  .tc-paper-read{box-shadow:none;border:0}
  .tc-open-head p{color:#444}.tc-open-head b{color:#000}
}
