*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{background:linear-gradient(160deg,#f2f2f2 0%,#e0e0e0 50%,#ccc 100%);font-family:Lora,Georgia,serif}.warm-bg-overlay{pointer-events:none;z-index:0;background:linear-gradient(160deg,#fff9ec 0%,#fde9bc 50%,#f8d88a 100%);transition:opacity 2.5s;position:fixed;inset:0}.app{flex-direction:column;width:100%;height:100%;display:flex;position:relative}.app-header{z-index:1;text-align:center;pointer-events:none;-webkit-user-select:none;user-select:none;flex-shrink:0;padding:18px 16px 6px;position:relative}.app-title{color:#333;letter-spacing:.02em;text-shadow:0 2px 10px #0000001a;font-size:clamp(1.5rem,5vw,2.6rem);font-weight:700;transition:color 2.5s,text-shadow 2.5s}.app.all-read .app-title{color:#7a3d00;text-shadow:0 2px 10px #c8780033}.app-subtitle{color:#666;opacity:.85;margin-top:4px;font-size:clamp(.85rem,3vw,1.05rem);font-style:italic;transition:color 2.5s}.app.all-read .app-subtitle{color:#b06a00}.canvas-wrapper{z-index:1;flex:1;justify-content:center;align-items:center;min-height:0;padding:8px 12px 12px;display:flex;position:relative}@keyframes glow-pulse{0%{filter:drop-shadow(0 0 8px #ffe229)drop-shadow(0 0 22px #ffbf00)brightness(1.1)}50%{filter:drop-shadow(0 0 20px #ffe433)drop-shadow(0 0 45px #ffc414)brightness(1.28)}to{filter:drop-shadow(0 0 8px #ffe229)drop-shadow(0 0 22px #ffbf00)brightness(1.1)}}.flower-read{animation:2.2s ease-in-out infinite glow-pulse}.modal-overlay{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:200;background:#14141480;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal-card{text-align:center;background:linear-gradient(148deg,#fffef6,#fffae4);border:1px solid #f0c35059;border-radius:22px;width:100%;max-width:420px;padding:40px 38px 32px;box-shadow:0 10px 48px #b4640038,0 2px 8px #00000014,inset 0 1px #fffffff2}.modal-flower-icon{filter:drop-shadow(0 2px 8px #c8960066);margin-bottom:16px;font-size:3.4rem}.modal-message{color:#5c3200;margin-bottom:28px;font-size:clamp(1rem,3.5vw,1.22rem);font-style:italic;line-height:1.7}.modal-close{color:#5a2d00;cursor:pointer;letter-spacing:.03em;background:linear-gradient(135deg,#f5c830,#e8a800);border:none;border-radius:50px;padding:10px 34px;font-family:inherit;font-size:.96rem;font-weight:600;transition:transform .15s,box-shadow .15s;box-shadow:0 4px 16px #e6a00066}.modal-close:hover{transform:translateY(-2px);box-shadow:0 6px 22px #e6a0008c}.modal-close:active{transform:translateY(0)}