:root{color-scheme:dark;--gold:#e9bd68;--gold-bright:#ffe6a7;--muted:#cdb98f;--ink:#3d230d;--panel:#17100deF}
*{box-sizing:border-box}
html{min-height:100%;background:#090e1c;scroll-behavior:smooth}
body{margin:0;min-height:100vh;overflow-x:hidden;color:#f8ecd4;font-family:"Noto Sans Myanmar","Myanmar Text",system-ui,sans-serif;line-height:1.65;background:radial-gradient(ellipse at 50% 8%,#29365a88,transparent 43%),linear-gradient(180deg,#091329 0%,#100e13 52%,#090d18 100%);position:relative}
.temple-backdrop{position:absolute;inset:0 0 auto;height:clamp(250px,48vw,390px);z-index:0;pointer-events:none;background-image:linear-gradient(180deg,#07122612 0%,#09132922 47%,#100e13 100%),url("temple-night.jpg");background-repeat:no-repeat;background-size:100% 100%,cover;background-position:center top;opacity:.96}
.top,main{position:relative;z-index:1}
.top{min-height:62px;padding:8px clamp(13px,3.5vw,26px);display:flex;align-items:center;gap:10px;border-bottom:1px solid #d5a54b44;background:#090d18b8;backdrop-filter:blur(9px)}
.brandmark{width:39px;height:39px;flex:0 0 39px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold-bright);font-size:23px;box-shadow:inset 0 0 12px #e6bd7033,0 0 12px #e6bd7022}
.brand{font-weight:800;font-size:clamp(11px,2.8vw,15px);color:var(--gold-bright);line-height:1.55;overflow-wrap:anywhere}.brand-copy{min-width:0;flex:1}.online{margin-left:auto;color:#d8c28e;font-size:9px;white-space:nowrap;border:1px solid #b88b4744;border-radius:20px;padding:3px 7px}
.online{margin-left:auto;color:#d8c28e;font-size:10px;white-space:nowrap}.online.off{color:#e3a17e}
main{width:min(100% - 28px,560px);margin:0 auto;padding:0 0 env(safe-area-inset-bottom)}
.intro{text-align:center;padding:14px 4px 15px}.lotus{font-size:29px;color:var(--gold);line-height:1;text-shadow:0 0 20px #e6bd7077}.eyebrow{color:#d4ad67;letter-spacing:3px;font:700 9px system-ui;margin:8px 0 0}.intro-caption{font-size:clamp(13px,3.8vw,16px);line-height:1.5;margin:5px 0 2px;color:var(--gold-bright);font-weight:700;text-shadow:0 2px 12px #d19a4144}.ornament{display:flex;align-items:center;justify-content:center;gap:12px;color:var(--gold);font-size:14px}.ornament i{width:85px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}.ornament i:last-child{transform:rotate(180deg)}
.panel{background:linear-gradient(145deg,#20150ff2,#100c0bf5);border:1px solid #bd8b3d;border-radius:19px;padding:clamp(16px,4vw,21px);margin:0 0 15px;box-shadow:0 14px 35px #0008,inset 0 0 0 3px #e4b86a0c;position:relative;min-width:0}.panel:before{content:"";position:absolute;inset:5px;border:1px solid #d0a25c44;border-radius:14px;pointer-events:none}
.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;gap:12px}.section-head h2{font-size:clamp(15px,4vw,18px);margin:0;font-weight:800;color:var(--gold-bright)}.tag{font:700 9px system-ui;letter-spacing:1px;color:#e1c58d;border:1px solid #8c683b;border-radius:20px;padding:4px 10px}
label{display:block;color:#d9c69f;font-size:12px;margin:0 0 7px}
input[type=date]{display:block;width:100%;min-height:54px;padding:11px 14px;border:1px solid #c49348;border-radius:13px;background:linear-gradient(180deg,#fff0d0,#e9c98f);color:#47290f;font:700 16px system-ui;outline:none;box-shadow:inset 0 2px 4px #fff9;accent-color:#81501b}
input[type=date]:focus-visible,button:focus-visible{outline:3px solid #ffe6a7;outline-offset:3px}
.date-info{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}.date-info>div{min-width:0;background:linear-gradient(145deg,#f8e4bd,#e9c98f);border:1px solid #b98236;border-radius:11px;padding:10px 12px;box-shadow:inset 0 1px 2px #fff8}.date-info>div:last-child{grid-column:1/-1}.date-info small{display:block;color:#76502b;font-size:10px}.date-info strong{font-size:clamp(12px,3.4vw,14px);display:block;margin-top:3px;color:#47290f;overflow-wrap:anywhere;line-height:1.55}
.hint{color:#c9b58e;font-size:10px;margin:10px 2px 13px}
.calculate{width:100%;min-height:57px;position:relative;overflow:hidden;border:1px solid #ffdf91;border-radius:999px;padding:13px 18px;background:linear-gradient(180deg,#fff0bd 0%,#e9b94e 45%,#a76620 100%);color:#422309;font-family:inherit;font-weight:800;font-size:clamp(15px,4vw,17px);box-shadow:inset 0 2px 2px #fff9,inset 0 -3px 5px #683c1c66,0 5px 18px #0007;cursor:pointer;transition:transform .18s,filter .18s}.calculate:before{content:"";position:absolute;top:-60%;left:-35%;width:24%;height:220%;transform:rotate(24deg);background:linear-gradient(90deg,transparent,#fff9,transparent);animation:shine 5.5s ease-in-out infinite}.calculate:active{transform:translateY(2px) scale(.99);filter:brightness(1.12)}.calculate:disabled{opacity:.55;filter:grayscale(.5);cursor:not-allowed}.calculate:disabled:before{animation:none}.search-icon{font-size:22px;vertical-align:-2px;margin-right:5px}@keyframes shine{0%,35%{left:-40%}75%,100%{left:130%}}
.result{margin-top:2px}.placeholder{padding:22px 14px;border:1px dashed #8c683c;border-radius:12px;color:#c5b18e;font-size:12px;text-align:center}.hero-number{font-size:clamp(54px,15vw,68px);font-weight:800;color:var(--gold-bright);line-height:1.25;text-align:center;margin:6px 0;text-shadow:0 0 24px #e6bd7055}.hero-label{text-align:center;color:#c8b28c;font-size:11px}.chips{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin:13px 0 4px}.chip{padding:5px 11px;border:1px solid #98703d;border-radius:30px;color:#f0d9a8;font-size:11px;background:#120d08}.warning{border:1px solid #98643e;background:#2a1d14;color:#f1c99d;border-radius:10px;padding:12px;font-size:12px;margin-top:8px}.result-headline{display:flex;align-items:center;justify-content:center;gap:9px;margin:8px 0 17px;padding:10px 12px;border:1px solid #d5a34c;border-radius:14px;background:linear-gradient(135deg,#38200d,#17100b);color:#f4d58e;font-size:clamp(18px,5vw,23px);font-weight:800;text-align:center;box-shadow:inset 0 0 15px #d5a34c16,0 4px 14px #0006}.result-headline strong{display:inline-grid;place-items:center;min-width:43px;height:43px;padding:0 8px;border-radius:50%;background:linear-gradient(145deg,#fff0b8,#d99c32);color:#492708;font-size:25px;box-shadow:0 0 17px #edc36b55}.result-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 13px}.summary-card{min-width:0;min-height:85px;padding:10px 6px;border:1px solid #a87a39;border-radius:12px;background:linear-gradient(145deg,#2b1b0e,#100c09);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:5px;box-shadow:inset 0 0 12px #d5a34c0b}.summary-card small,.classification small,.calc-item small,.eye-calculation small{font-size:10px;color:#cbb487;line-height:1.5}.summary-card b{font-size:clamp(13px,3.5vw,17px);color:#ffe4a2;overflow-wrap:anywhere;line-height:1.5}.nakhat-card{border-color:#c89b4d}.flow-card{border-color:#c89b4d}.eye-card{border-color:#c89b4d}.classification{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0 0 13px;padding:11px;border:1px solid #b38a4d66;border-radius:12px;background:linear-gradient(100deg,#28190d,#17100b)}.classification>div{display:flex;align-items:center;justify-content:space-between;gap:7px;min-width:0}.classification>div+div{border-left:1px solid #b38a4d55;padding-left:10px}.classification b{color:#ffdf91;font-size:clamp(12px,3.5vw,15px);text-align:right;overflow-wrap:anywhere}.calc-details{border-top:1px solid #b38a4d55;padding-top:10px}.detail-title{font-size:12px;font-weight:800;color:#e7c47d;margin:0 0 7px}.calc-item{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:7px 2px;border-bottom:1px dashed #a27a4538}.calc-item b{font-size:11px;color:#f1dfbd;text-align:right;max-width:58%;overflow-wrap:anywhere}.eye-calculation{margin-top:10px;padding:10px 11px;border:1px solid #b78a45;border-radius:10px;background:#21160d}.eye-calculation b{display:block;margin-top:4px;color:#ffe3a0;font-size:13px;line-height:1.6}.eye-calculation em{display:block;margin-top:3px;color:#d8c59d;font-size:11px;font-style:normal}
footer{display:flex;justify-content:center;align-items:center;gap:10px;text-align:center;color:#e0b968;font:12px Georgia,serif;padding:17px 0 calc(28px + env(safe-area-inset-bottom));text-shadow:0 1px 6px #000}.footer-line{width:clamp(22px,8vw,45px);height:1px;background:linear-gradient(90deg,transparent,#b88b47)}footer b{font-family:inherit;font-size:12px;color:#f2d28e}
@media(min-width:700px){main{width:min(100% - 40px,560px)}.intro{padding-top:18px}.temple-backdrop{height:400px}}
@media(max-width:380px){main{width:calc(100% - 20px)}.top{padding-inline:12px}.date-info{gap:7px}.date-info>div{padding:9px}.panel{padding:15px}.intro{padding-top:24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.calculate:before{animation:none}}
.date-select{display:block;width:100%;min-height:50px;margin:0 0 13px;padding:10px 13px;border:1px solid #c49348;border-radius:12px;background:linear-gradient(180deg,#fff0d0,#e9c98f);color:#47290f;font-family:inherit;font-size:15px;font-weight:700;outline:none;box-shadow:inset 0 2px 4px #fff9}
.date-select:focus-visible,input[type=date]:focus-visible{outline:3px solid #ffe6a7;outline-offset:3px}
.date-divider{height:1px;background:linear-gradient(90deg,transparent,#b88b47,transparent);margin:7px 0 15px}