@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Shippori+Mincho:wght@500;600;700;800&display=swap');
:root{--bg:#090d1b;--surface:#11172b;--surface2:#171e35;--line:#28324c;--text:#f4f5ff;--muted:#98a4bf;--violet:#a884ff;--violet2:#7658e5;--cyan:#77e7e4;--gold:#ffcf76;--rose:#ff8dab;--green:#80e0ad;--shadow:0 24px 70px #03071670}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse 50% 35% at 66% -7%,#3c2b6f55,transparent),radial-gradient(ellipse 45% 28% at 2% 35%,#173d5d40,transparent),var(--bg);color:var(--text);font-family:'DM Sans',system-ui,sans-serif;min-height:100vh}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}h1,h2,h3,p{margin-top:0}h1,h2,h3,.display,.stat-value{font-family:Outfit,system-ui,sans-serif}svg{display:block}.app{display:grid;grid-template-columns:246px minmax(0,1fr);min-height:100vh}.sidebar{border-right:1px solid #28324b;background:#0b1021de;position:sticky;top:0;height:100vh;padding:30px 18px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;align-items:center;gap:10px;padding:3px 12px 28px}.brand-mark{width:39px;height:39px;background:linear-gradient(145deg,#b79aff,#7555df);border-radius:12px 4px 12px 4px;display:grid;place-items:center;box-shadow:0 8px 25px #7456e067;transform:rotate(-7deg)}.brand-mark svg{transform:rotate(7deg)}.brand strong{font-family:Outfit;font-size:23px;letter-spacing:.13em;font-weight:900}.brand small{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.22em;font-weight:800}.side-label{font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:#72809f;font-weight:800;padding:8px 13px}.nav{display:grid;gap:5px}.nav button{width:100%;display:flex;align-items:center;gap:13px;text-align:left;padding:13px 15px;background:transparent;border:1px solid transparent;color:#a2adc6;border-radius:12px;font-weight:800;font-size:13px}.nav button svg{width:19px;height:19px}.nav button:hover{background:#1a2240;color:#fff}.nav button.active{background:linear-gradient(100deg,#7252d144,#2d315788);color:#fff;border-color:#7658e560;box-shadow:inset 3px 0 var(--violet)}.sidebar-foot{margin-top:auto;padding:13px;border:1px solid #343458;background:linear-gradient(145deg,#292449,#151a32);border-radius:16px}.sidebar-foot .tiny{color:#bbace6;text-transform:uppercase;letter-spacing:.14em;font-size:10px;font-weight:800}.sidebar-foot strong{display:block;font-family:Outfit;font-size:20px;margin:6px 0}.sidebar-foot p{font-size:11px;color:#adb1d3;line-height:1.5;margin:0}.main{min-width:0;padding:29px clamp(20px,4vw,58px) 72px;max-width:1550px;width:100%;margin:auto}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px}.eyebrow{display:flex;align-items:center;gap:8px;color:var(--cyan);text-transform:uppercase;letter-spacing:.19em;font-size:11px;font-weight:900}.eyebrow:before{content:'';width:17px;height:2px;background:currentColor}.date-pill{border:1px solid var(--line);color:#cbd4ea;border-radius:999px;padding:9px 14px;background:#141b30;font-size:12px;font-weight:800;text-transform:capitalize}.screen{display:none;animation:rise .25s ease}.screen.active{display:block}@keyframes rise{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}.hero{min-height:245px;position:relative;overflow:hidden;border:1px solid #544591;border-radius:23px;background:radial-gradient(circle at 70% 25%,#7859c770,transparent 36%),linear-gradient(110deg,#2b2253 2%,#192b4e 66%,#142133);box-shadow:var(--shadow);padding:31px 36px;display:flex;align-items:center}.hero:after{content:'';position:absolute;inset:0;background-image:radial-gradient(#e6e1ff 1px,transparent 1px);background-size:18px 18px;opacity:.07;mask-image:linear-gradient(90deg,transparent 20%,#000)}.hero-copy{z-index:1;max-width:62%}.hero .chapter{display:inline-flex;border:1px solid #c6a7ff80;background:#9875ec25;border-radius:100px;color:#dbcaff;padding:6px 11px;font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}.hero h1{font-size:clamp(31px,3.6vw,49px);line-height:1.02;letter-spacing:-.035em;margin:16px 0 9px;font-weight:900}.hero p{font-size:13px;line-height:1.55;color:#c5c8e5;margin-bottom:18px}.hero-button,.primary{border:0;color:#16142c;background:linear-gradient(120deg,#eedbff,#a994ff);padding:11px 17px;border-radius:10px;font-size:12px;font-weight:900;box-shadow:0 7px 18px #17102d55}.hero-button:hover,.primary:hover{filter:brightness(1.1)}.hero-art{position:absolute;right:5%;bottom:-2px;width:min(35%,330px);height:100%;z-index:1;filter:drop-shadow(0 18px 25px #0c0b2860)}.hero-art svg{width:100%;height:100%}.hero-kanji{position:absolute;right:30%;top:-45px;color:#fff;opacity:.08;font-size:190px;font-weight:900;transform:rotate(-12deg)}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin:17px 0 25px}.stat{border:1px solid var(--line);background:#141a2e;border-radius:16px;padding:16px 17px;min-height:113px;position:relative;overflow:hidden}.stat:after{content:'';position:absolute;width:72px;height:72px;border:1px solid #ffffff0e;border-radius:50%;right:-18px;top:-19px}.stat-top{display:flex;align-items:center;justify-content:space-between;color:#aab5d0;text-transform:uppercase;font-size:10px;letter-spacing:.13em;font-weight:900}.stat-icon{color:var(--violet);width:18px;height:18px}.stat-value{font-size:30px;line-height:1.1;font-weight:900;margin:11px 0 3px}.stat-sub{color:#8d9bb6;font-size:11px}.stat:nth-child(2) .stat-icon{color:var(--gold)}.stat:nth-child(3) .stat-icon{color:var(--rose)}.stat:nth-child(4) .stat-icon{color:var(--cyan)}.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 318px;gap:20px;align-items:start}.panel{background:linear-gradient(180deg,#151b30,#101629);border:1px solid var(--line);border-radius:19px;padding:20px;min-width:0}.panel-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}.panel h2{font-size:21px;letter-spacing:-.02em;line-height:1.15;margin:0}.panel-sub{font-size:12px;color:var(--muted);margin:5px 0 0;line-height:1.45}.section-kicker{color:var(--violet);text-transform:uppercase;letter-spacing:.16em;font-size:10px;font-weight:900;margin-bottom:5px}.panel-stack{display:grid;gap:16px}.level-card{background:linear-gradient(140deg,#292446,#181e37);border-color:#544777}.level-row,.split{display:flex;align-items:center;justify-content:space-between;gap:12px}.level-number{font-family:Outfit;font-size:31px;font-weight:900}.level-rank{color:#c2b4ec;font-size:11px}.progress{height:9px;background:#0b1020;border-radius:20px;overflow:hidden;border:1px solid #303752}.progress>span{display:block;height:100%;width:0;background:linear-gradient(90deg,#8866ec,#78e4e1);border-radius:inherit;transition:width .35s}.progress.gold>span{background:linear-gradient(90deg,#ffb96e,#ffe19b)}.progress-meta{color:#9ba9c2;font-size:11px;display:flex;justify-content:space-between;margin-top:8px}.today-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.segmented{display:flex;background:#0b1122;border:1px solid var(--line);border-radius:10px;padding:3px;gap:2px}.segmented button{border:0;background:transparent;color:#97a5c2;border-radius:7px;padding:7px 11px;font-size:11px;font-weight:800}.segmented button.selected{background:#35305f;color:#f5eaff}.mission-group{margin-top:17px}.group-label{display:flex;align-items:center;gap:8px;color:#8896b1;font-size:10px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;margin:0 0 8px}.group-label:after{content:'';height:1px;background:#2a3450;flex:1}.quest{display:grid;grid-template-columns:43px minmax(0,1fr) auto;align-items:center;gap:13px;padding:12px 13px;margin:7px 0;border:1px solid #2b3651;border-radius:12px;background:#171e33;transition:.16s}.quest:hover{border-color:#65558e;transform:translateY(-1px)}.quest.current{border-color:#8e73dc;box-shadow:0 0 0 1px #8e73dc35,0 0 20px #7859df16}.quest.done{background:#162738;border-color:#32636e}.quest-check{appearance:none;width:33px;height:33px;margin:0;border:1.5px solid #66718b;border-radius:10px;background:#11172b;display:grid;place-items:center;cursor:pointer}.quest-check:checked{background:linear-gradient(135deg,#7ce3d9,#6daddc);border-color:#99f0e6}.quest-check:checked:after{content:'';width:12px;height:7px;border:solid #122038;border-width:0 0 3px 3px;transform:translateY(-2px) rotate(-45deg)}.quest-check:disabled{opacity:.4;cursor:not-allowed}.quest-main{min-width:0}.quest-name{font-size:13px;font-weight:800;line-height:1.35}.quest.done .quest-name{color:#a7c6ce}.quest-info{font-size:11px;color:#8999b5;margin-top:4px;line-height:1.35}.quest-time{color:#c4b1f1;font-weight:800}.quest-tag{font-size:9px;text-transform:uppercase;letter-spacing:.1em;border:1px solid #766048;color:#f2c792;padding:2px 5px;border-radius:4px;margin-left:7px;vertical-align:1px}.quest-xp{font:800 12px Outfit;color:var(--gold);white-space:nowrap}.empty{padding:32px;text-align:center;color:#a7b3cd;font-size:13px;border:1px dashed #39445f;border-radius:12px}.mission-footer{border-top:1px solid var(--line);margin-top:18px;padding-top:14px;display:flex;justify-content:space-between;align-items:center;color:#9aa8bf;font-size:11px;gap:12px}.side-highlight{border:1px solid #66518a;background:linear-gradient(145deg,#35264d,#1b2644);border-radius:17px;padding:18px;position:relative;overflow:hidden}.side-highlight:after{content:'✦';position:absolute;right:4px;top:-36px;font-size:155px;color:#c3a7ff13}.side-highlight>*{position:relative;z-index:1}.side-highlight .label{color:#d4bbff;font-size:10px;text-transform:uppercase;letter-spacing:.16em;font-weight:900}.side-highlight h3{font-size:20px;line-height:1.18;margin:8px 0}.side-highlight p{font-size:12px;color:#c1c5e0;line-height:1.45;margin:0 0 13px}.reward{display:inline-block;color:#ffe099;background:#4a3a5377;border:1px solid #8c6b6f;border-radius:7px;padding:6px 9px;font-size:11px;font-weight:900}.boss-item{margin:0 0 13px}.boss-item:last-child{margin-bottom:0}.boss-row{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:#bfcbe1;margin-bottom:6px}.boss-row span:last-child{color:#e3d0ff;font-weight:900}.boss-card .progress{height:6px}.boss-card .progress>span{background:linear-gradient(90deg,#a378f0,#db9de5)}.view-heading{margin:4px 0 20px}.view-heading h1{font-size:clamp(30px,4vw,43px);margin:4px 0 5px;letter-spacing:-.035em}.view-heading p{color:var(--muted);font-size:13px;line-height:1.5;max-width:680px}.week-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.week-controls strong{font-family:Outfit;font-size:17px}.icon-btn{border:1px solid var(--line);background:#1b233c;color:#e0e8fc;border-radius:9px;padding:8px 11px}.icon-btn:hover{background:#32365a}.week-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px;margin-bottom:18px}.date-card{border:1px solid #303b57;background:#151d33;color:#d1dbef;border-radius:13px;padding:14px 8px;text-align:center;min-height:102px}.date-card:hover{border-color:#8069c4}.date-card.selected{border-color:#a38af4;background:linear-gradient(145deg,#4a367c,#292849);box-shadow:0 8px 28px #5c40ae33}.date-card.future{opacity:.48}.date-card .dow{display:block;text-transform:uppercase;color:#9cabc6;font-size:10px;font-weight:900;letter-spacing:.1em}.date-card.selected .dow{color:#d8c9ff}.date-card .date-num{display:block;font:900 25px Outfit;margin:4px 0}.date-card .date-state{display:block;font-size:10px;color:#8fe0cf;font-weight:800}.date-card .date-state.rest{color:#d1baef}.date-card .date-state.pending{color:#9daac1}.week-summary{display:grid;grid-template-columns:1fr 1fr;gap:17px}.week-summary .panel{padding:20px}.badge-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.badge{border:1px solid #394360;background:linear-gradient(150deg,#1b223a,#11192b);border-radius:16px;padding:16px;min-height:228px;display:flex;flex-direction:column;position:relative;overflow:hidden}.badge:before{content:'';position:absolute;inset:-40px auto auto -30px;width:130px;height:130px;background:radial-gradient(circle,var(--badge-glow),transparent 70%);opacity:.32}.badge.locked{--badge-glow:#455477;border-color:#313b55}.badge.unlocked{border-color:var(--badge-border);box-shadow:inset 0 1px #ffffff17,0 7px 28px #0002}.badge-art{width:82px;height:82px;margin:2px auto 13px;position:relative;display:grid;place-items:center;filter:drop-shadow(0 7px 12px #0005)}.badge-art:before{content:'';position:absolute;inset:6px;clip-path:polygon(50% 0%,90% 23%,90% 77%,50% 100%,10% 77%,10% 23%);background:linear-gradient(140deg,var(--badge-light),var(--badge-dark));box-shadow:inset 0 0 15px #fff5}.badge-art:after{content:'';position:absolute;inset:12px;clip-path:polygon(50% 0%,90% 23%,90% 77%,50% 100%,10% 77%,10% 23%);border:2px solid #ffffff7c;background:linear-gradient(130deg,#ffffff28,transparent)}.badge-art svg{width:42px;height:42px;position:relative;z-index:1;stroke:#fff9e9;stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 2px #0006)}.badge.locked .badge-art{filter:grayscale(1) brightness(.65)}.badge-name{font:800 14px Outfit;margin:0 0 4px}.badge-desc{font-size:11px;color:#98a7bf;line-height:1.4;margin:0 0 12px;flex:1}.badge-progress{display:flex;justify-content:space-between;color:var(--badge-light);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.07em;margin-bottom:7px}.badge.locked .badge-progress{color:#9aa6be}.badge .progress{height:5px}.badge .progress>span{background:linear-gradient(90deg,var(--badge-dark),var(--badge-light))}.collection-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:18px}.collection-count{font:900 34px Outfit;color:#d4b5ff}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.setting-block{padding:17px 0;border-top:1px solid var(--line)}.setting-block:first-child{border:0;padding-top:0}.setting-block h3{font-size:15px;margin:0 0 5px}.setting-block p{font-size:12px;color:var(--muted);line-height:1.5}.button-row{display:flex;flex-wrap:wrap;gap:8px}.secondary,.danger{border:1px solid #505c78;background:#242d45;color:#f1f4ff;border-radius:9px;padding:9px 13px;font-size:12px;font-weight:800}.secondary:hover{background:#35405d}.danger{background:#3a2538;border-color:#8a4a64;color:#ffc4d4}.danger:hover{background:#5a3045}.rules{display:grid;gap:10px}.rule{padding:12px;background:#171f35;border:1px solid #303a55;border-radius:10px;color:#aebbd2;font-size:12px;line-height:1.5}.rule b{color:#e6ddff}.toast{position:fixed;bottom:23px;right:25px;z-index:20;padding:12px 16px;background:#29304e;color:#fff;border:1px solid #967bd8;border-radius:11px;box-shadow:var(--shadow);font-weight:800;font-size:12px;opacity:0;transform:translateY(14px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}.hidden{display:none!important}.mobile-nav{display:none}@media(max-width:1120px){.app{grid-template-columns:205px minmax(0,1fr)}.content-grid{grid-template-columns:minmax(0,1fr) 280px}.badge-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.app{display:block}.sidebar{display:none}.main{padding:20px 20px 90px}.mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:10;background:#0d1325f2;border-top:1px solid #39405a;padding:8px max(8px,env(safe-area-inset-left)) max(8px,env(safe-area-inset-bottom));justify-content:space-around;backdrop-filter:blur(16px)}.mobile-nav button{display:grid;place-items:center;gap:3px;background:none;border:0;color:#8d9bb7;font-size:10px;font-weight:800;padding:4px 9px;min-width:65px}.mobile-nav button.active{color:#c6adff}.mobile-nav svg{width:20px;height:20px}.content-grid{grid-template-columns:1fr 290px}}@media(max-width:700px){.hero{min-height:215px;padding:24px}.hero-copy{max-width:72%}.hero-art{right:-15px;width:39%;opacity:.82}.hero h1{font-size:32px}.stat-grid{grid-template-columns:repeat(2,1fr)}.content-grid,.week-summary,.settings-grid{grid-template-columns:1fr}.panel-stack{grid-template-columns:1fr 1fr}.badge-grid{grid-template-columns:repeat(2,1fr)}.week-strip{gap:5px}.date-card{min-height:88px;padding:10px 2px}.date-card .date-num{font-size:21px}.date-card .date-state{font-size:8px}}@media(max-width:520px){.main{padding:17px 14px 90px}.topbar{margin-bottom:13px}.hero{min-height:225px;padding:23px}.hero-copy{max-width:78%}.hero-art{right:-36px;width:55%;opacity:.55}.hero h1{font-size:30px}.hero p{font-size:12px}.hero-kanji{display:none}.stat-grid{gap:8px;margin:10px 0 17px}.stat{min-height:100px;padding:13px}.stat-value{font-size:26px}.panel{padding:16px}.panel-stack{grid-template-columns:1fr}.quest{gap:9px;padding:11px 9px;grid-template-columns:34px minmax(0,1fr) auto}.quest-check{width:28px;height:28px}.quest-name{font-size:12px}.quest-info{font-size:10px}.quest-xp{font-size:10px}.badge-grid{gap:9px}.badge{padding:12px;min-height:223px}.badge-art{width:71px;height:71px}.week-strip{overflow-x:auto;grid-template-columns:repeat(7,minmax(55px,1fr))}.date-card .dow{font-size:9px}.week-controls strong{font-size:14px}}
/* SHŪREN — dirección editorial / diario de disciplina */
:root{
  --bg:#181916;--surface:#22231f;--surface2:#292a25;--line:#3c3b34;
  --text:#eee6d5;--muted:#aaa397;--violet:#b95743;--violet2:#8e3f32;
  --cyan:#90977d;--gold:#c19a58;--rose:#b95743;--green:#839078;
  --paper:#eee6d5;--ink:#181916;--shadow:0 18px 48px #0a0b0960;
}
body{
  background-color:var(--bg);
  background:
    linear-gradient(#ffffff05 1px,transparent 1px),
    linear-gradient(90deg,#ffffff03 1px,transparent 1px),
    radial-gradient(circle at 78% 4%,#8a755126,transparent 31%),
    var(--bg);
  background-size:36px 36px,36px 36px,auto,auto;
  font-family:'DM Sans',system-ui,sans-serif;
}
body:before{content:'';position:fixed;inset:0;pointer-events:none;opacity:.28;z-index:30;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.055'/%3E%3C/svg%3E")}
h1,h2,h3,.display,.stat-value,.level-number,.week-controls strong,.collection-count{font-family:'Shippori Mincho',Georgia,serif}
.app{grid-template-columns:218px minmax(0,1fr)}
.sidebar{padding:27px 17px 24px;background:#151613f5;border-color:var(--line)}
.brand{padding:2px 10px 32px;gap:12px}
.brand-mark{width:37px;height:37px;border-radius:50%;background:var(--paper);box-shadow:none;transform:none;color:var(--ink)}
.brand-mark svg{transform:none;stroke:var(--ink)}
.brand strong{font-family:'Shippori Mincho',serif;font-size:21px;letter-spacing:.16em}
.brand small{font-size:8px;color:#938b7c;letter-spacing:.2em;margin-top:2px}
.side-label{color:#777466;font-size:9px;padding:7px 12px;letter-spacing:.18em}
.nav{gap:2px}
.nav button{border-radius:4px;padding:12px;color:#9e988b;font-weight:600;font-size:12px;letter-spacing:.01em}
.nav button:hover{background:#24251f;color:var(--paper)}
.nav button.active{background:#292a24;color:var(--paper);border-color:#48463c;box-shadow:inset 2px 0 var(--rose)}
.nav button svg{width:17px;height:17px}
.sidebar-foot{padding:15px 13px;background:transparent;border:1px solid #38382f;border-radius:4px}
.sidebar-foot .tiny{color:var(--gold);font-size:8px}
.sidebar-foot strong{font-family:'Shippori Mincho',serif;font-size:16px;margin:7px 0 5px}
.sidebar-foot p{font-size:10px;color:#8e897e}
.main{padding:27px clamp(24px,4vw,62px) 78px;max-width:1420px}
.topbar{padding-bottom:16px;margin-bottom:22px;border-bottom:1px solid var(--line)}
.eyebrow{color:var(--gold);font-size:9px;letter-spacing:.22em}
.eyebrow:before{width:24px;height:1px}
.date-pill{border:0;background:transparent;padding:0;color:#aca596;font-size:11px;font-weight:600}
.screen{animation:editorialRise .32s cubic-bezier(.22,.7,.25,1)}
@keyframes editorialRise{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.hero{min-height:208px;border-radius:3px;border-color:#4b493e;background:linear-gradient(112deg,#292a24 0 60%,#343027 60%);padding:30px 34px;box-shadow:var(--shadow)}
.hero:before{content:'SHŪREN / REGISTRO DE CAMPO';position:absolute;right:-5px;bottom:15px;font:700 10px 'DM Sans';letter-spacing:.26em;color:#c8b88d38;transform:rotate(-90deg);transform-origin:right bottom}
.hero:after{background-image:linear-gradient(90deg,#ffffff0b 1px,transparent 1px),linear-gradient(#ffffff08 1px,transparent 1px);background-size:22px 22px;opacity:.32;mask-image:linear-gradient(90deg,transparent 43%,#000)}
.hero-copy{max-width:58%}
.hero .chapter{border:0;border-radius:0;background:transparent;color:var(--gold);padding:0 0 8px;border-bottom:1px solid #8e7650;font-size:9px;letter-spacing:.2em}
.hero h1{font-family:'Shippori Mincho',serif;font-size:clamp(31px,3.3vw,47px);font-weight:700;letter-spacing:-.035em;line-height:1.08;margin:15px 0 8px}
.hero p{color:#bdb5a5;font-size:12px;max-width:520px;margin-bottom:19px}
.hero-button,.primary{border:1px solid #cfbe9c;border-radius:2px;background:var(--paper);color:var(--ink);box-shadow:4px 4px 0 #8c4034;padding:10px 16px;font-size:11px;letter-spacing:.03em}
.hero-button:hover,.primary:hover{filter:none;transform:translate(-1px,-1px);box-shadow:6px 6px 0 #8c4034}
.hero-art{right:-1%;bottom:-13%;width:min(43%,420px);height:124%;filter:none;display:block;border:0;background:url('../assets/characters/samurai-hoy-v2.webp') right bottom/contain no-repeat,radial-gradient(circle at 63% 46%,#b9a57a1a,transparent 42%)}
.hero-art svg{display:none}
.hero-art:before,.hero-art:after{content:none}
.hero-kanji{right:32%;top:-40px;color:#c7b78d;opacity:.06;font-family:'Shippori Mincho',serif}
.stat-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:14px 0 22px;border:1px solid var(--line);background:#1e1f1b}
.stat{border:0;border-right:1px solid var(--line);border-radius:0;background:transparent;min-height:76px;padding:12px 16px}
.stat:last-child{border-right:0}.stat:after{display:none}
.stat-top{font-size:8px;color:#898477;letter-spacing:.17em}
.stat-icon{width:15px;height:15px;color:var(--gold)!important}
.stat-value{font-size:23px;margin:7px 0 0;font-weight:700}
.stat-sub{font-size:9px;color:#918b7f}
.content-grid{grid-template-columns:minmax(0,1fr) 292px;gap:17px}
.panel{border-radius:3px;border-color:var(--line);background:#20211d;padding:20px;box-shadow:none}
.panel-title{margin-bottom:14px}
.panel h2{font-size:20px;font-weight:700}
.panel-sub{font-size:11px;color:var(--muted)}
.section-kicker{color:var(--gold);font-size:8px;letter-spacing:.2em}
.level-card{background:#292a24;border-color:#4b493e}
.level-rank{color:#aaa28f}
.progress{height:5px;background:#131411;border:0;border-radius:0}
.progress>span{background:var(--rose);border-radius:0;transition:width .35s cubic-bezier(.22,.7,.25,1)}
.progress.gold>span{background:var(--gold)}
.segmented{border-radius:2px;background:#171814;border-color:#393931;padding:2px}
.segmented button{border-radius:1px;color:#969084;padding:6px 10px;font-size:10px}
.segmented button.selected{background:#3a3930;color:var(--paper)}
.group-label{color:#8c8679;font-size:8px;letter-spacing:.2em}
.group-label:after{background:#393930}
.quest{grid-template-columns:36px minmax(0,1fr) auto;gap:12px;padding:12px 11px;margin:5px 0;border:0;border-bottom:1px solid #38382f;border-radius:0;background:transparent;transition:background .18s,transform .18s}
.quest:first-of-type{border-top:1px solid #38382f}
.quest:hover{border-color:#504d41;background:#272822;transform:none}
.quest.current{border-color:#6a5944;background:linear-gradient(90deg,#b9574318,transparent 56%);box-shadow:inset 2px 0 var(--rose)}
.quest.done{background:transparent;border-color:#33342d;opacity:.72}
.quest-check{width:26px;height:26px;border-radius:50%;border-color:#696559;background:#181916}
.quest-check:checked{background:var(--rose);border-color:#d08570;box-shadow:none}
.quest-check:checked:after{border-color:#f5ead7;width:10px;height:6px;border-width:0 0 2px 2px}
.quest-name{font-family:'Shippori Mincho',serif;font-size:13px;font-weight:700}
.quest.done .quest-name{text-decoration:line-through;text-decoration-color:#8a7d65;color:#9e988b}
.quest-info{font-size:10px;color:#898478}
.quest-time{color:#b7a98c;font-variant-numeric:tabular-nums}
.quest-tag{border-radius:1px;border-color:#625c4c;color:#b8a77f;font-size:7px}
.quest-xp{font-family:'DM Sans',sans-serif;color:#bca06e;font-size:10px;letter-spacing:.03em}
.mission-footer{border-color:#393930;color:#908a7e}
.side-highlight{border-radius:3px;border-color:#574b3c;background:#302b23;padding:18px}
.side-highlight:after{content:'✦';right:8px;top:-31px;color:#cbb9880c}
.side-highlight .label{color:var(--gold);font-size:8px}
.side-highlight h3{font-size:19px}
.side-highlight p{font-size:11px;color:#aca594}
.reward{border-radius:1px;border-color:#645740;background:#211f1a;color:#c9a96c;font-size:10px}
.boss-card .progress>span{background:var(--gold)}
.view-heading h1{font-weight:700}.view-heading p{color:#aaa397}
.icon-btn,.secondary,.danger{border-radius:2px;background:#292a24;border-color:#4b493e}
.date-card{border-radius:2px;background:#20211d;border-color:#393930;color:var(--paper)}
.date-card:hover{border-color:#756b55}.date-card.selected{border-color:#9f8060;background:#332e25;box-shadow:inset 0 -2px var(--rose)}
.date-card .dow{color:#999285;font-size:8px}.date-card.selected .dow{color:#d4c7ad}.date-card .date-state{color:#9eaa90}
.badge{border-radius:3px;background:#20211d;border-color:#3c3b34;min-height:220px}
.badge:before{opacity:.08}.badge.unlocked{box-shadow:none;border-color:#74654d}.badge-art{filter:grayscale(.72) sepia(.28)}.badge-progress{color:#bca06e!important}.badge .progress>span{background:var(--gold)}
.badge-name{font-family:'Shippori Mincho',serif}.badge-desc{color:#9e988b}
.rules .rule{border-radius:2px;background:#252620;border-color:#3b3b33}
.toast{border-radius:2px;background:#eee6d5;color:#181916;border:0;box-shadow:5px 5px 0 #8c4034;font-size:11px}
.empty{border-radius:2px;border-color:#4a483e;color:#a39d90}
@media(max-width:1120px){.app{grid-template-columns:194px minmax(0,1fr)}.content-grid{grid-template-columns:minmax(0,1fr) 270px}}
@media(max-width:900px){.main{padding:18px 18px 88px}.mobile-nav{background:#171814f7;border-color:#45433a;backdrop-filter:blur(14px)}.mobile-nav button{color:#918b7e}.mobile-nav button.active{color:#d0a765}.content-grid{grid-template-columns:1fr 278px}}
@media(max-width:700px){.hero{min-height:192px;padding:24px}.hero-copy{max-width:68%}.hero-art{width:39%;right:-2%;bottom:-8%;height:112%}.stat-grid{grid-template-columns:repeat(2,1fr)}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid var(--line)}.content-grid,.week-summary,.settings-grid{grid-template-columns:1fr}.panel-stack{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.main{padding:14px 12px 84px}.topbar{padding-bottom:12px}.hero{min-height:184px;padding:21px}.hero-copy{max-width:100%;position:relative;z-index:2}.hero h1{font-size:29px;max-width:85%}.hero p{max-width:82%}.hero-art{display:none}.hero:after{opacity:.16;mask-image:none}.stat{padding:11px 12px}.stat-value{font-size:21px}.panel{padding:15px}.panel-stack{grid-template-columns:1fr}.quest{grid-template-columns:31px minmax(0,1fr) auto;padding:11px 6px}.quest-check{width:24px;height:24px}.badge{min-height:213px}}

/* SHŪREN v3 — composición editorial inspirada en Reverse: 1999 */
:root{
  --bg:#071011;--surface:#0b1415;--surface2:#111b1b;--line:#38403c;
  --text:#e8e2d6;--muted:#898f88;--violet:#b85d32;--violet2:#7f351f;
  --cyan:#83938b;--gold:#bd7043;--rose:#b85d32;--green:#6f7c70;
  --paper:#e8e2d6;--ink:#071011;--shadow:none;
}
body{
  background-color:var(--bg);
  background-image:
    radial-gradient(circle at 73% 17%,#31413c2e,transparent 27%),
    linear-gradient(116deg,transparent 0 48%,#79827a0d 48.1% 48.25%,transparent 48.35%),
    radial-gradient(#c9d0c908 .65px,transparent .8px);
  background-size:auto,auto,5px 5px;
}
body:before{opacity:.18}
.app{display:block;min-height:100vh}
.sidebar{
  position:fixed;inset:0 0 auto 0;width:100%;height:72px;padding:0 4.5vw;
  display:flex;flex-direction:row;align-items:center;gap:42px;
  background:linear-gradient(180deg,#071011f5,#071011c9 68%,transparent);
  border:0;z-index:20;
}
.brand{padding:0;margin-right:auto;gap:10px}
.brand-mark{width:40px;height:40px;background:url('../assets/brand/shuren-mark.webp') center/contain no-repeat;border:0;border-radius:0;flex:0 0 40px}
.brand-mark svg{display:none}
.brand strong{font-size:18px;letter-spacing:.22em}
.brand small{display:none}
.side-label,.sidebar-foot{display:none}
.nav{display:flex;align-items:center;gap:26px}
.nav button{width:auto;padding:8px 0;border:0;border-radius:0;background:transparent!important;color:#8d928d;font-family:'Shippori Mincho',serif;font-size:9px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;box-shadow:none!important;position:relative}
.nav button:before{content:'';position:absolute;left:50%;right:50%;bottom:2px;height:1px;background:var(--rose);transition:.25s}
.nav button:hover,.nav button.active{color:#e8e2d6}
.nav button.active:before{left:0;right:0}
.nav button svg{display:none}
.main{max-width:1540px;padding:92px clamp(28px,5vw,76px) 90px}
.topbar{border:0;padding:0;margin:0 0 8px;position:relative;z-index:5}
.eyebrow{font-size:8px;color:#9ca199}.eyebrow:before{background:var(--rose)}
.date-pill{font-family:'Shippori Mincho',serif;font-size:9px;color:#8f938d}
.hero{
  min-height:410px;padding:66px clamp(28px,4vw,58px);overflow:hidden;
  border:0;border-radius:0;background:transparent;box-shadow:none;isolation:isolate;
}
.hero:before{
  content:'';position:absolute;width:430px;height:205px;right:11%;top:20%;
  border:1px solid #b85d326b;border-radius:50%;transform:rotate(-13deg);
  background:
    radial-gradient(#c36c3e40 1px,transparent 1.3px) center/7px 7px,
    linear-gradient(140deg,#2636347d,#0a1111 58%);
  box-shadow:0 0 0 22px #07101166;z-index:0;
}
.hero:after{
  content:'';position:absolute;inset:0;opacity:1;z-index:0;pointer-events:none;
  background:
    linear-gradient(153deg,transparent 0 60%,#a95a313d 60.12%,transparent 60.28%),
    linear-gradient(24deg,transparent 0 68%,#88918a1c 68.1%,transparent 68.25%);
  mask-image:none;
}
.hero-copy{max-width:49%;position:relative;z-index:4}
.hero .chapter{font-family:'Shippori Mincho',serif;border:0;padding:0;color:#b7653a;font-size:9px;letter-spacing:.26em}
.hero h1{font-size:clamp(46px,5.1vw,76px);line-height:.98;letter-spacing:-.055em;margin:21px 0 14px;max-width:700px;text-wrap:balance}
.hero p{font-family:'Shippori Mincho',serif;font-size:12px;line-height:1.8;color:#a8ada6;max-width:440px}
.hero-button,.primary{background:transparent;color:#ddd7ca;border:1px solid #8f4d2e;box-shadow:none;border-radius:0;padding:11px 20px;font-family:'Shippori Mincho',serif;font-size:10px;letter-spacing:.06em;position:relative}
.hero-button:before,.primary:before{content:'▶';font-size:7px;color:var(--rose);margin-right:8px}
.hero-button:hover,.primary:hover{transform:none;box-shadow:inset 0 0 0 1px #b85d32;background:#b85d3212}
.hero-art{
  right:1%;bottom:-29%;width:min(50%,570px);height:154%;z-index:3;
  background:url('../assets/characters/samurai-hoy-v2.webp') right bottom/contain no-repeat;
  filter:drop-shadow(0 24px 30px #000b);
}
.hero-kanji{display:none}
.stat-grid{margin:0 0 42px;border:0;border-top:1px solid #3e4642;border-bottom:1px solid #3e4642;background:transparent;position:relative}
.stat-grid:before{content:'1999';position:absolute;left:0;bottom:-24px;color:#b85d32;font-size:8px;letter-spacing:.14em}
.stat{min-height:68px;padding:13px 19px;border-color:#303835;background:transparent}
.stat-top{font-size:7px;color:#777f79}.stat-icon{display:none}.stat-value{font-size:22px;color:#ded8cc}.stat-sub{font-size:8px;color:#727a74}
.content-grid{grid-template-columns:minmax(0,1fr) 270px;gap:42px;max-width:1220px;margin:0 auto}
.panel{padding:0;border:0;border-radius:0;background:transparent}
.panel-title{border-bottom:1px solid #3d4541;padding-bottom:16px;margin-bottom:12px}
.panel h2{font-size:27px;letter-spacing:-.03em}
.panel-sub{color:#858c86}
.section-kicker{font-size:7px;color:#b85d32;letter-spacing:.25em}
.today-head{margin-bottom:16px}
.segmented{padding:0;border:0;background:transparent;gap:18px}
.segmented button{padding:4px 0;border-bottom:1px solid transparent;background:transparent!important;color:#747c76;font-family:'Shippori Mincho',serif;font-size:9px}
.segmented button.selected{color:#e0dace;border-color:#b85d32}
.mission-group{margin-top:22px}.group-label{font-size:7px;color:#747c76}.group-label:after{background:#313936}
.quest{min-height:67px;padding:12px 7px;margin:0;border:0;border-bottom:1px solid #303835;background:transparent;grid-template-columns:34px minmax(0,1fr) auto}
.quest:hover{background:linear-gradient(90deg,#b85d3214,transparent 68%)}
.quest.current{background:linear-gradient(90deg,#b85d3222,transparent 72%);box-shadow:inset 1px 0 var(--rose)}
.quest.done{background:transparent}
.quest-check{width:24px;height:24px;background:#071011;border-color:#66706a}
.quest-check:checked{background:#a95330;border-color:#d09872}
.quest-name{font-size:15px}.quest-info{color:#737b75}.quest-time{color:#a8aaa0}.quest-xp{color:#bd7043}
.mission-footer{border-color:#3d4541}
.panel-stack{gap:30px;padding-top:3px}
.level-card,.side-highlight,.boss-card{padding:0;background:transparent;border:0;border-radius:0}
.level-card,.side-highlight{padding-bottom:25px;border-bottom:1px solid #3d4541}
.side-highlight:after{display:none}
.side-highlight h3{font-size:21px}.side-highlight p{color:#858c86}
.reward{padding:5px 0;border:0;border-radius:0;background:transparent;color:#bd7043}
.progress{height:2px;background:#26302c}.progress>span{background:#b85d32}
.boss-row{color:#939a94}.progress-meta{color:#737b75}
.view-heading{min-height:180px;padding:45px 0 25px;border-bottom:1px solid #3d4541;margin-bottom:34px;position:relative}
.view-heading:after{content:'✦';position:absolute;right:8%;top:4px;font:400 140px/1 'Shippori Mincho',serif;color:#a65a3020}
.view-heading h1{font-size:clamp(44px,5vw,72px);line-height:1}.view-heading p{font-family:'Shippori Mincho',serif;color:#8e958f}
.week-strip{gap:1px;border-block:1px solid #3d4541;background:#3d4541}.date-card{border:0;border-radius:0;background:#091213;min-height:96px}.date-card.selected{background:#14201e;box-shadow:inset 0 -2px var(--rose)}
.week-summary,.settings-grid{gap:42px}.week-summary .panel,.settings-grid .panel{padding:0}
.badge-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#3b433f;border:1px solid #3b433f}
.badge{border:0;border-radius:0;background:#0a1314;min-height:226px}.badge.unlocked{border:0}.badge:before{opacity:.05}
.collection-count{color:#b85d32}
.collection-actions{display:grid;justify-items:end;gap:10px}.badge-filters{gap:12px}.badge-filters button{font-size:8px}
.rules .rule{border:0;border-bottom:1px solid #343c38;border-radius:0;background:transparent;padding:15px 0}
.secondary,.danger,.icon-btn{border-radius:0;background:transparent;border-color:#4b554f}
.toast{background:#e5dfd3;color:#081011;box-shadow:4px 4px 0 #a95330}
@media(max-width:1100px){.hero{min-height:380px}.hero:before{right:5%;width:360px}.hero-art{width:48%;right:-4%}.content-grid{gap:28px}}
@media(max-width:900px){.sidebar{display:none}.main{padding:72px 20px 90px}.topbar{margin-top:8px}.hero{min-height:350px;padding:48px 24px}.hero-copy{max-width:56%}.hero h1{font-size:48px}.hero-art{display:block;width:48%;right:-8%;bottom:-23%;height:142%}.mobile-nav{background:#071011f2;border-color:#36403b}.mobile-nav button.active{color:#c86b3c}.content-grid{grid-template-columns:1fr 240px}.badge-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.hero{min-height:320px;padding:39px 20px}.hero-copy{max-width:63%}.hero h1{font-size:39px}.hero p{font-size:11px;max-width:90%}.hero:before{width:280px;height:150px;right:-4%;top:25%}.hero-art{display:block;width:53%;right:-15%;bottom:-15%;height:125%}.stat-grid{margin-bottom:34px}.content-grid{grid-template-columns:1fr}.panel-stack{grid-template-columns:1fr 1fr}.badge-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.main{padding:66px 13px 84px}.topbar{margin-bottom:0}.hero{min-height:395px;padding:34px 17px;align-items:flex-start}.hero-copy{max-width:100%}.hero h1{font-size:38px;max-width:92%;margin-top:17px}.hero p{max-width:80%}.hero-button{margin-top:4px}.hero:before{width:250px;height:125px;right:-15%;top:47%}.hero-art{display:block;width:78%;height:76%;right:-22%;bottom:-12%;opacity:.72}.stat{min-height:62px;padding:10px}.stat-value{font-size:19px}.content-grid{display:block}.panel-stack{display:grid;margin-top:36px}.badge-grid{grid-template-columns:1fr 1fr;gap:1px}.view-heading{min-height:150px;padding-top:30px}.view-heading h1{font-size:42px}}
/* Feedback, recompensas y microinteracciones */
.feedback-layer{position:fixed;inset:0;pointer-events:none;z-index:80;overflow:hidden}
.toast-stack{position:fixed;right:24px;bottom:24px;z-index:70;display:grid;gap:9px;width:min(360px,calc(100vw - 28px));pointer-events:none}
.game-toast{display:grid;grid-template-columns:28px minmax(0,1fr);align-items:center;gap:11px;padding:12px 14px;background:#e5dfd3;color:#081011;border-left:3px solid #b85d32;box-shadow:5px 5px 0 #5f2c1d;font-size:11px;animation:toastIn .32s cubic-bezier(.2,.8,.2,1),toastOut .28s ease 3.1s forwards}
.game-toast .toast-glyph{width:26px;height:26px;border:1px solid #9d4d2d;border-radius:50%;display:grid;place-items:center;color:#9d4d2d;font:700 13px 'Shippori Mincho',serif}
.game-toast strong{display:block;font-family:'Shippori Mincho',serif;font-size:12px}.game-toast small{display:block;color:#5f625e;margin-top:2px}
.xp-float{position:fixed;z-index:90;color:#e4a16f;font:700 15px 'Shippori Mincho',serif;text-shadow:0 2px 8px #000;pointer-events:none;animation:xpRise 1.15s cubic-bezier(.15,.75,.25,1) forwards}
.ink-particle{position:fixed;z-index:89;width:5px;height:5px;border-radius:50%;background:#b85d32;pointer-events:none;animation:inkBurst .72s ease-out forwards}
.achievement-overlay{position:fixed;inset:0;z-index:75;display:grid;place-items:center;background:#020707b8;backdrop-filter:blur(4px);pointer-events:none;animation:veilIn .25s ease,veilOut .35s ease 2.75s forwards}
.achievement-card{width:min(430px,calc(100vw - 34px));padding:34px 30px;text-align:center;background:#0b1415;border:1px solid #8e4b2d;box-shadow:0 0 0 1px #182321,0 24px 70px #000b;position:relative;animation:achievementIn .55s cubic-bezier(.17,.84,.25,1)}
.achievement-card:before,.achievement-card:after{content:'';position:absolute;top:50%;width:70px;height:1px;background:#9d5130}.achievement-card:before{right:calc(100% + 14px)}.achievement-card:after{left:calc(100% + 14px)}
.achievement-seal{width:86px;height:86px;margin:0 auto 17px;display:grid;place-items:center;border:1px solid #a55a36;border-radius:50%;color:#e8e2d6;background:radial-gradient(circle,#b85d322b,transparent 64%);animation:sealTurn .65s cubic-bezier(.2,.8,.2,1)}
.achievement-seal svg{width:43px;height:43px}.achievement-kicker{color:#bd7043;font-size:8px;letter-spacing:.27em;text-transform:uppercase}.achievement-card h2{font-size:28px;margin:8px 0 6px}.achievement-card p{color:#929992;font-size:11px;margin:0}
.quest{overflow:visible}.quest .quest-xp{transition:transform .2s,color .2s}.quest:hover .quest-xp{transform:translateX(-4px);color:#df8b58}
.quest.completing{animation:questComplete .5s ease}.quest.completing .quest-check{animation:checkStamp .42s cubic-bezier(.2,.9,.2,1)}
.badge{transition:transform .25s,border-color .25s,background .25s}.badge:hover{transform:translateY(-4px);background:#101b1b}.badge.unlocked:hover{border-color:#9f5b38}.badge.just-unlocked{animation:badgePulse .8s ease}
.badge-art{transition:transform .35s}.badge:hover .badge-art{transform:scale(1.06) rotate(-2deg)}
.progress{position:relative;overflow:hidden}.progress>span:after{content:'';position:absolute;inset:0;width:35%;background:linear-gradient(90deg,transparent,#f5d2ad70,transparent);transform:translateX(-180%);animation:progressSweep 2.8s ease-in-out infinite}
.stat-value{transition:transform .25s,color .25s}.stat:hover .stat-value{transform:translateY(-2px);color:#e59a67}
.brand-mark{transition:transform .35s,filter .35s}.brand:hover .brand-mark{transform:rotate(-7deg) scale(1.08);filter:drop-shadow(0 4px 8px #0008)}
.nav button:active,.segmented button:active,.hero-button:active,.secondary:active,.icon-btn:active{transform:scale(.96)}
.date-card{transition:transform .2s,background .2s}.date-card:hover{transform:translateY(-3px)}
.hero-art{animation:none}
@keyframes toastIn{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
@keyframes toastOut{to{opacity:0;transform:translateX(18px)}}
@keyframes xpRise{0%{opacity:0;transform:translate(-50%,8px) scale(.75)}20%{opacity:1;transform:translate(-50%,-6px) scale(1.08)}100%{opacity:0;transform:translate(-50%,-70px) scale(.9)}}
@keyframes inkBurst{from{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.25)}}
@keyframes veilIn{from{opacity:0}to{opacity:1}}@keyframes veilOut{to{opacity:0}}
@keyframes achievementIn{0%{opacity:0;transform:translateY(22px) scale(.92)}65%{transform:translateY(-3px) scale(1.015)}100%{opacity:1;transform:none}}
@keyframes sealTurn{from{opacity:0;transform:rotate(-30deg) scale(.5)}to{opacity:1;transform:none}}
@keyframes questComplete{0%{background:#b85d3200}35%{background:#b85d3234}100%{background:#b85d3200}}
@keyframes checkStamp{0%{transform:scale(.7) rotate(-8deg)}65%{transform:scale(1.22) rotate(3deg)}100%{transform:none}}
@keyframes badgePulse{50%{transform:scale(1.03);box-shadow:0 0 0 4px #b85d3225}}
@keyframes progressSweep{0%,45%{transform:translateX(-180%)}75%,100%{transform:translateX(400%)}}
@keyframes characterFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media(max-width:520px){.toast-stack{right:14px;bottom:78px}.achievement-card:before,.achievement-card:after{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.progress-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:17px}.rank-banner{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:24px;border:1px solid #70462f;background:linear-gradient(115deg,#171f1e,#241c17);margin-bottom:17px}.rank-mon{width:68px;height:68px;border:1px solid #a85d38;border-radius:50%;display:grid;place-items:center;color:#d18a5a;background:#0b1414}.rank-mon svg{width:35px}.rank-name{font-size:30px;margin:3px 0}.rank-xp{text-align:right}.rank-xp strong{display:block;font-family:'Shippori Mincho',serif;font-size:23px}.requirement-list{display:grid;gap:10px;margin-top:16px}.requirement{padding:12px 13px;border:1px solid #353b37;background:#111918}.requirement-top{display:flex;justify-content:space-between;gap:12px;font-size:11px;margin-bottom:7px}.requirement-top strong{color:#ded7c9}.requirement-top span{color:#a59e92}.requirement.met{border-color:#496153}.requirement.met .requirement-top span{color:#93b197}.history-chart{height:175px;display:flex;align-items:end;gap:4px;padding:20px 2px 0;border-bottom:1px solid #42433c;margin-top:13px}.history-bar{flex:1;min-width:3px;height:max(3px,var(--h));background:#49504a;position:relative;transition:.2s}.history-bar.valid{background:#8a9b79}.history-bar.perfect{background:#b9643e}.history-bar.today:after{content:'';position:absolute;inset:-5px -2px;border:1px solid #ded2bb}.history-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px;color:#99978f;font-size:10px}.history-legend i{width:8px;height:8px;display:inline-block;margin-right:5px}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:15px}.metric{padding:14px;border:1px solid #363a35;background:#111817}.metric strong{display:block;font-family:'Shippori Mincho',serif;font-size:24px}.metric span{color:#999d95;font-size:10px}.campaign-summary{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:17px}.campaign-chip{border:1px solid #373b36;background:#111817;padding:11px}.campaign-chip strong{display:block;font-family:'Shippori Mincho',serif;font-size:17px}.campaign-chip span{font-size:9px;color:#97998f;text-transform:uppercase;letter-spacing:.08em}.date-state.valid{color:#c7a06b}.date-state.perfect{color:#9eb48d}@media(max-width:800px){.progress-layout{grid-template-columns:1fr}.rank-banner{grid-template-columns:auto 1fr}.rank-xp{grid-column:1/-1;text-align:left}.campaign-summary{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.metric-grid{grid-template-columns:1fr}.rank-banner{padding:17px}.rank-mon{width:54px;height:54px}}
/* Los assets funcionan como fragmentos editoriales, no como fondos decorativos genéricos. */
.achievement-card{width:min(680px,calc(100vw - 34px));min-height:330px;padding:0;display:grid;grid-template-columns:42% 58%;text-align:left;border:0;background:#0a1212;overflow:hidden;box-shadow:0 28px 90px #000d;animation:achievementIn .55s cubic-bezier(.17,.84,.25,1)}.achievement-card:before,.achievement-card:after{display:none}.achievement-visual{position:relative;overflow:hidden;border-right:1px solid #8e4b2d;background:radial-gradient(circle at 58% 36%,#a84f2d45,transparent 28%),#071011}.achievement-visual:before{content:'';position:absolute}.achievement-copy{padding:48px 44px 38px;display:flex;flex-direction:column;justify-content:center;position:relative}.achievement-copy:before{content:'';position:absolute;top:25px;right:27px;width:46px;height:1px;background:#9d5130;box-shadow:0 6px 0 #9d513066}.achievement-card h2{font-size:34px;line-height:1.05;margin:10px 0 9px}.achievement-card p{font-size:12px;line-height:1.55;max-width:280px}.achievement-kicker{font-size:7px;letter-spacing:.3em}.rank-banner,.boss-card{position:relative;overflow:hidden;isolation:isolate}@media(max-width:620px){.achievement-card{grid-template-columns:1fr;min-height:0}.achievement-visual{height:150px;border-right:0;border-bottom:1px solid #8e4b2d}.achievement-copy{padding:28px 26px 31px}.achievement-card h2{font-size:28px}}
/* Biblioteca final: cada tarjeta y cada sección reciben un archivo exclusivo. */
.badge-art.generated{width:116px;height:116px;border-radius:0;filter:none;box-shadow:none}.badge-art.generated>img{display:block;width:100%;height:100%;object-fit:contain}.badge-art.generated:before,.badge-art.generated:after,.badge-art.generated svg{display:none}.badge.locked .badge-art.generated{filter:grayscale(.82) brightness(.68) contrast(1.05);opacity:.82}.badge.unlocked .badge-art.generated{filter:none;opacity:1}.achievement-visual:before,.achievement-visual:after{display:none}.achievement-visual>img{position:absolute;inset:18px;width:calc(100% - 36px);height:calc(100% - 36px);object-fit:contain}.achievement-seal{display:none}.achievement-copy{padding-top:54px}.rank-banner:after,.boss-card:before{display:none}.rank-mon{width:88px;height:88px;border:0;background:none}.rank-mon>img{display:block;width:100%;height:100%;object-fit:contain}.rank-mon svg{display:none}.side-highlight{position:relative;overflow:hidden;isolation:isolate}.side-highlight:before{content:'';position:absolute;right:-18px;bottom:-30px;width:150px;height:130px;background:url('../assets/sections/hoy.webp') center/cover no-repeat;opacity:.14;z-index:-1}.view-heading{position:relative;overflow:hidden;isolation:isolate;padding:24px 0}.view-heading:after{content:'';position:absolute;right:0;inset-block:0;width:min(48%,620px);background-position:center;background-size:cover;background-repeat:no-repeat;opacity:.24;mask-image:linear-gradient(90deg,transparent,#000 35%);z-index:-1}.view-heading>*{position:relative;z-index:1}#screen-week .view-heading:after{background-image:url('../assets/sections/semana.webp')}#screen-progress .view-heading:after{background-image:url('../assets/sections/progreso.webp')}#screen-badges .view-heading:after{background-image:url('../assets/sections/logros.webp')}@media(max-width:620px){.badge-art.generated{width:94px;height:94px}.achievement-visual>img{inset:8px;width:calc(100% - 16px);height:calc(100% - 16px)}.view-heading:after{width:72%;opacity:.15}}
.level-card{position:relative;overflow:hidden;min-height:150px}.level-card:after{content:'';position:absolute;right:0;top:12px;width:92px;height:92px;background:var(--current-rank-image) center/contain no-repeat}.level-card .level-row svg{display:none}.level-card .level-row{padding-right:92px}
/* SHŪREN v4.1 — simplificación: jerarquía por aire, no por cajas. */
.view-heading{min-height:170px;margin:0 0 38px;padding:30px 0 24px;border:0;display:flex;flex-direction:column;justify-content:flex-end}.view-heading:after{inset:auto 0 0 auto;height:100%;border-radius:54% 0 0 46%;opacity:.28;mask-image:linear-gradient(90deg,transparent 0,#000 42%,#000)}.view-heading h1{max-width:760px;text-wrap:balance}.view-heading p{max-width:600px}
.stat-grid{border:0;background:transparent;gap:clamp(18px,4vw,56px);margin:4px auto 56px;max-width:1180px}.stat-grid:before{display:none}.stat{border:0!important;background:transparent;min-height:auto;padding:0;overflow:visible}.stat:after{display:none}.stat-value{font-size:30px;margin-top:8px}.stat-sub{margin-top:4px}
.panel-title{border:0;padding:0;margin-bottom:24px}.content-grid{gap:64px}.panel-stack{gap:42px}.level-card,.side-highlight{border:0;padding-bottom:8px}.side-highlight{background:transparent}.side-highlight:before{opacity:.22;right:-4px}.reward{border:0}.group-label:after{display:none}.mission-group{margin-top:32px}.quest{border:0!important;margin:5px 0;padding:13px 12px;border-radius:18px;background:transparent;transition:background .2s,transform .2s}.quest:first-of-type{border:0}.quest:hover{background:#17201e;transform:translateX(4px)}.quest.current{border:0;background:linear-gradient(90deg,#a9533028,transparent 76%);box-shadow:none}.quest.done{opacity:.64}.mission-footer{border:0;margin-top:24px;padding-top:0}
.week-strip{gap:clamp(8px,1.5vw,18px);border:0;background:transparent;margin:26px 0 34px}.date-card{aspect-ratio:1;border:0;border-radius:50%;background:transparent;min-height:0;padding:10px;display:flex;flex-direction:column;align-items:center;justify-content:center}.date-card:hover{background:#121c1a;transform:translateY(-2px)}.date-card.selected{border:0;border-radius:50%;background:radial-gradient(circle,#29302a 0 59%,#a95330 60% 61%,transparent 62%);box-shadow:none}.date-card .date-num{font-size:28px}.date-card .date-state{margin-top:2px}.week-summary{gap:64px;margin-top:56px!important}.campaign-summary{gap:clamp(18px,4vw,58px);margin:0 0 48px}.campaign-chip{border:0;background:transparent;padding:0}.campaign-chip strong{font-size:22px;margin-top:5px}
.collection-head{margin-bottom:42px;align-items:center}.badge-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:56px clamp(28px,5vw,72px);border:0;background:transparent}.badge{border:0!important;background:transparent;min-height:300px;padding:0;overflow:visible}.badge:before{display:none}.badge:hover{background:transparent;transform:translateY(-6px)}.badge-art.generated{width:148px;height:148px;margin:0 auto 22px}.badge-name{font-size:17px;margin-bottom:7px}.badge-desc{font-size:11px;line-height:1.55;min-height:35px;margin-bottom:18px}.badge-progress{margin-top:auto}.badge .progress{height:2px;opacity:.7}
.rank-banner{border:0;border-radius:36px 8px 36px 8px;background:radial-gradient(circle at 12% 50%,#a9533024,transparent 26%),linear-gradient(110deg,#111b1a,#171713);padding:30px 34px;margin-bottom:42px}.progress-layout{gap:48px 64px}.requirement-list{gap:12px;margin-top:24px}.requirement{border:0;border-radius:18px;background:#111a18;padding:14px 17px}.requirement.met{border:0;background:#17221d}.metric-grid{gap:18px}.metric{border:0;border-radius:22px;background:#111a18;padding:18px}.history-chart{border:0;background:linear-gradient(180deg,transparent,#0e171555);padding:26px 16px 12px;border-radius:30px 30px 10px 10px}.history-bar{border-radius:5px 5px 1px 1px}
.settings-grid{gap:72px}.setting-block{border:0;padding:22px 0}.rules{gap:4px}.rules .rule{border:0;background:transparent;padding:13px 0}.secondary,.danger,.icon-btn{border-radius:999px;padding-inline:18px}.segmented{gap:8px}.segmented button{padding:7px 12px;border:0;border-radius:999px}.segmented button.selected{border:0;background:#242b27!important}
@media(max-width:900px){.badge-grid{gap:44px 28px}.content-grid{gap:40px}.view-heading{min-height:180px;margin-bottom:38px}.date-card{aspect-ratio:auto;border-radius:999px;min-height:86px}.date-card.selected{border-radius:999px}}
@media(max-width:700px){.badge-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 22px}.badge{min-height:276px}.badge-art.generated{width:125px;height:125px}.campaign-summary{grid-template-columns:repeat(2,1fr)}.stat-grid{gap:26px 20px}.progress-layout{gap:36px}.week-summary{gap:42px}}
@media(max-width:480px){.badge-grid{grid-template-columns:1fr;gap:46px}.badge{min-height:0;display:grid;grid-template-columns:112px 1fr;grid-template-rows:auto auto auto;column-gap:20px;align-items:center}.badge-art.generated{width:112px;height:112px;grid-row:1/4;margin:0}.badge-name,.badge-desc{grid-column:2}.badge-progress,.badge>.progress{grid-column:1/-1}.view-heading{min-height:170px}.view-heading:after{width:90%;opacity:.18}.collection-head{align-items:flex-start}.collection-actions{justify-items:start}.rank-banner{border-radius:24px 6px;padding:22px}}
/* Fondos editoriales abstractos: sin ilustraciones de sección. */
.side-highlight:before{display:none}.view-heading:after{content:'✦';display:block;inset:-12px 5% auto auto;width:auto;height:auto;border-radius:0;background:none!important;color:#a65a3020;font:400 150px/1 'Shippori Mincho',serif;opacity:1;mask-image:none}.view-heading:before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(112deg,transparent 0 70%,#8b999116 70.12%,transparent 70.28%),radial-gradient(circle at 91% 35%,#a9533018 0 2px,transparent 3px);background-size:auto,13px 13px;z-index:-1}.view-heading>*{position:relative;z-index:1}@media(max-width:620px){.view-heading:after{right:1%;font-size:110px;opacity:.7}.view-heading:before{opacity:.65}}
/* Superficies suaves compartidas con Progreso. */
#screen-today .content-grid>#missionsPanel{padding:30px 32px;border-radius:30px;background:linear-gradient(145deg,#101a18,#0b1514)}#screen-today .panel-stack>section{padding:24px;border-radius:24px;background:#101918;border:0}#screen-today .panel-stack>.side-highlight{background:radial-gradient(circle at 85% 15%,#a9533021,transparent 34%),#111917}.level-card{min-height:176px}.level-card:after{right:18px;top:24px}
#screen-week>.panel{padding:30px 32px;border-radius:30px;background:linear-gradient(145deg,#101a18,#0b1514)}#screen-week .week-summary>.panel{padding:28px 30px;border-radius:26px;background:#101918}.campaign-summary{padding:0 12px}
#screen-badges>.panel{padding:30px 34px 40px;border-radius:32px;background:linear-gradient(145deg,#0e1817,#0a1413)}#screen-badges .badge{padding:22px 20px 20px;border-radius:24px;background:#111a18}#screen-badges .badge:hover{background:#151f1d;box-shadow:0 18px 38px #0003}
#screen-settings .settings-grid>.panel{padding:30px 32px;border-radius:28px;background:#101918}.rules .rule{padding:14px 16px;border-radius:16px;background:#131d1b}.setting-block{padding-inline:4px}
@media(max-width:700px){#screen-today .content-grid>#missionsPanel,#screen-week>.panel,#screen-badges>.panel,#screen-settings .settings-grid>.panel{padding:23px 20px;border-radius:24px}#screen-today .panel-stack>section,#screen-week .week-summary>.panel{padding:22px;border-radius:22px}#screen-badges .badge{padding:18px 16px}}
@media(max-width:480px){#screen-badges .badge{padding:16px;min-height:164px}.badge-art.generated{margin-left:0}.settings-grid{gap:24px}.week-summary{gap:24px}}
/* Personaje editorial de Logros. */
#screen-badges .view-heading{min-height:350px;padding-right:min(39vw,480px);overflow:visible;z-index:2}
#screen-badges .view-heading:after{display:none}
#screen-badges .view-heading>.eyebrow,#screen-badges .view-heading>h1,#screen-badges .view-heading>p{position:relative;z-index:4}
.achievements-character{position:absolute;z-index:1;right:clamp(8px,4vw,58px);bottom:-34px;width:clamp(300px,29vw,410px);height:auto;aspect-ratio:1;pointer-events:none;filter:drop-shadow(0 22px 28px #0008);opacity:1}
.achievements-character:before{content:'';position:absolute;inset:18% -10% 2% -18%;z-index:-1;background:radial-gradient(ellipse at center,#a45b3823 0,transparent 67%)}
.achievements-character img{width:100%;height:100%;object-fit:contain;object-position:center bottom;display:block}
@media(max-width:760px){#screen-badges .view-heading{min-height:310px;padding-right:245px}.achievements-character{right:-8px;bottom:0;width:285px;height:auto;opacity:1}}
@media(max-width:560px){#screen-badges .view-heading{min-height:430px;padding-right:0;padding-bottom:205px}.achievements-character{right:50%;transform:translateX(54%);bottom:0;width:260px;height:auto;opacity:1}#screen-badges .view-heading p{max-width:100%}}
/* Jerarquía de encabezados: sello global arriba, trazo editorial dentro de cada vista. */
.topbar>.eyebrow{gap:0;color:#8f9a92;font-size:9px;letter-spacing:.22em}
.topbar>.eyebrow:before{display:none}
.view-heading>.eyebrow:before{width:24px;height:1px;border-radius:0;background:#b9643e;box-shadow:none}

/* Responsive final: reglas autoritativas para teléfonos y pantallas estrechas. */
html,body{max-width:100%;overflow-x:hidden}
.brand-mark{background-image:url('../assets/brand/shuren-mark.webp')}
.hero-art{right:0;bottom:0;width:min(43%,440px);height:100%;background:url('../assets/characters/samurai-hoy-v2.webp') right bottom/contain no-repeat,radial-gradient(circle at 63% 46%,#b9a57a1a,transparent 42%)}
.side-highlight:before{background-image:url('../assets/sections/hoy.webp')}
#screen-week .view-heading:after{background-image:url('../assets/sections/semana.webp')}
#screen-progress .view-heading:after{background-image:url('../assets/sections/progreso.webp')}
#screen-badges .view-heading:after{background-image:url('../assets/sections/logros.webp')}
@media(max-width:600px){
  .app,.main,.screen,.panel,.content-grid,.panel-stack{width:100%;min-width:0;max-width:100%}
  .main{padding:58px 12px calc(88px + env(safe-area-inset-bottom))}
  .topbar{gap:10px;align-items:flex-start;margin:0 0 18px;padding:0 2px 12px}
  .topbar>.eyebrow{font-size:8px;line-height:1.35;white-space:nowrap}
  .date-pill{max-width:48%;padding:0;border:0;background:transparent;text-align:right;font-size:9px;line-height:1.35;white-space:normal}
  .hero{min-height:360px;padding:28px 18px 24px;align-items:flex-start;border-radius:24px}
  .hero-copy{max-width:100%;position:relative;z-index:4}
  .hero h1{font-size:clamp(32px,11vw,42px);max-width:100%;line-height:1.04}
  .hero p{max-width:86%;font-size:11px;line-height:1.65}
  .hero-art{display:block;width:72%;height:66%;right:-2%;bottom:-4%;opacity:1;z-index:1}
  .hero-button{min-height:42px}
  .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px;margin:24px 0 34px}
  .stat{padding:0;min-width:0}
  .stat-top{font-size:8px}.stat-value{font-size:22px}.stat-sub{font-size:9px;line-height:1.35}
  .content-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
  .panel-stack{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin-top:0}
  #screen-today .content-grid>#missionsPanel{padding:22px 16px;border-radius:22px}
  #screen-today .panel-stack>section{padding:20px 18px;border-radius:20px}
  .level-card{min-height:158px}.level-card:after{width:76px;height:76px;right:13px;top:18px}.level-card .level-row{padding-right:72px}
  .panel-title{margin-bottom:18px}.today-head{align-items:flex-start}.segmented{max-width:100%;overflow-x:auto}
  .quest{grid-template-columns:30px minmax(0,1fr);gap:9px;padding:13px 8px}
  .quest-xp{grid-column:2;justify-self:start;margin-top:2px}.quest-info{overflow-wrap:anywhere}
  .mission-footer{align-items:flex-start;flex-direction:column;gap:5px}
  .view-heading{min-height:150px;margin-bottom:28px;padding:28px 2px 20px}
  .view-heading h1{font-size:clamp(34px,12vw,46px);line-height:1.02}
  .view-heading p{font-size:11px;line-height:1.55}
  #screen-week>.panel{padding:20px 14px;border-radius:22px}
  .week-controls{gap:8px}.week-controls strong{font-size:12px;text-align:center}.icon-btn{padding:8px 12px;flex:0 0 auto}
  .week-strip{display:grid;grid-template-columns:repeat(7,64px);gap:7px;overflow-x:auto;margin:20px -2px 28px;padding:0 2px 8px;scroll-snap-type:x proximity}
  .date-card{min-height:80px;aspect-ratio:auto;scroll-snap-align:start}.date-card .date-num{font-size:21px}
  .campaign-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:0;margin-bottom:30px}
  .week-summary{grid-template-columns:minmax(0,1fr);gap:20px!important;margin-top:28px!important}
  #screen-week .week-summary>.panel{padding:22px 18px;border-radius:22px}
  .rank-banner{grid-template-columns:64px minmax(0,1fr);gap:13px;padding:20px 16px;border-radius:24px 8px;margin-bottom:26px}
  .rank-mon{width:64px;height:64px}.rank-name{font-size:25px}.rank-xp{grid-column:1/-1;text-align:left}
  .progress-layout{grid-template-columns:minmax(0,1fr);gap:24px}.metric-grid{grid-template-columns:minmax(0,1fr);gap:10px}
  .history-chart{height:145px;padding-inline:8px;gap:2px}.history-legend{gap:10px}
  #screen-badges .view-heading{min-height:410px;padding:26px 0 205px;margin-bottom:24px}
  .achievements-character{right:50%;bottom:-8px;width:270px;height:auto;transform:translateX(52%);opacity:1;z-index:1}
  #screen-badges>.panel{padding:22px 15px 30px;border-radius:24px}
  .collection-head{align-items:flex-start;flex-direction:column;gap:16px;margin-bottom:32px}
  .collection-actions{width:100%;justify-items:start}.collection-count{font-size:30px}.badge-filters{max-width:100%}
  .badge-grid{grid-template-columns:minmax(0,1fr);gap:18px}
  #screen-badges .badge{min-height:0;display:grid;grid-template-columns:92px minmax(0,1fr);grid-template-rows:auto auto auto;column-gap:16px;padding:17px 14px;border-radius:20px;align-items:center}
  .badge-art.generated{width:92px;height:92px;grid-row:1/4;margin:0}.badge-name,.badge-desc{grid-column:2}.badge-name{font-size:15px}.badge-desc{min-height:0;margin-bottom:8px}
  .badge-progress,.badge>.progress{grid-column:1/-1}.badge-progress{margin-top:12px}
  .settings-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  #screen-settings .settings-grid>.panel{padding:22px 18px;border-radius:22px}
  .button-row{display:grid;grid-template-columns:minmax(0,1fr)}.button-row button,.secondary,.danger{width:100%;min-height:42px}
  .achievement-card{width:calc(100vw - 24px);grid-template-columns:1fr;max-height:calc(100dvh - 32px);overflow:auto}
  .achievement-visual{height:138px;border-right:0;border-bottom:1px solid #8e4b2d}.achievement-copy{padding:25px 22px 28px}.achievement-card h2{font-size:27px}
  .toast-stack{left:12px;right:12px;bottom:calc(76px + env(safe-area-inset-bottom));width:auto}
  .mobile-nav{padding:7px 4px calc(7px + env(safe-area-inset-bottom));gap:0}
  .mobile-nav button{flex:1;min-width:0;padding:4px 2px;font-size:8px}.mobile-nav svg{width:18px;height:18px}
}
@media(max-width:360px){
  .main{padding-inline:9px}.hero{padding-inline:15px}.hero h1{font-size:33px}.hero p{max-width:92%}
  .stat-grid{gap:16px 10px}.segmented button{padding-inline:9px;font-size:9px}
  #screen-badges .badge{grid-template-columns:78px minmax(0,1fr);column-gap:12px}.badge-art.generated{width:78px;height:78px}
  .mobile-nav button{font-size:7px}.mobile-nav svg{width:17px;height:17px}
}
#screen-badges .view-heading{min-height:170px;padding:30px 0 24px;margin-bottom:38px}
#screen-badges .view-heading p{max-width:600px}
@media(max-width:600px){
  #screen-badges .view-heading{min-height:150px;padding:20px 0 18px;margin-bottom:28px}
}
