*{box-sizing:border-box}
:root{
 --bg:#eeeae4;--paper:#fffdf9;--ink:#171717;--muted:#827b73;
 --line:#e5ddd3;--red:#9f1d1d;--red2:#741313;--gold:#c89a3c;
}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);
font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
body{background:#060a12;color:#f4f7ff;overflow-x:hidden}
.lunar-background{position:fixed;inset:0;background:url("assets/lunar-atmosphere.svg") center top/cover no-repeat;z-index:0;pointer-events:none}
.lunar-background:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,7,13,.08),rgba(3,6,12,.72) 78%,#05070c 100%)}
button,input{font:inherit}.shell{width:min(1180px,100%);margin:auto;padding:28px 22px 60px;position:relative;z-index:1}
.site-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.brand-wrap{display:flex;align-items:center;gap:12px}.brand-mark{width:38px;height:38px;border-radius:11px;
display:grid;place-items:center;background:var(--red);color:white;font-weight:900;box-shadow:0 7px 18px #8c1b1b2a}
.brand{font-size:1.2rem;font-weight:950;letter-spacing:.19em}.tagline{font-size:.78rem;color:var(--muted);margin-top:2px}
.today-btn,.search-row button{border:0;background:var(--red);color:#fff;padding:12px 17px;border-radius:10px;font-weight:800;cursor:pointer}
.hero{background:linear-gradient(125deg,#771414,#a92323);color:white;border-radius:25px 25px 8px 8px;
padding:28px 32px 19px;box-shadow:0 18px 38px #54111124;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;width:250px;height:250px;border:1px solid #ffffff18;border-radius:50%;right:-80px;top:-115px;box-shadow:0 0 0 34px #ffffff08,0 0 0 68px #ffffff05}
.hero-top{display:flex;justify-content:space-between;align-items:flex-end;position:relative;z-index:1}
.overline,.section-label{font-size:.66rem;font-weight:900;letter-spacing:.16em}.overline{opacity:.68}
.hero h1{font-size:2.2rem;margin:7px 0 0;letter-spacing:-.04em}.year{opacity:.75;margin-top:1px}
.hero-date{display:flex;align-items:center;gap:13px;text-align:right}.hero-date>span{font-size:3.5rem;font-weight:950;line-height:.8}
.hero-date strong,.hero-date small{display:block}.hero-date strong{font-size:.88rem}.hero-date small{opacity:.7;margin-top:3px}
.hero-bottom{display:flex;align-items:center;gap:14px;margin-top:25px}.nav-btn{width:40px;height:40px;border:1px solid #ffffff38;
border-radius:50%;background:#ffffff12;color:white;font-size:1.2rem;cursor:pointer}.hero-rule{height:1px;background:#ffffff2b;flex:1}
.calendar-panel,.detail-card,.search-card{background:var(--paper);border:1px solid var(--line);box-shadow:0 13px 35px #4d3a2610}
.calendar-panel{border-radius:8px 8px 22px 22px;padding:22px 25px 17px;margin-bottom:18px}
.weekday-row,.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}
.weekday-row{color:#8b8178;font-size:.68rem;font-weight:850;text-transform:uppercase;letter-spacing:.04em;text-align:center;margin-bottom:8px}
.day{min-height:78px;border:1px solid transparent;border-radius:12px;background:#f8f5f0;color:var(--ink);padding:9px 9px 7px;
text-align:left;cursor:pointer;position:relative;display:flex;flex-direction:column;align-items:flex-start;transition:.16s}
.day:hover{transform:translateY(-2px);border-color:#d8c8ba;background:#fff}
.day.empty{background:transparent;cursor:default}.day.empty:hover{transform:none}
.day.selected{background:var(--red);color:#fff;border-color:var(--red);box-shadow:0 7px 17px #8e1c1c2a}
.day.today:not(.selected){box-shadow:inset 0 0 0 2px var(--red)}
.day-number{font-size:1rem;font-weight:900}.day-meta{font-size:.62rem;color:#9b9188;margin-top:7px}
.day.selected .day-meta{color:#f5cccc}
.lunar-mini{margin-top:auto;font-size:.61rem;font-weight:900;display:flex;align-items:center;gap:4px}
.day.purnama:not(.selected){background:#fff7e5;border-color:#ecd9a8}.day.purnama .lunar-mini{color:#8a6219}
.day.tilem:not(.selected){background:#efedf0;border-color:#d9d4db}.day.tilem .lunar-mini{color:#4d4851}
.legend{display:flex;gap:18px;margin-top:15px;color:#857c73;font-size:.67rem;font-weight:700}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.purnama-dot{background:#d1a13d}.tilem-dot{background:#46414a}.selected-dot{background:var(--red)}
.detail-layout{display:grid;grid-template-columns:1.18fr .82fr;gap:18px;margin-bottom:18px}
.detail-card,.lunar-feature{border-radius:18px;padding:23px}.detail-title-row{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.detail-card h2{font-size:1.35rem;margin:0}.detail-card p{margin:4px 0;color:var(--muted);font-size:.83rem}.date-number{font-size:3.5rem;font-weight:950;color:#eee6de}
.bali-info{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:20px}.bali-info div{background:#f7f3ee;border-radius:10px;padding:11px}.bali-info small{display:block;color:#92877e;font-size:.57rem;font-weight:900}.bali-info strong{display:block;margin-top:6px;font-size:.82rem}
.lunar-feature{min-height:190px;display:flex;gap:16px;align-items:center;position:relative;overflow:hidden;color:white;background:#211e24}
.lunar-feature:after{content:"";position:absolute;width:190px;height:190px;border:1px solid #ffffff12;border-radius:50%;right:-85px;top:-50px;box-shadow:0 0 0 35px #ffffff06,0 0 0 70px #ffffff03}
.lunar-sky{width:100px;height:135px;position:relative;display:grid;place-items:center;flex:none}
.moon{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;font-size:3.2rem;background:#f4ead1;color:#7b5b17;box-shadow:0 0 35px #e5c76d3d;z-index:2}
.stars{position:absolute;width:100%;height:100%;background-image:radial-gradient(#fff 1px,transparent 1px);background-size:28px 28px;opacity:.13}
.lunar-copy{position:relative;z-index:2}.lunar-copy span{font-size:.62rem;letter-spacing:.14em;font-weight:900;color:#d9c6a2}
.lunar-copy h2{margin:7px 0 5px;font-size:1.45rem}.lunar-copy p{margin:0;color:#bcb5be;font-size:.74rem;line-height:1.5}
.lunar-tilem .moon{background:#09080b;color:#aaa;box-shadow:0 0 22px #fff1}.lunar-tilem{background:#18161b}.lunar-none{background:#2c292f}
.search-card{border-radius:18px;padding:23px;display:flex;align-items:end;justify-content:space-between;gap:25px}.search-card h2{margin:6px 0 4px;font-size:1.1rem}.search-card p{margin:0;color:var(--muted);font-size:.76rem}.search-row{display:flex;gap:8px;min-width:330px}.search-row input{min-width:0;flex:1;border:1px solid var(--line);background:#fff;border-radius:10px;padding:11px}
footer{display:flex;justify-content:space-between;color:#999;font-size:.67rem;padding:18px 4px}
@media(max-width:760px){.shell{padding:18px 12px 35px;display:flex;flex-direction:column}.site-header,.hero{order:0}.calendar-panel{order:1}.detail-layout{display:contents}.lunar-feature{order:2;margin-bottom:18px}.search-card{order:3;margin-bottom:18px}.detail-card{order:4}.shell>footer{order:5}.hero{padding:22px 20px 16px}.hero h1{font-size:1.8rem}.hero-date>span{font-size:2.6rem}
.calendar-panel{padding:14px}.day{min-height:70px;padding:7px 6px}.day-meta{display:block;font-size:.48rem;line-height:1.15;white-space:normal;overflow-wrap:anywhere;max-width:100%}.weekday-row span{font-size:.58rem}.detail-layout{grid-template-columns:1fr}.bali-info{grid-template-columns:repeat(2,1fr)}
.search-card{display:block}.search-row{min-width:0;margin-top:15px}.legend{flex-wrap:wrap}}
@media(max-width:480px){.header-actions{width:100%;justify-content:flex-end}.feature-link,.today-btn{padding:9px 10px;font-size:.68rem}.brand{font-size:1rem}.tagline{font-size:.7rem}.today-btn{padding:10px 12px}.hero-date{display:none}.day{min-height:66px;padding:6px 5px}.day-number{font-size:.86rem}.day-meta{font-size:.44rem;line-height:1.1;min-height:2.2em}.lunar-mini{font-size:.5rem}.calendar-grid{gap:4px}.weekday-row{gap:4px}.lunar-feature{min-height:165px}.lunar-sky{width:75px}.moon{width:60px;height:60px}}

.site-header{color:#f7f9ff}
.brand-mark{box-shadow:0 0 25px #a9252550,0 7px 18px #0008}
.tagline{color:#aab6c7}
.today-btn{box-shadow:0 0 20px #a9252535}
.hero{background:linear-gradient(135deg,rgba(9,16,29,.93),rgba(17,29,48,.84));border:1px solid #7896b433;
backdrop-filter:blur(16px);box-shadow:0 25px 60px #0008}
.hero:after{border-color:#9ab8dc20;box-shadow:0 0 0 34px #9ab8dc09,0 0 0 68px #9ab8dc04}
.calendar-panel,.detail-card,.search-card{background:rgba(9,15,25,.76);border-color:#7896b42b;color:#eef4ff;backdrop-filter:blur(14px);box-shadow:0 20px 60px #0008}
.weekday-row{color:#8295ad}.day{background:rgba(20,30,45,.76);border-color:#7591ae18;color:#eef4ff}
.day:hover{background:rgba(36,53,75,.9);border-color:#8eb4dc55}
.day.today:not(.selected){box-shadow:inset 0 0 0 1px #9ebfe4}
.day.selected{background:linear-gradient(135deg,#a62424,#671315);border-color:#e16a6a;box-shadow:0 0 25px #9f1d1d55}
.day-meta{color:#7588a0}.day.selected .day-meta{color:#f2b8b8}
.day.purnama:not(.selected){background:rgba(73,62,35,.42);border-color:#d9b85d66}
.day.tilem:not(.selected){background:rgba(12,17,25,.85);border-color:#66788e33}
.day.purnama .lunar-mini{color:#e7c56d}.day.tilem .lunar-mini{color:#aebbd0}
.legend{color:#8394aa}.detail-card p,.search-card p{color:#8798ad}.date-number{color:#32445d}
.bali-info div{background:rgba(22,33,49,.78);border:1px solid #6e89a622}.bali-info small{color:#7489a2}
.search-row input{background:#0e1725;color:#eef4ff;border-color:#6e89a644}.search-row input::-webkit-calendar-picker-indicator{filter:invert(1)}
.search-row{position:relative;z-index:12}.search-row button{position:relative;z-index:13;pointer-events:auto;touch-action:manipulation}
.lunar-feature{background:linear-gradient(135deg,rgba(8,12,20,.96),rgba(20,30,47,.9));border:1px solid #7896b433;box-shadow:inset 0 0 50px #1c355020}
footer{color:#718198}

.brand-wrap{align-items:center}.brand-logo{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 0 14px #ff1d1d33)}
.brand-copy{display:flex;flex-direction:column}.brand{color:#f4f7ff}.tagline{color:#9aaabd}
.wewaran-detail{margin-top:18px;border-top:1px solid #6e89a622;padding-top:16px}
.wewaran-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.wewaran-heading span{font-size:.68rem;letter-spacing:.13em;font-weight:900;color:#b9c8da}
.wewaran-heading small{font-size:.58rem;color:#687b93}
.wewaran-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}
.wewaran-grid div{background:rgba(19,31,47,.82);border:1px solid #7088a322;border-radius:9px;padding:9px}
.wewaran-grid span{display:block;color:#71859d;font-size:.55rem;font-weight:800;text-transform:uppercase}
.wewaran-grid strong{display:block;color:#edf4ff;font-size:.76rem;margin-top:5px}
@media(max-width:760px){.wewaran-grid{grid-template-columns:repeat(2,1fr)}}

.brand-wrap{flex-direction:column;align-items:flex-start;gap:7px}
.brand-logo{width:64px;height:64px}
.brand-copy{padding-left:2px}
.brand{letter-spacing:.16em;text-transform:none;font-size:1.35rem}


/* Mbahwat Kelahiran — additive feature styles; locked calendar styles above remain unchanged. */
.header-actions{display:flex;align-items:center;gap:9px}.feature-link,.nav-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}.feature-link{border:1px solid #7896b444;color:#d9e6f5;background:#0b1523cc;padding:10px 13px;border-radius:10px;font-size:.74rem;font-weight:850}.feature-link:hover{border-color:#b7cee955;background:#142337}.birth-shell{padding-bottom:45px}.birth-hero,.birth-input-card,.profile-card,.compat-card{background:rgba(9,15,25,.78);border:1px solid #7896b42b;backdrop-filter:blur(14px);box-shadow:0 20px 60px #0008}.birth-hero{border-radius:22px;padding:30px;margin-bottom:16px;overflow:hidden;position:relative}.birth-hero:after{content:"";position:absolute;width:260px;height:260px;border:1px solid #7896b422;border-radius:50%;right:-100px;top:-130px;box-shadow:0 0 0 38px #7896b40a,0 0 0 76px #7896b405}.birth-hero h1{font-size:clamp(2rem,5vw,3.3rem);margin:8px 0 7px;letter-spacing:-.045em}.birth-hero p{max-width:650px;color:#93a5ba;line-height:1.6;margin:0}.birth-input-card{border-radius:18px;padding:21px 23px;display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:16px}.birth-input-card h2,.compat-card h2{margin:6px 0 0;font-size:1.1rem}.birth-form,.compat-form{display:flex;gap:8px}.birth-form input,.compat-form input{background:#0e1725;color:#eef4ff;border:1px solid #6e89a644;border-radius:10px;padding:11px}.birth-form button,.compat-form button{border:0;background:var(--red);color:#fff;border-radius:10px;padding:11px 15px;font-weight:850;cursor:pointer}.birth-result{display:grid;grid-template-columns:1.25fr .75fr;gap:16px;margin-bottom:16px}.profile-card{border-radius:18px;padding:22px}.profile-main{grid-column:1/-1}.profile-card h2{margin:7px 0 7px;font-size:1.3rem}.profile-card p{margin:0;color:#96a8bc;line-height:1.65;font-size:.82rem}.metric-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:20px}.metric-row div{background:rgba(20,31,47,.82);border:1px solid #7088a322;border-radius:10px;padding:10px}.metric-row small{display:block;color:#71859d;font-size:.54rem;font-weight:900}.metric-row strong{display:block;margin-top:5px;color:#edf4ff;font-size:.82rem}.compat-card{border-radius:18px;padding:23px;margin-bottom:16px}.compat-card>div:first-child p{color:#8798ad;font-size:.76rem;margin:4px 0 0;max-width:720px}.compat-form{margin-top:16px;align-items:end}.compat-form label{display:flex;flex-direction:column;gap:5px;color:#8194aa;font-size:.63rem;font-weight:900;letter-spacing:.05em}.compat-form input{font-size:.78rem}.compat-result{margin-top:18px;border-top:1px solid #6e89a622;padding-top:18px}.compat-score{display:flex;align-items:baseline;gap:13px}.compat-score strong{font-size:2.3rem;color:#f1c5c5}.compat-score span{font-size:1rem;font-weight:900}.compat-detail{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:13px}.compat-detail div{background:rgba(20,31,47,.82);border:1px solid #7088a322;border-radius:10px;padding:11px}.compat-detail small,.compat-detail span{display:block;color:#71859d;font-size:.56rem;font-weight:800}.compat-detail b{display:block;font-size:1.1rem;margin:5px 0}.compat-result>p{color:#8193a8;font-size:.69rem;line-height:1.5;margin-bottom:0}@media(max-width:760px){.site-header{flex-direction:column;align-items:stretch;gap:14px}.header-actions{gap:6px;justify-content:flex-end;flex-wrap:wrap}.feature-link{display:inline-flex}.birth-input-card{display:block}.birth-form{margin-top:14px}.birth-result{grid-template-columns:1fr}.metric-row{grid-template-columns:repeat(2,1fr)}.compat-form{display:grid;grid-template-columns:1fr 1fr}.compat-form button{grid-column:1/-1}.compat-detail{grid-template-columns:1fr}}@media(max-width:480px){.birth-hero{padding:23px 19px}.birth-hero h1{font-size:2rem}.birth-input-card,.profile-card,.compat-card{padding:18px}.compat-form{grid-template-columns:1fr}.compat-form button{grid-column:auto}}

/* Kelahiran interaction fix */
.birth-input-card, .birth-form, .birth-form button, .compat-form, .compat-form button { position: relative; z-index: 5; }
.birth-form button, .compat-form button { pointer-events: auto; cursor: pointer; }

/* Meaning interaction — additive only, does not redesign locked calendar. */
.bali-info .meaning-tile{display:block;width:100%;text-align:left;color:inherit;font:inherit;cursor:pointer;padding:14px;border-radius:10px;background:rgba(22,33,49,.78);border:1px solid #6e89a622}
.bali-info .meaning-tile:hover{border-color:#9db9d955;background:rgba(31,46,66,.9);transform:translateY(-1px)}
.meaning-click{cursor:pointer}
.meaning-click:hover{filter:brightness(1.08)}
.wewaran-grid div{cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease}
.wewaran-grid div:hover{transform:translateY(-2px);border-color:#9db9d955;background:rgba(29,44,64,.95)}
.meaning-modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:20px}
.meaning-modal.open{display:flex}
.meaning-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(7px)}
.meaning-dialog{position:relative;width:min(560px,100%);border:1px solid #7896b455;border-radius:18px;background:linear-gradient(145deg,#0b1422,#101c2d);box-shadow:0 30px 90px #000b;padding:27px;color:#edf4ff;z-index:1}
.meaning-dialog h2{margin:7px 42px 10px 0;font-size:1.55rem;letter-spacing:-.02em}
.meaning-dialog p{margin:0;color:#b7c5d5;line-height:1.72;font-size:.9rem}
.meaning-note{margin-top:20px;padding-top:14px;border-top:1px solid #6e89a622;color:#70849c;font-size:.68rem;line-height:1.55}
.meaning-close{position:absolute;right:14px;top:12px;border:1px solid #7896b433;background:#162337;color:#dce8f5;border-radius:9px;width:34px;height:34px;font-size:1.35rem;line-height:1;cursor:pointer}
.meaning-close:hover{background:#243650;border-color:#9db9d955}

/* Fase Bulan prototype — the only intentionally open visual area. */
.lunar-feature{min-height:315px;display:grid;grid-template-columns:minmax(210px,.9fr) 1.1fr;gap:20px;align-items:center;position:relative;overflow:hidden;color:white;background:linear-gradient(135deg,rgba(5,10,18,.98),rgba(17,29,45,.94));border:1px solid #7896b433;box-shadow:inset 0 0 65px #1c355020}
.lunar-feature:after{content:"";position:absolute;width:260px;height:260px;border:1px solid #ffffff12;border-radius:50%;right:-125px;top:-85px;box-shadow:0 0 0 45px #ffffff06,0 0 0 90px #ffffff03;pointer-events:none}
.lunar-visual{position:relative;z-index:2;min-width:0}
.lunar-sky{height:245px;width:245px;position:relative;display:grid;place-items:center;margin:auto}
.stars{position:absolute;inset:0;background-image:radial-gradient(#fff 1px,transparent 1px),radial-gradient(#fff 1px,transparent 1px);background-size:31px 31px,47px 47px;background-position:3px 8px,17px 21px;opacity:.18}
.moon-3d{--moon-size:190px;width:var(--moon-size);height:var(--moon-size);border-radius:50%;position:relative;overflow:hidden;background:transparent;box-shadow:0 0 42px rgba(224,236,255,.16);z-index:2;isolation:isolate}
.lunar-phase-scale{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:9px;position:relative;z-index:3}
.phase-dot{width:13px;height:13px;border-radius:50%;display:block;background:#dbe4ef url("assets/moon-texture-full2.png") center/cover no-repeat;box-shadow:0 0 7px rgba(255,255,255,.1);opacity:.75}
.phase-dot.phase-new{background:#0b1018}.phase-dot.phase-crescent{clip-path:ellipse(35% 50% at 68% 50%)}
.phase-dot.phase-quarter{clip-path:inset(0 0 0 50%)}
.phase-dot.phase-gibbous{clip-path:ellipse(48% 50% at 72% 50%)}
.phase-dot.phase-full{box-shadow:0 0 9px rgba(230,238,248,.35)}
.phase-dot.phase-gibbous-wane{clip-path:ellipse(48% 50% at 28% 50%)}
.phase-dot.phase-quarter-wane{clip-path:inset(0 50% 0 0)}
.phase-dot.phase-crescent-wane{clip-path:ellipse(35% 50% at 32% 50%)}
.lunar-copy{position:relative;z-index:3}.lunar-copy span{font-size:.62rem;letter-spacing:.14em;font-weight:900;color:#d9c6a2}.lunar-copy h2{margin:7px 0 5px;font-size:1.55rem;letter-spacing:-.02em}.lunar-copy p{margin:0;color:#b9c5d5;font-size:.76rem;line-height:1.55;max-width:470px}
.lunar-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:17px;padding-top:14px;border-top:1px solid #7896b42a}.lunar-stats small,.lunar-neighbors{color:#7f95ae;font-size:.63rem}.lunar-stats strong{display:block;color:#f0f5fc;font-size:.95rem;margin-top:3px}.lunar-neighbors{display:grid;gap:5px;margin-top:13px}.lunar-neighbors strong{color:#dce7f5;margin-left:7px;font-weight:800}
@media(max-width:700px){.lunar-feature{grid-template-columns:1fr;gap:8px;padding:20px;min-height:0}.lunar-sky{height:215px;width:215px}.moon-3d{--moon-size:165px}.lunar-copy{padding-bottom:5px}.lunar-stats{margin-top:13px}.lunar-neighbors{margin-top:10px}}


/* V0.9.1 — WebGL realistic Moon: only the lunar visual is intentionally changed. */
.moon-3d{display:block;width:var(--moon-size,190px);height:var(--moon-size,190px);border-radius:50%;background:transparent;overflow:hidden;filter:drop-shadow(0 0 20px rgba(214,226,244,.16));}
.moon-3d.phase-new{filter:drop-shadow(0 0 12px rgba(214,226,244,.05));}
@media(max-width:700px){.moon-3d{--moon-size:165px}}

.national-holiday-detail{margin-top:18px;border-top:1px solid #6e89a622;padding-top:16px}
.national-holiday-card{display:flex;align-items:center;gap:12px;margin-top:10px;padding:13px 14px;border:1px solid #6e89a622;border-radius:10px;background:rgba(22,33,49,.58)}
.national-holiday-dot{width:9px;height:9px;flex:0 0 9px;border-radius:50%;background:#c99b32;box-shadow:0 0 12px #c99b3266}
.national-holiday-card strong{display:block;font-size:.92rem;color:#eef4ff}
.national-holiday-card small{display:block;margin-top:3px;color:#8798ad;font-size:.76rem}

.national-observance-dot{width:9px;height:9px;flex:0 0 9px;border-radius:50%;background:#a45b72;box-shadow:0 0 12px #a45b7266}.observance-card{border-color:#a45b7233}


/* V0.9.10 — additive only: month observance browser + reliable date search. */
.month-observance-btn{margin-left:auto;border:1px solid #7896b444;background:#132238;color:#dce8f5;border-radius:9px;padding:7px 11px;font-size:.68rem;font-weight:850;cursor:pointer;transition:.16s ease}
.month-observance-btn:hover{background:#1a2d47;border-color:#9db9d955;transform:translateY(-1px)}
.month-observance-dialog{width:min(620px,100%)}
.month-observance-list{display:grid;gap:8px;margin-top:16px;max-height:min(55vh,430px);overflow:auto;padding-right:3px}
.month-observance-item{display:grid;grid-template-columns:48px 1fr;align-items:center;gap:12px;text-align:left;border:1px solid #7896b42b;border-radius:11px;background:rgba(22,33,49,.72);color:#eef4ff;padding:11px 12px;cursor:pointer}
.month-observance-item:hover{background:rgba(31,46,66,.92);border-color:#9db9d955}
.month-observance-item span{display:grid;place-items:center;width:38px;height:38px;border-radius:9px;background:#1b2b40;color:#e8eff7;font-size:.95rem;font-weight:900}
.month-observance-item strong{font-size:.78rem;line-height:1.35}
.month-observance-empty{border:1px solid #7896b42b;border-radius:11px;padding:16px;color:#9aabbd;background:rgba(22,33,49,.55);font-size:.8rem;line-height:1.5}
@media(max-width:560px){.month-observance-btn{width:100%;margin:5px 0 0}.legend{align-items:stretch}.month-observance-item{grid-template-columns:42px 1fr}}

/* LOCKED modal interaction fix: close controls always remain above the dialog surface. */
.meaning-modal.open{pointer-events:auto}
.meaning-backdrop{z-index:0;pointer-events:auto}
.meaning-dialog{z-index:2}
.meaning-close{z-index:3;pointer-events:auto;touch-action:manipulation}
.compat-reading{margin-top:16px;border-top:1px solid #6e89a622;padding-top:17px}.compat-reading-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}.compat-reading-head span,.compat-columns small,.compat-challenge small,.compat-signals small{display:block;color:#71859d;font-size:.56rem;font-weight:900;letter-spacing:.06em}.compat-reading-head strong{font-size:1.05rem}.compat-reading>p{color:#aab9ca;font-size:.78rem;line-height:1.65;margin:0 0 12px}.compat-columns{display:grid;grid-template-columns:1fr 1fr;gap:9px}.compat-columns>div,.compat-challenge,.compat-signals>div{background:rgba(20,31,47,.82);border:1px solid #7088a322;border-radius:10px;padding:12px}.compat-columns p,.compat-challenge p{margin:7px 0 0;color:#9aabbd;font-size:.73rem;line-height:1.6}.compat-challenge{margin-top:9px}.compat-signals{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:9px}.compat-signals b{display:block;font-size:1.15rem;margin:5px 0 2px}.compat-signals span{display:block;color:#8193a8;font-size:.65rem;line-height:1.4}.compat-note{color:#8193a8;font-size:.69rem;line-height:1.5;margin-top:14px!important}@media(max-width:760px){.compat-columns,.compat-signals{grid-template-columns:1fr}.compat-reading-head{display:block}.compat-reading-head strong{display:block;margin-top:5px}}

/* Kelahiran — additive-only Total Urip explanation. All other calendar areas remain locked. */
.urip-total-card{appearance:none;width:100%;text-align:left;font:inherit;color:inherit;cursor:pointer;background:rgba(20,31,47,.82);border:1px solid #7088a322;border-radius:10px;padding:10px;transition:transform .16s ease,border-color .16s ease,background .16s ease}
.urip-total-card:hover,.urip-total-card:focus-visible{border-color:#9db9d955;background:rgba(29,44,64,.95);transform:translateY(-1px);outline:none}
.urip-total-card:focus-visible{box-shadow:0 0 0 2px #7896b455}
.urip-total-card small,.urip-total-card strong{display:block}
.urip-total-card small{color:#71859d;font-size:.54rem;font-weight:900}
.urip-total-card strong{margin-top:5px;color:#edf4ff;font-size:.82rem}

/* Kelahiran — date picker icons: match the white text/icon treatment. */
.birth-form input[type="date"]::-webkit-calendar-picker-indicator,
.compat-form input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
  opacity: 1;
}

/* Kelahiran — Rangkuman Kehidupan */
.life-summary-card{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:22px}
.life-summary-card p{max-width:760px}
.life-summary-btn{border:1px solid #7896b455;background:#16263b;color:#edf4ff;border-radius:11px;padding:13px 17px;font-weight:900;cursor:pointer;white-space:nowrap;transition:transform .16s ease,border-color .16s ease,background .16s ease}
.life-summary-btn:hover,.life-summary-btn:focus-visible{border-color:#b7cee977;background:#1d3049;transform:translateY(-1px);outline:none}
.life-summary-dialog{max-width:820px;width:min(820px,100%);max-height:min(86vh,820px);overflow:auto}
.life-summary-intro{border-bottom:1px solid #6e89a622;padding-bottom:14px;margin-bottom:14px}
.life-summary-intro p,.life-summary-section p{color:#96a8bc;line-height:1.7;font-size:.82rem}
.life-summary-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:15px}
.life-summary-facts>div{background:rgba(20,31,47,.82);border:1px solid #7088a322;border-radius:10px;padding:11px}
.life-summary-facts small{display:block;color:#71859d;font-size:.54rem;font-weight:900}
.life-summary-facts strong{display:block;margin-top:5px;color:#edf4ff;font-size:.76rem}
.life-summary-section{background:rgba(20,31,47,.46);border:1px solid #7088a31c;border-radius:12px;padding:14px;margin-top:10px}
.life-summary-section h3{margin:6px 0 5px;color:#edf4ff;font-size:1rem}
.life-summary-section p{margin:5px 0 0}
.life-summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 8px}
.life-summary-grid .life-summary-section{height:100%}
.life-summary-advice{border-color:#7896b444;background:rgba(20,35,55,.68)}
@media(max-width:760px){.life-summary-card{display:block}.life-summary-btn{margin-top:14px;width:100%}.life-summary-facts{grid-template-columns:1fr 1fr}.life-summary-grid{grid-template-columns:1fr}.life-summary-dialog{max-height:88vh}}
@media(max-width:480px){.life-summary-facts{grid-template-columns:1fr}.life-summary-dialog{padding:18px}}

/* Kelahiran — Jodoh: detailed compatibility summary. */
.jodoh-summary-btn{display:block;width:100%;margin-top:12px;border:1px solid #7896b455;background:#16263b;color:#edf4ff;border-radius:11px;padding:13px 17px;font:inherit;font-weight:900;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease}
.jodoh-summary-btn:hover,.jodoh-summary-btn:focus-visible{border-color:#b7cee977;background:#1d3049;transform:translateY(-1px);outline:none}
.jodoh-summary-dialog{max-width:860px;width:min(860px,100%);max-height:min(88vh,860px);overflow:auto}
.jodoh-summary-intro{border-bottom:1px solid #6e89a622;padding-bottom:14px;margin-bottom:14px}
.jodoh-summary-intro p,.jodoh-summary-section p{color:#96a8bc;line-height:1.72;font-size:.84rem}
.jodoh-summary-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:15px}
.jodoh-summary-facts>div{background:rgba(20,31,47,.82);border:1px solid #7088a322;border-radius:10px;padding:11px}
.jodoh-summary-facts small{display:block;color:#71859d;font-size:.54rem;font-weight:900}
.jodoh-summary-facts strong{display:block;margin-top:5px;color:#edf4ff;font-size:1rem}
.jodoh-summary-facts span{display:block;margin-top:4px;color:#8193a8;font-size:.65rem;line-height:1.45}
.jodoh-summary-section{background:rgba(20,31,47,.46);border:1px solid #7088a31c;border-radius:12px;padding:14px;margin-top:10px}
.jodoh-summary-section h3{margin:6px 0 5px;color:#edf4ff;font-size:1rem}
.jodoh-summary-section p{margin:5px 0 0}
.jodoh-summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 8px}
.jodoh-summary-grid .jodoh-summary-section{height:100%}
.jodoh-summary-advice{border-color:#7896b444;background:rgba(20,35,55,.68)}
@media(max-width:760px){.jodoh-summary-facts{grid-template-columns:1fr 1fr}.jodoh-summary-grid{grid-template-columns:1fr}.jodoh-summary-dialog{max-height:88vh}}
@media(max-width:480px){.jodoh-summary-facts{grid-template-columns:1fr}.jodoh-summary-dialog{padding:18px}}

/* Mbahwat navigation — Kelahiran + Perjodohan grouped under one menu. No engine/data styles changed. */
.reading-menu-wrap{position:relative}.reading-menu-toggle{gap:8px;cursor:pointer}.hamburger{display:inline-flex;flex-direction:column;justify-content:center;gap:3px;width:13px;height:13px}.hamburger i{display:block;width:13px;height:1.5px;background:currentColor;border-radius:2px}.reading-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:205px;padding:7px;border:1px solid #7896b455;border-radius:13px;background:linear-gradient(145deg,#0b1422,#101c2d);box-shadow:0 20px 55px #000b;z-index:80}.reading-menu[hidden]{display:none}.reading-menu a{display:flex;align-items:center;gap:9px;color:#eaf2fc;text-decoration:none;padding:11px 12px;border-radius:9px;font-size:.76rem;font-weight:850}.reading-menu a:hover{background:#18283c;color:#fff}.reading-menu a+a{margin-top:2px}.reading-menu-toggle[aria-expanded="true"]{border-color:#9db9d955;background:#142337}
@media(max-width:760px){.header-actions{width:100%;justify-content:flex-end}.reading-menu{right:0;min-width:190px}}

/* V12 — Jodoh Urip explanation: additive UI only; calculation remains in the locked engine. */
.compat-urip-card{position:relative}
.urip-detail-btn{display:inline-flex;align-items:center;justify-content:center;margin-top:9px;border:1px solid #7896b444;background:#16263b;color:#dce8f5;border-radius:8px;padding:6px 9px;font-size:.62rem;font-weight:850;cursor:pointer;transition:.16s ease}
.urip-detail-btn:hover,.urip-detail-btn:focus-visible{background:#1d3049;border-color:#9db9d955;outline:none;transform:translateY(-1px)}
.urip-breakdown{display:grid;gap:8px;margin-top:16px}
.urip-breakdown>div{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #7088a322;border-radius:10px;background:rgba(20,31,47,.72);padding:11px 12px}
.urip-breakdown span{color:#8193a8;font-size:.74rem}
.urip-breakdown strong{color:#edf4ff;font-size:.82rem}
.urip-equation{margin-top:13px;padding:14px;border-top:1px solid #6e89a622;background:rgba(20,35,55,.48);border-radius:10px}
.urip-equation strong{font-size:1.05rem;color:#edf4ff}
.urip-equation p{margin-top:7px!important;color:#96a8bc!important;font-size:.78rem!important}
@media(max-width:560px){.urip-detail-btn{width:100%}.urip-breakdown>div{align-items:flex-start;flex-direction:column;gap:5px}}


/* V14 — Spiritual & Supranatural: additive UI only. Existing calendar/reading styles remain untouched. */
.spiritual-shell{padding-bottom:45px}
.spiritual-hero,.spiritual-input-card,.spiritual-card{background:rgba(9,15,25,.78);border:1px solid #7896b42b;backdrop-filter:blur(14px);box-shadow:0 20px 60px #0008}
.spiritual-hero{border-radius:22px;padding:30px;margin-bottom:16px;overflow:hidden;position:relative}
.spiritual-hero:after{content:"";position:absolute;width:260px;height:260px;border:1px solid #7896b422;border-radius:50%;right:-100px;top:-130px;box-shadow:0 0 0 38px #7896b40a,0 0 0 76px #7896b405}
.spiritual-hero h1{font-size:clamp(2rem,5vw,3.3rem);margin:8px 0 7px;letter-spacing:-.045em}
.spiritual-hero p{max-width:720px;color:#93a5ba;line-height:1.6;margin:0}
.spiritual-input-card{border-radius:18px;padding:21px 23px;display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:16px}
.spiritual-input-card h2{margin:6px 0 0;font-size:1.1rem}
.spiritual-form{display:flex;gap:8px}.spiritual-form input{background:#0e1725;color:#eef4ff;border:1px solid #6e89a644;border-radius:10px;padding:11px}
.spiritual-form button,.spiritual-detail-btn{border:0;background:var(--red);color:#fff;border-radius:10px;padding:11px 15px;font-weight:850;cursor:pointer}
.spiritual-result{display:grid;grid-template-columns:1.15fr .85fr;gap:16px}
.spiritual-card{border-radius:18px;padding:22px}.spiritual-card h2{margin:7px 0 7px;font-size:1.35rem}.spiritual-card h3{margin:5px 0;font-size:1rem}.spiritual-card p{margin:0;color:#96a8bc;line-height:1.65;font-size:.82rem}
.spiritual-main{grid-column:1/-1}.spiritual-kicker{color:#71859d;font-size:.58rem;font-weight:900;letter-spacing:.12em}.spiritual-duality{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:18px}.spiritual-mini{background:rgba(20,31,47,.82);border:1px solid #7088a322;border-radius:11px;padding:12px}.spiritual-mini small{display:block;color:#71859d;font-size:.54rem;font-weight:900}.spiritual-mini strong{display:block;margin-top:5px;color:#edf4ff;font-size:1rem}.spiritual-mini span{display:block;margin-top:4px;color:#8193a8;font-size:.64rem}
.spiritual-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}.spiritual-fact{background:rgba(20,31,47,.82);border:1px solid #7088a322;border-radius:10px;padding:11px}.spiritual-fact small{display:block;color:#71859d;font-size:.54rem;font-weight:900}.spiritual-fact strong{display:block;margin-top:5px;color:#edf4ff;font-size:.78rem}
.spiritual-direction{grid-column:1/-1}.direction-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:15px}.direction-cell{min-height:90px;background:rgba(20,31,47,.72);border:1px solid #7088a322;border-radius:12px;padding:12px;display:flex;flex-direction:column;justify-content:space-between}.direction-cell.center{background:rgba(35,35,48,.72)}.direction-cell.primary{border-color:#b7cee977;box-shadow:inset 0 0 0 1px #7896b422}.direction-cell .dir{font-size:.57rem;color:#71859d;font-weight:900;letter-spacing:.06em}.direction-cell strong{font-size:.82rem;color:#edf4ff}.direction-cell span{font-size:.62rem;color:#8fa0b3}.direction-cell .badge{display:inline-flex;align-self:flex-start;margin-top:6px;padding:4px 7px;border-radius:7px;border:1px solid #7896b433;color:#cbd8e7;background:#142337;font-size:.56rem;font-weight:900}.spiritual-detail-btn{margin-top:15px;background:#16263b;border:1px solid #7896b455}.spiritual-detail-btn:hover,.spiritual-detail-btn:focus-visible{background:#1d3049;border-color:#b7cee977;outline:none}
.spiritual-note{margin-top:14px;padding:12px 13px;border:1px solid #7896b422;border-radius:10px;color:#8193a8;font-size:.67rem;line-height:1.55}
.spiritual-dialog{width:min(760px,100%);max-height:min(88vh,860px);overflow:auto}.spiritual-dialog h3{margin:18px 0 5px;font-size:1rem}.spiritual-dialog p{margin:0;color:#b7c5d5;line-height:1.72;font-size:.82rem}.spiritual-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:14px}.spiritual-detail-grid>div{background:rgba(20,31,47,.7);border:1px solid #7088a322;border-radius:10px;padding:11px}.spiritual-detail-grid small{display:block;color:#71859d;font-size:.54rem;font-weight:900}.spiritual-detail-grid strong{display:block;margin-top:5px;color:#edf4ff;font-size:.76rem}
@media(max-width:760px){.spiritual-input-card{display:block}.spiritual-form{margin-top:14px}.spiritual-result{grid-template-columns:1fr}.spiritual-duality{grid-template-columns:1fr}.spiritual-facts{grid-template-columns:1fr 1fr}.direction-grid{grid-template-columns:repeat(3,1fr)}.spiritual-detail-grid{grid-template-columns:1fr}}
@media(max-width:480px){.spiritual-hero{padding:23px 19px}.spiritual-hero h1{font-size:2rem}.spiritual-input-card,.spiritual-card{padding:18px}.spiritual-form{display:grid;grid-template-columns:1fr}.spiritual-form button{width:100%}.spiritual-facts{grid-template-columns:1fr}.direction-cell{min-height:82px;padding:9px}.direction-cell strong{font-size:.72rem}.spiritual-dialog{max-height:88vh}}

/* V15 — Spiritual Reading prototype: only Spiritual module UI. */
.spiritual-form input[type="time"]{background:#0e1725;color:#eef4ff;border:1px solid #6e89a644;border-radius:10px;padding:11px}.spiritual-form input[type="date"]::-webkit-calendar-picker-indicator,.spiritual-form input[type="time"]::-webkit-calendar-picker-indicator{filter:invert(1);opacity:1}
.spiritual-reading-card{grid-column:1/-1}.spiritual-reading-card p{font-size:.9rem;line-height:1.82;color:#b9c7d7}.spiritual-reading-card p+p{margin-top:12px}.reading-section{padding:18px 0;border-top:1px solid #7896b41c}.reading-section:first-child{padding-top:4px;border-top:0}.reading-section h3{margin:5px 0 8px;color:#eef4ff;font-size:1.05rem}.reading-section p{margin:0 0 9px}.reading-kicker{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;background:#142337;border:1px solid #7896b433;color:#aebed0;font-size:.59rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase}.reading-meta{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.reading-meta span{padding:6px 8px;border-radius:8px;background:rgba(20,31,47,.7);border:1px solid #7088a322;color:#8193a8;font-size:.62rem}.reading-energy-line{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}.reading-energy-line span{padding:6px 9px;border-radius:999px;background:#142337;border:1px solid #7896b433;color:#cbd8e7;font-size:.61rem;font-weight:850}.detail-intro{padding-bottom:4px}.detail-description{margin-top:10px!important}.spiritual-attention{border-color:#7896b444;background:rgba(20,35,55,.68)}.spiritual-attention p{font-size:.86rem;line-height:1.78;color:#b9c7d7}.spiritual-energy-line{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.spiritual-energy-line span{border:1px solid #7896b433;background:#142337;border-radius:999px;padding:6px 9px;color:#cbd8e7;font-size:.61rem;font-weight:850}.spiritual-premium{grid-column:1/-1;position:relative;border-color:#7896b433;background:linear-gradient(145deg,rgba(13,21,34,.92),rgba(21,29,43,.78));overflow:hidden}.spiritual-premium:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(120,150,180,.04),transparent);pointer-events:none}.premium-lock{font-size:1.45rem;margin-bottom:7px}.spiritual-premium p{max-width:760px}.spiritual-premium button{margin-top:15px;border:1px solid #7896b433;background:#111d2d;color:#71859d;border-radius:10px;padding:10px 14px;font-weight:850;cursor:not-allowed}.spiritual-detail-grid{grid-template-columns:repeat(2,1fr)}
@media(max-width:760px){.spiritual-reading-card,.spiritual-premium{grid-column:auto}.spiritual-form input[type="time"]{width:100%}.spiritual-reading-card p{font-size:.84rem}.spiritual-energy-line{gap:6px}}

/* Mbahwat Digital Clock — isolated Calendar feature */
.digital-clock{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  margin-bottom:18px;padding:22px 24px;border-radius:18px;
  background:rgba(9,15,25,.76);border:1px solid #7896b42b;
  backdrop-filter:blur(14px);box-shadow:0 20px 60px #0008;color:#eef4ff;
}
.clock-time{font-size:clamp(2.5rem,5vw,4rem);font-weight:850;letter-spacing:.015em;line-height:1}
.clock-date{margin-top:8px;color:#aab8ca;font-size:.92rem}
.clock-zones{min-width:250px;border-left:1px solid #7896b42b;padding-left:22px;color:#dbe5f2;font-size:.9rem;line-height:2.05}
.clock-zones div+div{border-top:1px solid #7896b42b}
@media(max-width:760px){
  .digital-clock{display:block;padding:20px;margin-bottom:16px}
  .clock-zones{min-width:0;border-left:0;border-top:1px solid #7896b42b;margin-top:16px;padding:10px 0 0;line-height:2}
}

/* ============================================================
   Kalender — ukuran lebih rapi untuk layar kecil (v15)
   ============================================================ */
@media(max-width:560px){
  .brand-logo{width:46px;height:46px}
  .brand{font-size:1rem;letter-spacing:.12em}
  .tagline{font-size:.68rem}
  .clock-time{font-size:26px!important}
  .hero{padding:18px 16px 14px}
  .hero h1{font-size:1.35rem;letter-spacing:-.02em}
  .hero-date>span{font-size:1.9rem}
  .date-number{font-size:2.2rem}
  .detail-card h2{font-size:1.1rem}
  .lunar-copy h2{font-size:1.15rem}
  .calendar-panel{padding:12px}
  .day{min-height:64px;padding:6px 4px}
  .day-number{font-size:.92rem}
  .day-meta{font-size:.5rem;line-height:1.15}
  .weekday-row{font-size:.55rem}
  .calendar-grid{gap:4px}
  .lunar-copy p{font-size:.72rem}
  .search-card{padding:16px}
  .search-card h2{font-size:1rem}
}

/* header kalender: tombol tetap sebaris dengan logo (mobile) */
@media(max-width:560px){
  .site-header{flex-direction:row;align-items:center;justify-content:space-between;gap:8px;flex-wrap:nowrap}
  .brand-wrap{flex-direction:row;align-items:center;gap:8px;min-width:0}
  .brand-logo{width:38px;height:38px}
  .brand-copy{min-width:0}
  .brand{font-size:.88rem;letter-spacing:.1em;white-space:nowrap}
  .tagline{font-size:.58rem;white-space:nowrap}
  .header-actions{width:auto;flex:0 0 auto;gap:4px;flex-wrap:nowrap;justify-content:flex-end;overflow:visible}
  .feature-link,.today-btn{padding:6px 7px;font-size:.58rem;border-radius:8px;white-space:nowrap}
  .reading-menu-toggle{gap:4px}
  .site-header{overflow:visible;position:relative;z-index:30}
  .reading-menu-wrap{position:relative}
  .reading-menu{z-index:60}
}

/* dekorasi tidak boleh menghalangi klik tombol/panah */
.hero::before,.hero::after,.calendar-panel::before,.calendar-panel::after,
.lunar-feature::before,.lunar-feature::after,.site-header::before,.site-header::after{pointer-events:none}
.hero-bottom{position:relative;z-index:2}
.nav-btn{position:relative;z-index:3;pointer-events:auto}
.reading-menu{z-index:60}

/* tombol header kalender: tinggi & bentuk seragam (desktop dan mobile) */
.header-actions{align-items:center}
.feature-link,.today-btn,.reading-menu-toggle{
  display:inline-flex;align-items:center;justify-content:center;
  height:40px;padding:0 15px;box-sizing:border-box;
  border-radius:10px;font-size:.74rem;line-height:1;white-space:nowrap;
}
.reading-menu-toggle{gap:7px}
.reading-menu-toggle .hamburger{width:16px;height:12px}

@media(max-width:560px){
  .feature-link,.today-btn,.reading-menu-toggle{height:30px;padding:0 8px;font-size:.6rem;border-radius:8px}
  .reading-menu-toggle{gap:5px}
  .reading-menu-toggle .hamburger{width:12px;height:9px}
}

/* bungkus menu Pembacaan ikut flex agar sejajar sempurna dengan tombol lain */
.reading-menu-wrap{display:flex;align-items:center;line-height:0}