/* Frost Bloom: hand-lettered recipe paper, sea-glass ink and coral stamps. */
:root {
  --paper: #fffdf7;
  --paper-solid: #fffdf7;
  --ink: #244a48;
  --ink-2: #69827a;
  --line: #cbded2;
  --line-2: #a9c8b7;
  --primary: linear-gradient(155deg, #e68a73, #d96d5c);
  --bar-shadow: 0 5px 0 #b9d2c3, 0 12px 22px #315b4d21;
}
html, body { background:#e9eee5; color:var(--ink); }

.atelier-home {
  position:fixed; inset:0; z-index:1000; display:grid; place-items:center;
  padding:clamp(10px,2vw,32px); overflow-y:auto; overscroll-behavior:contain;
  background:radial-gradient(circle at 80% 18%,#fce2d5 0 11%,transparent 42%),
    repeating-linear-gradient(0deg,#e5ede5 0 2px,#e9f0e8 2px 28px);
  color:#244a48; transition:opacity .24s ease,transform .24s ease;
}
.atelier-home.is-leaving {opacity:0;transform:translateY(-10px);pointer-events:none;}
.home-paper {
  width:min(100%,1460px); min-height:min(760px,calc(100dvh - 40px));
  display:grid; grid-template-rows:auto 1fr auto;
  padding:clamp(22px,3vw,48px) clamp(24px,5vw,72px) 24px;
  border:1px solid #a8c4b4; border-radius:6px 42px 6px 6px;
  background:#fffdf7; box-shadow:14px 18px 0 #cadfd0,0 26px 70px #31564d38;
  position:relative; isolation:isolate; overflow:hidden;
}
.home-paper:before {content:"";position:absolute;inset:14px;border:1px solid #e3e9dc;border-radius:3px 29px 3px 3px;pointer-events:none;z-index:-1;}
.home-paper:after {content:"";position:absolute;width:320px;height:320px;right:-90px;top:-110px;border:1px solid #dce9dc;border-radius:50%;box-shadow:0 0 0 45px #eff5ec,0 0 0 46px #dce9dc;z-index:-1;}
.home-header,.home-footer{display:flex;align-items:center;gap:14px;letter-spacing:.12em;}
.home-header{font-size:17px;font-weight:900;}
.home-flower{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#dfece1;color:#3c7569;font-size:30px;line-height:1;}
.home-edition{margin-left:auto;color:#8ca99b;font-size:11px;white-space:nowrap;}
.home-edition i{font-style:normal;color:#d47b69;}
.home-main{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(350px,.95fr);align-items:center;gap:clamp(20px,4vw,64px);padding:32px 0;}
.home-copy{position:relative;z-index:1;}
.home-eyebrow{display:inline-block;margin-bottom:24px;border-bottom:3px solid #e28b74;padding-bottom:8px;color:#c96b59;font:800 14px/1.2 ui-monospace,monospace;letter-spacing:.15em;}
.home-copy h2{margin:0;color:#274f48;font-family:"Hiragino Maru Gothic ProN","PingFang SC","Noto Sans CJK SC",ui-rounded,sans-serif;font-size:clamp(40px,4.6vw,76px);font-weight:900;letter-spacing:-.055em;line-height:1.23;}
.home-copy h2 span,.home-copy h2 em{display:block;}
.home-copy h2 em{font-style:normal;color:#d66f5b;}
.home-description{max-width:570px;margin:26px 0 28px;color:#657c70;font-size:clamp(15px,1.45vw,19px);font-weight:600;line-height:1.9;text-wrap:pretty;}
.home-steps{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:37px;}
.home-steps span{display:inline-flex;gap:8px;align-items:center;padding:10px 13px;background:#f0f5ec;border:1px solid #d7e6d9;border-radius:100px;color:#406b5d;font-size:13px;font-weight:800;white-space:nowrap;}
.home-steps b{color:#c76b58;font:800 12px ui-monospace,monospace;}
.home-actions{display:flex;flex-wrap:wrap;align-items:center;gap:15px;}
.home-actions button{cursor:pointer;font-family:inherit;font-weight:900;transition:transform .18s ease,box-shadow .18s ease;}
.home-actions button:hover{transform:translateY(-3px);}
.home-start{display:flex;align-items:center;justify-content:space-between;gap:24px;min-width:245px;min-height:64px;padding:0 21px;border:0;border-radius:8px 23px 8px 8px;background:#db775f;color:#fffdf7;font-size:18px;box-shadow:5px 6px 0 #a94c42;}
.home-start span:last-child{font-size:25px;font-weight:400;}
.home-gallery{min-height:50px;border:0;border-bottom:2px solid #6d9988;background:transparent;color:#3c7568;font-size:15px;}
.home-art{position:relative;min-height:490px;display:grid;place-items:center;transform:rotate(-4deg);}
.home-art-halo{position:absolute;width:min(96%,520px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#f8efe2 0 48%,#dfece1 49% 69%,transparent 70%);border:2px dashed #b4d0be;}
.home-art-halo:after{content:"";position:absolute;inset:40px;border:1px solid #b3cbb9;border-radius:50%;}
.home-cup{position:relative;width:330px;height:340px;margin-top:105px;filter:drop-shadow(12px 18px 9px #4d6f6240);}
.home-cup-body{position:absolute;left:33px;right:33px;bottom:12px;height:205px;display:grid;place-items:center;clip-path:polygon(0 0,100% 0,88% 100%,12% 100%);background:linear-gradient(90deg,#f9f5ed,#e2e9dd 55%,#fbf9ef);border-top:16px solid #fffdf7;}
.home-cup-body span{color:#47786b;text-align:center;font:900 24px/1.14 ui-rounded,sans-serif;letter-spacing:.11em;transform:rotate(4deg);}
.home-scoop{position:absolute;z-index:2;width:112px;height:132px;top:9px;border-radius:48% 48% 35% 35%;border:9px solid #fff9ed;background:repeating-radial-gradient(ellipse at 50% 56%,#f8e9d6 0 8px,#d8b9aa 9px 13px,#fffaf1 14px 22px);box-shadow:inset 0 5px 15px #fff,4px 8px 6px #967d7155;}
.scoop-a{left:39px;transform:rotate(-24deg);}.scoop-b{left:112px;top:-10px;transform:rotate(4deg);}.scoop-c{right:38px;transform:rotate(24deg);}
.home-fruit{position:absolute;inset:0;pointer-events:none;}
.home-fruit img{position:absolute;object-fit:contain;filter:drop-shadow(6px 9px 4px #48645640);}
.home-strawberry{width:100px;left:14%;top:18%;transform:rotate(-23deg);}.home-kiwi{width:104px;right:7%;top:24%;transform:rotate(19deg);}.home-blueberry{width:58px;right:24%;top:5%;transform:rotate(15deg);}
.home-art-label,.home-art-sign{position:absolute;color:#3b7164;font:800 15px/1.35 ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;}
.home-art-label{top:14%;left:0;transform:rotate(-11deg);}.home-art-sign{right:0;bottom:2%;transform:rotate(9deg);text-align:right;color:#d27360;}
.home-footer{justify-content:space-between;border-top:1px solid #dce8d9;padding-top:19px;color:#769184;font-size:11px;font-weight:800;}
.home-footer b{color:#d3715d;font-size:17px;}

/* The permanent guide is an editorial note, independent of the old mascot bubble. */
.topbar .atelier-guide{display:flex;align-items:center;gap:10px;max-width:min(600px,calc(100vw - 135px));height:auto;min-height:62px;}
.atelier-menu{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none;width:59px;height:59px;border:2px solid #4f8272;border-radius:9px 21px 9px 9px;background:#ecf4eb;color:#2d665b;box-shadow:3px 4px 0 #a8cbb6;cursor:pointer;}
.atelier-menu-mark{font-size:32px;line-height:28px;color:#cb735d;}
.atelier-menu-label{font:800 9px ui-monospace,monospace;letter-spacing:.16em;}
.atelier-prompt{min-width:0;max-width:510px;padding:7px 17px 9px;border:1.5px solid #a6c3b2;border-left:5px solid #d7856e;border-radius:4px 15px 15px 4px;background:#fffcf4f5;box-shadow:3px 4px 0 #c4d7c7,0 9px 18px #587a6840;}
.atelier-prompt-label{display:block;color:#b5745e;font:800 9px/1.2 ui-monospace,monospace;letter-spacing:.12em;}
.atelier-prompt .bubble{display:block;max-width:none;margin:2px 0 0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;color:#2e5850;font-size:clamp(12px,1.3vw,16px);font-weight:800;line-height:1.35;white-space:normal;}
.atelier-prompt .bubble:before,.atelier-prompt .bubble:after{display:none;}
.atelier-prompt .bubble[data-kind=tip]{background:none;}
.past-btn{border-color:#a9cbb7;background:#f7fbf3;color:#3c7568;box-shadow:0 4px 0 #b5d1bf,0 8px 16px #46695929;}
.past-btn .ic{color:#448575;}.past-count{background:#d97963;}
.dock .tools.bar{border-color:#b7d2bd;background:#fffdf6f2;box-shadow:0 5px 0 #b7d2bd;}
.dock .tool{border-color:#d8e7d7;color:#456a5d;background:#fffefa;box-shadow:inset 0 1px #fff,0 2px 0 #dae6d9;}
.dock .tool[aria-checked=true]{border-color:#d97964;background:#fce7dd;color:#9c4f42;box-shadow:inset 0 2px #fff8f3,0 3px 0 #d57963;}
.dock .tray{border-color:#b9d4c1;background:#fffdf8f3;box-shadow:0 4px 0 #cadfcf,0 7px 18px #46695925;}
.dock .opt[aria-checked=true]{background:#e4f2e7;box-shadow:0 0 0 2.5px #6eaa8e,0 3px 7px #4669592a;}
.btn.primary,.dock .btn.primary{border-color:#b65e4e;background:var(--primary);box-shadow:0 4px 0 #a95548,0 7px 15px #86556833;}
.result{border-color:#a7c5ae;background:#fffdf7f8;box-shadow:0 5px 0 #b6d0bc,0 15px 28px #365b4c36;}
.result-title{color:#315d52;}

dialog.sheet-photo,dialog.sheet-share{border:1px solid #9abdab;border-radius:12px 32px 12px 12px;background:repeating-linear-gradient(0deg,#fffdf7 0 24px,#f6f9f0 24px 25px);box-shadow:8px 10px 0 #b2ceba,0 28px 50px #2b534b45;}
dialog.sheet-photo::backdrop,dialog.sheet-share::backdrop{background:#244a487d;}
dialog.sheet-photo .sheet-body,dialog.sheet-share .sheet-body{padding:22px;gap:16px;}
.atelier-sheet-head{display:grid;grid-template-columns:1fr auto;align-items:end;border-bottom:1px solid #c7d9ca;padding-bottom:12px;}
.atelier-sheet-head .atelier-sheet-index{grid-column:1 / -1;color:#d2765f;font:800 11px ui-monospace,monospace;letter-spacing:.17em;}
.atelier-sheet-head h2{grid-column:1;text-align:left;color:#2f6055;font-size:clamp(22px,2.2vw,30px);font-weight:900;}
.atelier-sheet-head .sheet-close{grid-column:2;grid-row:2;}
.photo-frame,.sheet-photo[data-mode] .photo-frame{border:9px solid #fffdf7;border-radius:6px;background:#e8ece2;box-shadow:0 0 0 1px #a3c1ae,8px 10px 0 #cfdfd0;}
.photo-img{border-radius:2px;}
.atelier-photo-note,.atelier-share-intro{margin:0;color:#c5725c;font:800 11px ui-monospace,monospace;letter-spacing:.13em;}
.atelier-photo-note span{color:#427c6c;font-size:18px;vertical-align:middle;}
.name-field .field-label{color:#385f53;font-weight:900;}
.name-field .field{border-radius:6px;border-color:#9cbfa9;background:#fffef9;color:#2f6055;}
.name-field .field:focus{outline:2px solid #d5856f;outline-offset:2px;}
.photo-actions .btn,.share-photo-row .btn,.share-copy{border-radius:7px 17px 7px 7px;}
.kept-row{border-radius:7px;background:#e9f3e9;color:#3f7263;}
.share-apps{border-color:#c6dccb;gap:8px;}
.share-apps .sns{border:1px solid #c8ddcb;border-radius:8px;background:#fffef9;}

/* Sweet Notes uses the same recipe-paper system as the new share print. */
.gallery{--g-ivory:#2d5a50;--g-ivory-2:#668478;--g-gold:#cf735f;--g-gold-hi:#e8a08a;--g-hair:#c6dac9;--g-serif:"Hiragino Maru Gothic ProN","PingFang SC",ui-rounded,sans-serif;background:#e9f0e7;color:#2d5a50;}
.g-page,.g-detail{background:repeating-linear-gradient(0deg,#f8fbf4 0 24px,#e7efe6 24px 25px);}
.g-head{background:#fffdf7f5;border-bottom:2px solid #a8cbb6;box-shadow:0 5px 0 #c6ddcc;}
.g-back{color:#3c7568;background:#e7f2e9;box-shadow:inset 0 0 0 2px #a8cbb6;}
.g-title{color:#2c5b50;font-weight:900;letter-spacing:.08em;}
.g-count{color:#cc7862;}
.g-item,.g-empty,.g-exhibit{background:none;}
.g-item:before,.g-empty:before,.g-exhibit:before{top:7px;width:85px;height:17px;border-radius:2px;background:#e4ad91bb;box-shadow:0 2px 4px #5375662a;transform:translateX(-50%) rotate(-5deg);}
.g-item:after,.g-empty:after,.g-exhibit:after{background:none;}
.g-frame:before{inset:4%;border:1px solid #a5c4af;border-radius:8px;background:#fffdf7;box-shadow:7px 9px 0 #c8ddc9,0 15px 30px #31574927;}
.g-frame:after{background:none;}
.g-mat{inset:9%;padding:3%;background:#e8f1e8;box-shadow:inset 0 0 0 2px #d2e3d3;}
.g-photo{background:#fffdf7;box-shadow:0 0 0 3px #fff,0 4px 12px #53756630;}
.g-photo:not([src]){background:#eef4ea;}
.g-plaque{border:1px solid #aecbb8;border-radius:7px;background:#fffdf7;color:#2d5a50;box-shadow:3px 4px 0 #c6dccb;}
.g-no,.g-plaque-name,.g-plaque-date,.g-plaque-facts{color:#2d5a50;}
.g-foot{background:#edf5ed;border-top:1px dashed #a9cbb6;box-shadow:none;}
.g-scope{color:#658274;}
.g-cta,.g-more{border:1px solid #9fc2ab;border-radius:7px 16px 7px 7px;background:#fffdf7;color:#3c7568;box-shadow:3px 4px 0 #c5dcca;}
.g-actions{border-color:#bed8c3;}.g-act{color:#3e7165;}.g-act+.g-act{border-color:#bed8c3;}
.vshow{background:radial-gradient(circle at 50% 38%,#f7f7e9 0,#dcebe0 65%,#bfd4c5 100%);}
.vs-cap,.vs-note{color:#315e53;text-shadow:none;}
.vs-kuma-img{border-radius:50%;background:#e5f1e6;padding:12%;box-shadow:0 0 0 8px #fffdf7,0 15px 25px #31574930;}
.vs-sweat,.vs-gloom,.vs-hop,.vs-paw{display:none;}
.vs-sign{background:#fffdf7;border:2px solid #a8cbb6;color:#315e53;box-shadow:0 5px 0 #bcd8c2;}

@media (min-width:900px) and (min-height:640px){
  .dock,.decor-dock.dock{border-left-color:#a8c7b0;background:linear-gradient(155deg,#f7fbf2,#e8f2e8 70%,#f8ece5);}
  .topbar .atelier-guide{max-width:min(610px,calc(100vw - var(--workshop-panel) - 28px));}
}
@media (max-width:820px){
  .home-main{grid-template-columns:1fr;gap:10px;padding-top:32px;}
  .home-art{min-height:290px;order:-1;transform:scale(.75) rotate(-4deg);margin:-60px 0 -55px;}
  .home-copy h2{font-size:clamp(38px,8vw,57px);}
  .home-description{margin:17px 0;}
  .home-steps{margin-bottom:22px;}
  .home-paper{min-height:0;}
}
@media (max-width:560px){
  .atelier-home{place-items:start center;}
  .home-paper{padding:20px 23px 16px;border-radius:4px 27px 4px 4px;}
  .home-header{font-size:15px;}
  .home-edition{font-size:8px;letter-spacing:.03em;}
  .home-art{min-height:220px;transform:scale(.55) rotate(-4deg);margin:-96px 0 -92px;}
  .home-eyebrow{margin-bottom:10px;}
  .home-description{font-size:14px;line-height:1.65;}
  .home-steps{gap:5px;}.home-steps span{padding:7px 8px;font-size:11px;gap:5px;}
  .home-actions{gap:8px;}.home-start{min-height:54px;min-width:0;width:100%;font-size:15px;}.home-gallery{font-size:13px;}
  .home-footer{font-size:9px;gap:8px;flex-wrap:wrap;}
  .topbar .atelier-guide{max-width:calc(100vw - 24px);min-height:50px;}
  .atelier-menu{width:47px;height:47px;}.atelier-menu-mark{font-size:25px;line-height:24px;}.atelier-menu-label{font-size:8px;}
  .atelier-prompt{padding:5px 9px 6px;max-width:calc(100vw - 85px);}
  .atelier-prompt-label{font-size:8px;}.atelier-prompt .bubble{font-size:12px;}
  dialog.sheet-photo,dialog.sheet-share{border-radius:16px 16px 0 0;}
  dialog.sheet-photo .sheet-body,dialog.sheet-share .sheet-body{padding:14px 17px calc(var(--sab) + 17px);}
}
@media (prefers-reduced-motion:reduce){.atelier-home,.home-actions button{transition:none;}}