:root{color-scheme:dark;font-family:Georgia,'Times New Roman',serif;background:#28272d;color:#f4e8e3}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 0%,#51404c 0%,#302b34 48%,#272a2b 100%);min-height:100vh}.app{max-width:850px;margin:auto;padding:22px 18px 45px;position:relative;isolation:isolate}.app:before,.app:after{content:'';position:absolute;pointer-events:none;z-index:-1;background:url('botanical.svg') center/contain no-repeat;opacity:.62;width:225px;height:295px;top:0}.app:before{left:-85px;transform:rotate(-15deg)}.app:after{right:-85px;transform:scaleX(-1) rotate(-15deg)}header{display:flex;justify-content:space-between;align-items:center;text-align:center;margin:16px 0 25px;gap:15px}header>div{flex:1}header small{color:#e4c18f;letter-spacing:.22em;font-size:.7rem;font-weight:700}h1{font-weight:400;font-style:italic;font-size:clamp(2.2rem,6vw,3.8rem);margin:7px 0;text-shadow:0 2px 10px #241b26}header p,p{color:#d9c5c9;line-height:1.55}header p{margin:0}.leaf{color:#d9b982;font-size:2.5rem}.notice{border:1px solid #9b7a69;background:#42383e;color:#f0d4b4;border-radius:12px;padding:12px;font: .85rem/1.5 system-ui,sans-serif;margin-bottom:18px}nav{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:22px}button{border:1px solid #a57c87;background:linear-gradient(150deg,#684d5b,#493b4a);color:#f7e8e5;padding:13px 9px;border-radius:12px;cursor:pointer;font:600 .94rem Georgia,serif;box-shadow:inset 0 0 0 1px #ffffff13}nav button{font-size:.93rem}button:hover,button.active{background:linear-gradient(140deg,#7b5c6a,#605268);border-color:#dfb986;color:#ffe6b6}.primary{background:linear-gradient(130deg,#d7b77e,#e8d0a1);color:#302630;border:0;margin-top:15px;font-weight:bold}article{border:1px solid #9e7d77;background:linear-gradient(135deg,#4c424aee,#38383fee);border-radius:18px;padding:21px;margin-bottom:16px;box-shadow:0 7px 20px #15131a4d,inset 0 0 0 1px #d4b6a91c;position:relative}article:before{content:'❧';position:absolute;top:9px;right:13px;color:#b5a78a;font-size:1.1rem;opacity:.8}article h2{font-size:1.35rem;font-weight:normal;color:#f4d6d6;margin:0 0 14px}.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}.tiles article{display:flex;flex-direction:column;gap:12px;background:linear-gradient(145deg,#66515e,#4b4b4f)}.tiles strong{font-size:1.75rem;color:#fff1e5;font-weight:normal}.tiles label{font-size:.9rem;color:#e7cfd2}label{display:block;font-size:.95rem;color:#f0d9df;margin:14px 0 5px}input,select,textarea{width:100%;border:1px solid #957d86;border-radius:10px;background:#2e2b34;color:#fff0e9;padding:12px;font:1rem system-ui,sans-serif}input:focus,select:focus,textarea:focus{outline:2px solid #e1bd83}form>.primary{width:100%}.two{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.inline{display:flex;gap:8px;margin-top:14px}.inline input{min-width:0}.page{display:none}.page.active{display:block}.chartbox{margin-top:18px;background:#2f3037;border:1px solid #6f626b;border-radius:12px;padding:8px}svg{width:100%;height:auto;min-height:200px}.checkrow{display:flex;gap:12px;align-items:center;padding:9px 0;border-bottom:1px solid #786a73}.checkrow input{width:19px;height:19px;accent-color:#c9a77e}footer{text-align:center;color:#c7adb7;font-size:.8rem;margin-top:22px}.hero-ornament{height:85px;margin:-5px auto 12px;background:url('botanical.svg') center 44%/200px auto no-repeat;opacity:.7;filter:sepia(.25)}.rituals{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:10px 0 20px}.ritual{border:1px solid #9e7d77;background:linear-gradient(145deg,#675060,#4d4654);border-radius:13px;min-height:105px;padding:14px 6px;text-align:center;display:flex;flex-direction:column;justify-content:center;gap:10px;color:#f5e4e2}.ritual:nth-child(even){background:linear-gradient(145deg,#4d6054,#3c4744)}.ritual .symbol{font-size:1.7rem;color:#e6c38c}.ritual span:last-child{font-size:.85rem}.section-title{font-weight:normal;color:#f3d7db;font-size:1.5rem;margin:18px 0 12px}.ornamental{border-block:1px solid #ac8c7b;padding:12px;text-align:center;color:#e3c397;font-style:italic;margin:12px 0 20px;background:#42363e8a}.chartbox svg{min-height:170px}@media(max-width:500px){.app{padding:14px 11px}.app:before,.app:after{width:130px;top:0;opacity:.4}.app:before{left:-55px}.app:after{right:-55px}header{margin:12px 0 20px}nav button{font-size:.78rem;padding:12px 3px}.tiles strong{font-size:1.4rem}.rituals{grid-template-columns:repeat(2,1fr)}.ritual{min-height:95px}}

/* v0.4: real botanical illustration image assets integrated into the actual app */
body{background:radial-gradient(ellipse at 50% 0%,#55404e 0%,#342c35 45%,#28292b 100%)}
.app{max-width:1060px;padding-left:clamp(16px,4vw,48px);padding-right:clamp(16px,4vw,48px)}
.app:before,.app:after{background:none;display:none}
.app{background-image:url('assets/botanical-left.png'),url('assets/botanical-right.png');background-position:left top,right top;background-size:clamp(180px,30%,315px) auto,clamp(180px,30%,309px) auto;background-repeat:no-repeat}
header{min-height:195px;padding:18px clamp(40px,13vw,130px);margin:0 0 14px;position:relative}
header small{letter-spacing:.2em}
header h1{font-size:clamp(2.4rem,5vw,4.2rem)}
header .leaf{display:none}
.hero-ornament{height:45px;background:none;opacity:1;text-align:center;color:#d9b982;font-size:1.5rem;letter-spacing:1em;margin:4px auto 18px}
.hero-ornament span{display:block}
.rituals{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.ritual{min-height:160px;padding:12px 8px 16px;gap:5px;overflow:hidden;align-items:center;justify-content:space-between;background:linear-gradient(145deg,#65505d,#463d48)}
.ritual:nth-child(even){background:linear-gradient(145deg,#455648,#343d38)}
.ritual img{width:100%;max-width:155px;height:102px;object-fit:cover;object-position:center 33%;border-radius:8px;mix-blend-mode:screen;filter:saturate(.85) contrast(1.12)}
.ritual span:last-child{font-size:.93rem;line-height:1.25}
.tiles article{background:linear-gradient(145deg,#65515b,#48434b);border-color:#ad8d7e}
.section-title{font-size:1.6rem}
@media(max-width:600px){.app{background-size:125px auto,115px auto}header{min-height:165px;padding:35px 24px 10px}.rituals{grid-template-columns:repeat(2,minmax(0,1fr))}.ritual{min-height:145px}.ritual img{height:95px}.hero-ornament{height:32px}.notice{font-size:.75rem}}
