/* ---------- v9: Release Resentment (burn letter) ---------- */
@font-face{font-family:"BLHand";src:url(fonts/HomemadeApple.woff2) format("woff2");font-display:block}
.scr.bl{padding:0;background:radial-gradient(120% 80% at 50% 0%,#1b1f2e 0%,#0c0e16 70%);color:#f3ece0;overflow:hidden;gap:0}
.bl .top{position:relative;z-index:5;width:100%;padding:calc(env(safe-area-inset-top) + 18px) 18px 0}
.bl .top h2{color:#f3ece0}.bl .back{color:#d6ba80}
.blStep{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;opacity:0;pointer-events:none;transition:opacity .8s}
.blStep.on{opacity:1;pointer-events:auto}
.blEye{font-size:12px;letter-spacing:.26em;text-transform:uppercase;color:#d6ba80;font-weight:500;margin-top:150px}
.blH{font-family:var(--serif);font-weight:500;font-size:36px;line-height:1.12;margin:14px 30px 18px;text-align:center}
.blP{font-family:var(--serif);font-size:21px;line-height:1.4;color:rgba(243,236,224,.82);text-align:center;margin:0 36px}
.blPriv{font:italic 400 16px var(--serif);color:rgba(214,186,128,.9);margin-top:22px;display:flex;gap:8px;align-items:center}
.blBtn{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom) + 46px);height:58px;padding:0 44px;border-radius:29px;border:1px solid #e9d5a6;background:linear-gradient(180deg,#e3c98f,#b08f57);color:#1a1520;font:500 17px var(--sans);letter-spacing:.08em;white-space:nowrap;cursor:pointer;box-shadow:0 8px 30px rgba(176,143,87,.3)}
.blBtn.ghost{background:transparent;color:#e3c98f;box-shadow:none}
.blCandleIc{width:70px;height:110px;margin-top:40px}
/* writing */
#blWrite{padding-top:calc(env(safe-area-inset-top) + 64px)}
.blHint{font:italic 400 16px var(--serif);color:rgba(243,236,224,.7);margin:0 0 10px}
.blScroll{position:relative;width:100%;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:4px 20px 130px}
.blPaper{position:relative;min-height:470px;padding:34px 26px 40px 40px;border-radius:3px;color:#2a1d12;
 background:
  radial-gradient(120% 90% at 50% 40%,rgba(255,250,235,0) 55%,rgba(120,80,30,.22) 100%),
  repeating-linear-gradient(180deg,transparent 0 33px,rgba(90,110,150,.22) 33px 34px),
  linear-gradient(90deg,transparent 28px,rgba(190,90,80,.28) 28px 29px,transparent 29px),
  #efe2c4;
 background-position:0 0,0 22px,0 0,0 0;
 box-shadow:0 18px 50px rgba(0,0,0,.55),0 2px 6px rgba(0,0,0,.3)}
.blPaper::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .32 0 0 0 0 .18 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.blText{position:relative;font-family:"BLHand",cursive;font-size:17px;line-height:34px;white-space:pre-wrap;word-wrap:break-word;min-height:34px;color:#2b1a10;text-shadow:0 0 .4px rgba(30,15,5,.7)}
.blText span{animation:blInk .9s ease-out both}
@keyframes blInk{0%{opacity:0;filter:blur(1.2px);color:#0d0806}100%{opacity:1;filter:none}}
.blPh{color:rgba(60,40,20,.38)}
.blNib{display:inline-block;width:18px;height:22px;margin-left:2px;vertical-align:-3px;transform:rotate(-30deg);transform-origin:20% 90%;animation:blNib 1.2s ease-in-out infinite}
@keyframes blNib{50%{transform:rotate(-26deg) translateY(-1px)}}
#blTa{position:absolute;inset:0;width:100%;height:100%;opacity:.01;font-size:16px;color:transparent;caret-color:transparent;background:transparent;border:0;resize:none;outline:none;padding:34px 26px 40px 40px;z-index:2}
#blWrite .blBtn{z-index:4}
/* burn */
#blBurn canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;display:block}
.blSwitch{position:absolute;z-index:4;top:calc(env(safe-area-inset-top) + 66px);left:50%;transform:translateX(-50%);display:flex;border:1px solid rgba(214,186,128,.5);border-radius:20px;overflow:hidden}
.blSwitch button{background:none;border:0;color:#e3c98f;font:400 14px var(--sans);letter-spacing:.06em;padding:8px 18px;cursor:pointer}
.blSwitch button.on{background:rgba(214,186,128,.22)}
.blTip{position:absolute;z-index:4;left:0;right:0;top:calc(env(safe-area-inset-top) + 112px);text-align:center;font:italic 400 18px var(--serif);color:rgba(243,236,224,.8);transition:opacity .8s}
#blBurn.lit .blTip,#blBurn.lit .blSwitch,#blBurn.lit .blTapBurn{opacity:0;pointer-events:none}
.blTapBurn{z-index:4;transition:opacity .6s;bottom:auto!important;top:calc(env(safe-area-inset-top) + 150px);height:46px;font-size:15px}
/* end */
#blEnd{justify-content:center;background:radial-gradient(90% 60% at 50% 45%,#1c2030,#0c0e16)}
.blFree{font-family:var(--serif);font-size:38px;line-height:1.2;text-align:center;margin:0 30px}
.blFree em{display:block;font-style:italic;color:#e3c98f}
.blBreath{width:120px;height:120px;border-radius:50%;margin:34px 0 18px;border:1px solid rgba(214,186,128,.55);background:radial-gradient(circle,rgba(227,201,143,.28),rgba(227,201,143,0) 70%);animation:blBr 10s ease-in-out infinite}
@keyframes blBr{0%,100%{transform:scale(.72)}50%{transform:scale(1.05)}}
.blBrTxt{font:italic 400 18px var(--serif);color:rgba(243,236,224,.75)}
.tqTile.blTile i{background:radial-gradient(circle at 50% 70%,#ffcf7a 0 10%,#e07a2c 22%,rgba(60,20,10,.0) 55%),linear-gradient(160deg,#2a1d18,#0f0c10)}
.scr.bl:not(.on) .blStep,.scr.bl:not(.on) *{pointer-events:none!important}