/* Claude Design visual adaptation. Existing routes, data and storage remain in app.js. */
:root{--paper:#fbf6ec;--ink:#4a3b32;--muted:#7a6a5e;--sea:#3f948b;--line:#ede2d0;--coral:#db726e}
body{background:#efe6d6;color:var(--ink);font-size:16px;line-height:1.8;-webkit-font-smoothing:antialiased}
#app{background:var(--paper);box-shadow:none}main{padding:30px 18px 105px;min-height:100dvh}main:before,main:after{display:none}h1,h2,h3,.welcome .catch,.primary,.count b,.more-menu strong{font-family:'Yusei Magic','Hiragino Maru Gothic ProN',sans-serif;font-weight:400;letter-spacing:.025em}h1{font-size:32px;line-height:1.45;margin-bottom:12px}p{margin-bottom:18px}.subtle,.footnote{color:var(--muted)}.top{margin-bottom:14px}.top .eyebrow{font-size:12px;color:#978778}.back{border:0;background:#ffffffd9;box-shadow:0 2px 6px #4a3b3210;width:44px;height:44px}.tag{border-radius:18px;background:#d6ece8;color:#3f7d77;padding:5px 14px;font-size:13px}.logo-flower{color:#e47c77}
nav{background:#fbf6ecf5;border-top:1px solid #eee2d0;backdrop-filter:blur(10px);padding:6px 8px max(8px,env(safe-area-inset-bottom));box-shadow:none}nav button{font-size:11px;color:#897b6e;min-height:54px}nav .ui-icon{height:25px;font-size:23px;font-weight:400;margin-bottom:3px}nav button.active{color:#368c83}.primary{background:#58aba2;border-radius:34px;justify-content:center;gap:16px;font-size:22px;box-shadow:0 4px 0 #3f877f;padding:15px 20px}
/* A cover, using the existing coast illustration as the supplied scenery substitute. */
.welcome{padding:0 0 24px;min-height:100dvh;background:linear-gradient(#cfe9ec,#eaf4ee 30%,#fbf6ec 75%);display:flex;flex-direction:column;text-align:center}.welcome .heading{padding:43px 14px 0;z-index:1}.welcome .heading .eyebrow{display:none}.welcome h1{font-size:49px;line-height:1.25;letter-spacing:.025em;margin:0 0 18px}.welcome h1 small{font-size:24px;line-height:1.6;margin-bottom:4px}.welcome .catch{font-size:19px;letter-spacing:.08em;text-decoration:underline wavy #7ec3bb;text-underline-offset:9px;text-decoration-thickness:1.5px;margin-bottom:2px}.welcome .landscape{height:390px;min-height:240px;flex:1;width:100%;object-fit:cover;object-position:48% 50%;mask-image:linear-gradient(transparent,black 14%,black 80%,transparent);background:transparent;margin-top:-4px}.welcome .bottom{padding:0 30px}.welcome .bottom>p:first-child{font-size:15px;line-height:1.9;margin:0 0 14px}.welcome .primary{max-width:280px;margin:auto;min-height:62px;letter-spacing:.12em}.welcome .cafe{font-family:inherit;font-size:12px;letter-spacing:.15em;margin:24px 0 0;color:#86786c}.welcome .subtle{font-size:11px}
/* Home and guide use the same existing plant-card component. */
.catalog{padding-top:42px}.catalog-heading{display:flex;align-items:center;justify-content:space-between;padding:0 6px}.catalog-heading h1{font-size:32px;white-space:nowrap;margin:0}.catalog-heading p{font-size:14px;margin:3px 0 0}.catalog-heading>img{width:74px;height:78px;object-fit:contain;transform:scaleX(-1)}.tap-note{font-size:13px;background:#fff;border-radius:16px;display:table;padding:5px 12px;margin:2px 6px 20px;box-shadow:0 2px 6px #4a3b3210}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.plant,.plant:nth-child(even){border:0;border-radius:26px;box-shadow:0 2px 0 #4a3b320a;padding:10px;background-image:none;text-align:left;min-width:0}.plant.card-sage{background:#e1ead4}.plant.card-lavender{background:#e6dff0}.plant.card-pink{background:#f9e0da}.plant .card-art{height:184px;padding:0;background:none!important;border-radius:0}.plant .card-art.hamayuu img{transform:scale(1.04)}.plant .card-art.hamagou img{transform:scale(1.1)}.plant .card-art.hamahirugao img{transform:scale(1.1)}.plant .meta{border:0;padding:6px 5px 4px}.plant h3{font-size:21px;margin-bottom:6px;letter-spacing:0}.plant .subtle{font-size:12px;background:#fffc;padding:3px 8px;border-radius:11px;display:inline-block;line-height:1.5}.plant .state{font-size:13px;color:#657c58;margin:7px 0 0}.card-lavender .state{color:#826b9b}.card-pink .state{color:#af645c}.catalog-cards .plant:last-child:nth-child(odd){grid-column:1/-1;display:grid;grid-template-columns:44% 1fr;align-items:center;min-height:158px;padding:10px 14px 10px 8px}.catalog-cards .plant:last-child:nth-child(odd) .card-art{height:140px}.catalog-cards .plant:last-child:nth-child(odd) .watercolor-stamp{right:auto;left:31%}.watercolor-stamp,.plant .watercolor-stamp{width:61px;height:61px;top:9px;right:7px;opacity:.95;filter:saturate(.9);transform:rotate(-13deg);mix-blend-mode:multiply}.verification-note{font-size:12px;line-height:1.8;margin:22px 4px 0}.catalog .footnote:last-child{font-size:12px;margin-top:14px}
/* Detail illustration and note. */
.detail{padding:18px 18px 110px}.detail h1{font-size:39px;margin-bottom:8px}.detail .season .tag{font-size:13px}.detail-art{position:relative;margin:12px 0 0}.detail .full-art,.detail .full-art.hamagou,.detail .full-art.hamahirugao{height:280px;margin:0;padding:4px 8px;mask-image:none;border-radius:52% 48% 55% 45%;background:radial-gradient(ellipse,#e2e9d6 30%,transparent 72%)}.detail .full-art.hamayuu{background:radial-gradient(ellipse,#c9d8bd 25%,#e1e8d5 55%,transparent 75%)}.detail .full-art.hamagou{background:radial-gradient(ellipse,#e5deee 25%,transparent 72%)}.detail .full-art.hamahirugao{background:radial-gradient(ellipse,#f7e1da 25%,transparent 72%)}.detail-art>.stamp{position:absolute;right:0;bottom:5px;top:auto;width:91px;height:91px}.illustration-note{font-size:11px;margin:4px 0 16px;color:#897b6d}.flower-intro{font-size:16px;line-height:1.95;margin:15px 10px 10px}.bird-note{margin:22px 0 16px;justify-content:flex-start;gap:8px}.bird-portrait{width:74px;height:74px;flex:0 0 74px;object-fit:contain}.bird-note p{font-size:13px;line-height:1.7;background:#fff;border:0;border-radius:19px;padding:12px 14px;box-shadow:0 3px 9px #4a3b320b;margin:0}.bird-note p:before{background:#fff;border:0;bottom:20px}.detail .bird-note{justify-content:flex-end;flex-direction:row-reverse;margin:8px 0 0;gap:4px}.detail .bird-note p{border:1px solid #cdb89a;border-radius:50%;padding:10px 18px;text-align:center;font-size:12px;box-shadow:none}.detail .bird-note p:before{left:auto;right:10px;width:8px;height:9px;bottom:-3px;border-right:1px solid #cdb89a;border-bottom:1px solid #cdb89a}.detail .bird-portrait{width:70px;height:70px;flex-basis:70px}.hint-note{margin:10px 0 20px;padding:22px 18px 14px;background:#e6ecdd;border:1px solid #86a97f33;border-radius:26px 30px 24px 28px}.hint-note h2{font-size:17px;background:#86a97f;border-radius:16px 20px 18px 14px;position:relative;margin:-37px 0 13px;padding:5px 17px}.hint-note .tips li{font-size:15px;line-height:1.65;gap:9px;margin-bottom:11px}.tips img{width:25px;height:25px;object-fit:contain}.discovery:not(:disabled){min-height:66px;font-size:24px;background:linear-gradient(#ed9991,#df7d78);border:0;border-radius:36px;box-shadow:0 4px 0 #c66662;margin-top:20px}.discovery:not(:disabled).recorded{background:#fff;color:#ca625e;border:2px solid #e8827b;box-shadow:none;font-size:18px;letter-spacing:.02em}.flower-extra{margin-top:28px}.flower-extra h2{font-family:'Yusei Magic',sans-serif}.photo-placeholder{border-color:#d7c6ab}
/* Stamp notebook, with count and empty states still derived from saved data. */
.found-page{padding-top:43px}.found-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 5px 20px}.found-heading h1{font-size:29px;margin:0;white-space:nowrap}.found-heading p{font-size:13px;margin:4px 0 0}.count{padding:0;margin:0;background:none;border:0;text-align:right;font-size:19px;line-height:1.3;white-space:nowrap}.count b{font-size:42px;color:#e57b76}.count small{font-size:12px;color:var(--muted)}.notebook{padding:15px 12px;border:1px solid #e4d6bd;border-radius:28px;background:#f6eedd;background-image:repeating-linear-gradient(180deg,transparent 0 27px,#aa8c6417 27px 28px)}.notebook .cards{gap:12px}.notebook .plant{background:#fffcf58c;border:2px dashed #d9c9ae;border-radius:22px;box-shadow:none;padding:7px;text-align:center}.notebook .card-art{height:126px}.notebook .plant h3{font-size:17px;margin:0}.notebook .plant .meta{padding:4px 0}.notebook .plant .subtle{display:none}.notebook .plant .state{font-size:11px;margin-top:3px}.notebook .plant:last-child:nth-child(odd){grid-column:1/-1}.notebook .plant:last-child:nth-child(odd) .card-art{height:120px}.notebook .stamp{width:64px;height:64px}.mystery .plant-art img{opacity:.27;filter:grayscale(1) sepia(.2)}.found-page .footnote{font-size:11px;margin-top:12px}
/* Simple horizontal menu cards and four soft rule cards. */
.more-page{padding-top:50px}.more-page>h1{margin:0 6px 26px}.more-menu{display:grid;gap:13px}.more-menu>button,.about-card{border:0;border-radius:24px;background:#f8edc3;box-shadow:none}.more-menu>button,.about-card summary{display:grid;grid-template-columns:58px 1fr 18px;align-items:center;gap:12px;min-height:91px;padding:14px 17px;text-align:left;cursor:pointer}.more-menu>button:nth-child(2){background:#dcefeb}.more-menu img,.more-menu .watercolor-motif{width:58px;height:58px;margin:0;object-fit:contain}.more-menu strong{display:block;font-size:19px;line-height:1.5}.more-menu small{display:block;font-size:12px;color:#786c59;margin-top:3px;line-height:1.5}.about-card{background:#f2e7cf}.about-card summary{list-style:none}.about-card summary::-webkit-details-marker{display:none}.about-copy{padding:4px 20px 18px;font-size:15px}.text-button{border:0;background:transparent;color:var(--sea);padding:10px 0;text-decoration:underline}.about-card summary:focus-visible{outline:3px solid var(--sea);outline-offset:3px}.about-card[open] summary>span:last-child{transform:rotate(45deg)}
main[data-page="rules"] .top .eyebrow{visibility:hidden}main[data-page="rules"] h1{line-height:1.45;margin:0 7px 8px}main[data-page="rules"]>p{margin-left:7px;font-size:14px;margin-bottom:22px}.rules{gap:12px}.rule{border:0;border-radius:25px;background:#e1ead4;padding:17px 16px;gap:15px;align-items:center;min-height:104px}.rule:nth-child(2){background:#f2e7cf}.rule:nth-child(3){background:#d6ece8}.rule:nth-child(4){background:#e6dff0}.rule-art{display:flex;align-items:center;justify-content:center;width:56px;height:56px;flex:0 0 56px;border-radius:50%;background:#fffc}.rule-art img{width:43px;height:43px;object-fit:contain}.rule h2{font-size:20px;line-height:1.5}.rule p{font-size:13px;line-height:1.65;margin:4px 0 0}main[data-page="rules"] .bird-note{margin-top:20px}
.column-card,.story{border:0;background:#f8efd9;border-radius:26px;box-shadow:none;padding:26px}.column-card h2{font-size:24px;margin-top:18px}.column-card p{font-size:16px;line-height:2}.column-card .tag,.story .tag{background:#ece1a9;color:#736442}.column-detail .story{padding:25px}.column-detail h1{font-size:27px}.column-detail .story p{line-height:2.2}.read-more{font-size:14px}
@media(max-width:360px){main{padding-left:14px;padding-right:14px}.catalog{padding-top:28px}.catalog-heading h1{font-size:28px}.catalog-heading>img{width:59px;height:68px}.catalog-heading p{font-size:12px}.plant .card-art{height:157px}.plant h3{font-size:18px}.plant .subtle,.plant .state{font-size:11px}.catalog-cards .plant:last-child:nth-child(odd){grid-template-columns:43% 1fr;min-height:146px}.catalog-cards .plant:last-child:nth-child(odd) .card-art{height:120px}.welcome h1{font-size:41px}.welcome h1 small{font-size:21px}.welcome .heading{padding-top:35px}.welcome .landscape{height:355px}.found-heading h1{font-size:25px}.found-heading p{font-size:11px}.count b{font-size:35px}.notebook{padding:12px 9px}.notebook .card-art{height:112px}.notebook .plant h3{font-size:16px}.rule{padding:14px 12px;gap:11px}.rule-art{width:45px;height:45px;flex-basis:45px}.rule-art img{width:35px;height:35px}.rule p{font-size:12px}.more-menu strong{font-size:17px}.more-menu>button,.about-card summary{grid-template-columns:48px 1fr 14px;gap:9px;padding:13px}.more-menu img,.more-menu .watercolor-motif{width:48px;height:48px}.detail h1{font-size:34px}.detail .full-art,.detail .full-art.hamagou,.detail .full-art.hamahirugao{height:250px}}
/* Keep the primary detail action visible above the unchanged bottom navigation. */
.detail .bird-note{width:max-content;max-width:100%;margin-left:auto;justify-content:flex-start}
.detail{padding-bottom:192px}
.detail .discovery:not(:disabled){position:fixed;z-index:6;bottom:88px;left:50%;transform:translateX(-50%);width:min(calc(100% - 44px),436px);margin:0;box-shadow:0 4px 0 #c66662,0 0 0 10px #fbf6eced}
.detail .discovery:not(:disabled).recorded{box-shadow:0 0 0 10px #fbf6eced}
.detail .discovery:active{transform:translate(-50%,2px)}
@media(min-width:900px){.detail .discovery:not(:disabled){left:auto;right:max(calc(8% + 22px),calc((100vw - 1060px)/2 + 22px));transform:none}}
nav svg{width:23px;height:23px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
main[data-page="rules"]{padding-top:18px}
main[data-page="rules"] h1{font-size:30px;line-height:1.35}
main[data-page="rules"]>p{margin-bottom:18px}
.rule{padding-top:12px;padding-bottom:12px;min-height:96px}
main[data-page="rules"] .bird-note{margin-top:14px}