/* COMMIT independent learning app introduction: isolated Gutenberg block v2 */
.commit-app-edit, .commit-app-edit * {box-sizing:border-box}
.commit-app-edit{
  display:block;position:relative;isolation:isolate;container-type:inline-size;
  width:100%;max-width:none;min-width:0;margin:0;padding:0;overflow:hidden;
  background:radial-gradient(circle at 79% 45%,#ffecd0 0,transparent 41%),linear-gradient(150deg,#fffefa 5%,#fff6e8 70%,#fff0d7 100%);
  color:#20232b;font-family:'Noto Sans JP','Noto Sans CJK JP','Hiragino Kaku Gothic ProN','Yu Gothic',Meiryo,sans-serif;
}
.commit-app-edit:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 0% 0%,#f8e5c6 0,transparent 16%),radial-gradient(circle at 99% 93%,#ffdda8 0,transparent 23%);opacity:.55}
.commit-app-edit :where(h2,h3,h4,p){margin:0!important;padding:0!important;border:0!important;background:transparent!important;font-family:inherit!important;text-transform:none!important;text-shadow:none!important;box-shadow:none!important;line-height:inherit!important}
.commit-app-edit :where(svg){display:inline-block;flex-shrink:0;width:23px;height:23px;vertical-align:middle;color:#f66b24}
.commit-app-edit__inner{position:relative;max-width:1680px;min-height:925px;margin:0 auto;padding:54px 4.3% 35px}
.commit-app-edit__inner:before,.commit-app-edit__inner:after{content:"";position:absolute;z-index:0;pointer-events:none;width:168px;height:160px;background-image:radial-gradient(#f8c68e 2px,transparent 2.3px);background-size:15px 15px;opacity:.6}
.commit-app-edit__inner:before{top:135px;left:54%}
.commit-app-edit__inner:after{bottom:55px;right:15px}
.commit-app-edit__copy{position:relative;z-index:2;width:58%;min-width:0}
.commit-app-edit p.commit-app-edit__label{display:inline-block!important;position:relative;border-radius:999px!important;padding:9px 22px!important;border:1.5px solid #ffb47a!important;background:#fff9f1!important;color:#ec5216!important;font-size:clamp(13px,1.25vw,19px)!important;font-weight:900!important;line-height:1.45!important;letter-spacing:.015em!important;margin:0 0 22px!important}
.commit-app-edit p.commit-app-edit__label:after{content:"";position:absolute;left:calc(100% + 10px);top:0px;width:30px;height:34px;background:linear-gradient(115deg,transparent 44%,#ffa028 45% 54%,transparent 55%) 0 0/12px 23px no-repeat;transform:rotate(24deg)}
.commit-app-edit h2.commit-app-edit__headline{font-size:clamp(37px,4.15vw,71px)!important;font-weight:900!important;line-height:1.22!important;letter-spacing:-.055em!important;margin:0 0 18px!important;color:#16191e!important}
.commit-app-edit__headline-first{display:block!important;white-space:nowrap}
.commit-app-edit__headline-second-wrap{display:block!important;position:relative;width:max-content;max-width:100%}
.commit-app-edit__headline-second{display:inline-block!important;background:linear-gradient(110deg,#e8481b 8%,#fa6018 59%,#ff6b21 100%);background-clip:text;-webkit-background-clip:text;color:#e9541d;-webkit-text-fill-color:transparent;white-space:nowrap}
.commit-app-edit__rays{position:absolute;right:-47px;top:24px;width:36px;height:57px;pointer-events:none}
.commit-app-edit__rays i{position:absolute;display:block;width:6px;height:21px;border-radius:20px;background:#ffa120}
.commit-app-edit__rays i:nth-child(1){left:8px;top:0;transform:rotate(20deg)}
.commit-app-edit__rays i:nth-child(2){left:23px;top:14px;transform:rotate(55deg)}
.commit-app-edit__rays i:nth-child(3){left:23px;top:35px;transform:rotate(80deg)}
.commit-app-edit p.commit-app-edit__lead{font-size:clamp(17px,1.62vw,25px)!important;line-height:1.54!important;letter-spacing:-.035em!important;font-weight:900!important;color:#19202e!important;margin:0 0 13px!important;max-width:880px}
.commit-app-edit p.commit-app-edit__description{font-size:clamp(13px,1.15vw,18px)!important;line-height:1.92!important;color:#303541!important;font-weight:400!important;max-width:800px;margin:0 0 19px!important}
.commit-app-edit__chips{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:0 0 26px;width:106%;max-width:calc(100vw - 50px)}
.commit-app-edit__chip{display:inline-flex;gap:6px;align-items:center;justify-content:center;padding:7px 11px;border-radius:999px;border:1px solid #f7ccad;background:rgba(255,250,242,.90);color:#242a33;font-size:clamp(10px,.9vw,14px);font-weight:800;line-height:1.45;white-space:nowrap}
.commit-app-edit__chip svg{width:18px;height:18px}
.commit-app-edit__chip-text{white-space:nowrap}
.commit-app-edit__process{position:relative;border-top:1.5px solid #efac7c;padding-top:18px}
.commit-app-edit h3.commit-app-edit__process-title{display:block;font-size:clamp(21px,1.95vw,32px)!important;line-height:1.48!important;font-weight:900!important;letter-spacing:-.05em!important;color:#1b202a!important;margin:0 0 15px!important}
.commit-app-edit h3.commit-app-edit__process-title strong{color:#f0561d!important;font-weight:900!important}
.commit-app-edit__cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.commit-app-edit__card{min-width:0;position:relative;padding:13px 12px 17px;border:1px solid #ffead8;border-radius:17px;background:rgba(255,255,255,.96);box-shadow:0 7px 17px rgba(163,100,18,.04)}
.commit-app-edit__card-head{display:flex;align-items:center;gap:7px;margin:0 0 9px;min-height:40px}
.commit-app-edit__number{display:grid;place-items:center;flex-shrink:0;width:35px;height:35px;border-radius:50%;background:linear-gradient(135deg,#ffcfab,#f79458);color:#fff;font-size:15px;font-weight:900}
.commit-app-edit__card-head svg{width:25px;height:25px}
.commit-app-edit h4{font-weight:900!important;font-size:clamp(12px,1.05vw,16px)!important;line-height:1.35!important;white-space:nowrap;letter-spacing:-.04em!important;color:#1d242c!important}
.commit-app-edit__card p{font-size:clamp(12px,.91vw,15px)!important;line-height:1.8!important;color:#303745!important}
.commit-app-edit__next{position:absolute;right:-16px;top:48%;z-index:2;transform:translateY(-50%)}
.commit-app-edit__next svg{width:24px;height:24px;stroke-width:3}
.commit-app-edit__art{position:absolute;z-index:1;right:-2%;top:42px;width:45%;display:block;pointer-events:none}
.commit-app-edit__art img{display:block;width:100%;height:auto;max-width:none;box-shadow:none;border:0;margin:0;padding:0}
.commit-app-edit__footer{position:relative;z-index:3;display:flex;align-items:center;gap:8px;margin-top:19px;border-radius:11px;padding:9px 10px 9px 14px;background:linear-gradient(90deg,rgba(255,237,215,.90),rgba(255,246,232,0));font-weight:900;font-size:clamp(17px,1.85vw,29px);color:#222830;white-space:nowrap}
.commit-app-edit__footer svg{width:36px;height:36px;fill:#f2651e;stroke:#f2651e;stroke-width:1.4}
.commit-app-edit__footer strong{color:#e95019;font-weight:900}
.commit-app-edit__footer i{height:1px;background:#f08b51;flex:1;margin-left:12px}
/* At narrower widths preserve the side-by-side composition as long as copy remains readable */
@container (max-width: 1300px) {
 .commit-app-edit__inner{padding:36px 3.5% 27px;min-height:820px}
 .commit-app-edit__copy{width:62%}
 .commit-app-edit h2.commit-app-edit__headline{font-size:clamp(34px,4.0vw,60px)!important}
 .commit-app-edit__art{width:44%;top:69px;right:-1%}
 .commit-app-edit__chips{width:107%}
 .commit-app-edit__card{padding:11px 9px 13px}
 .commit-app-edit__card-head{gap:4px}
 .commit-app-edit__number{width:29px;height:29px;font-size:12px}
 .commit-app-edit__card-head svg{width:20px;height:20px}
}
@container (max-width: 1010px) {
 .commit-app-edit__inner{min-height:735px;padding:28px 3.2% 25px}
 .commit-app-edit__copy{width:65%}
 .commit-app-edit__art{right:-6%;width:44%;top:140px}
 .commit-app-edit h2.commit-app-edit__headline{font-size:clamp(28px,3.6vw,44px)!important}
 .commit-app-edit p.commit-app-edit__lead{font-size:clamp(15px,1.7vw,20px)!important}
 .commit-app-edit p.commit-app-edit__description{font-size:clamp(12px,1.3vw,15px)!important;line-height:1.75!important}
 .commit-app-edit__chips{width:100%;gap:4px}
 .commit-app-edit__chip{font-size:11px;padding:6px 8px}
 .commit-app-edit__chip svg{width:14px;height:14px}
 .commit-app-edit h3.commit-app-edit__process-title{font-size:clamp(19px,2.1vw,25px)!important}
 .commit-app-edit h4{font-size:12px!important;white-space:normal}
 .commit-app-edit__card p{font-size:11px!important}
}
@container (max-width: 790px) {
 .commit-app-edit__inner{min-height:0;padding:25px 17px 22px}
 .commit-app-edit__copy{width:100%}
 .commit-app-edit p.commit-app-edit__label{font-size:13px!important;margin-bottom:16px!important;padding:7px 17px!important}
 .commit-app-edit h2.commit-app-edit__headline{font-size:clamp(26px,6.1vw,46px)!important;line-height:1.28!important;margin-bottom:14px!important}
 .commit-app-edit__rays{right:-29px;top:9px;transform:scale(.7);transform-origin:top right}
 .commit-app-edit p.commit-app-edit__lead{font-size:16px!important;line-height:1.6!important}
 .commit-app-edit p.commit-app-edit__description{font-size:13px!important;line-height:1.8!important}
 .commit-app-edit__chips{width:100%;max-width:100%;gap:6px;margin-bottom:19px}
 .commit-app-edit__chip{font-size:12px;padding:7px 9px}
 .commit-app-edit__chip svg{width:16px;height:16px}
 .commit-app-edit__process{padding-top:16px}
 .commit-app-edit h3.commit-app-edit__process-title{font-size:clamp(20px,4.7vw,29px)!important;white-space:normal}
 .commit-app-edit__cards{grid-template-columns:1fr;gap:9px}
 .commit-app-edit__card{padding:13px 15px}
 .commit-app-edit__number{width:35px;height:35px;font-size:15px}
 .commit-app-edit__card-head{gap:8px}
 .commit-app-edit__card-head svg{width:25px;height:25px}
 .commit-app-edit h4{font-size:16px!important;white-space:normal}
 .commit-app-edit__card p{font-size:13px!important}
 .commit-app-edit__next{display:none}
 .commit-app-edit__art{position:relative;z-index:1;top:auto;right:auto;width:min(100%,470px);margin:14px auto 0;pointer-events:auto}
 .commit-app-edit__footer{margin-top:4px;padding:7px 5px;font-size:clamp(18px,4.1vw,25px)}
 .commit-app-edit__footer svg{width:30px;height:30px}
 .commit-app-edit__footer i{margin-left:5px}
}
@container (max-width: 415px) {
 .commit-app-edit__inner{padding:20px 11px 19px}
 .commit-app-edit h2.commit-app-edit__headline{font-size:clamp(25px,7vw,34px)!important;letter-spacing:-.075em!important}
 .commit-app-edit__rays{right:-27px;transform:scale(.58);top:5px}
 .commit-app-edit__chip{font-size:11px;padding:6px 8px}
 .commit-app-edit__footer{font-size:17px;gap:4px}
}
/* In Gutenberg use the actual block appearance, not a giant placeholder */
.editor-styles-wrapper .commit-app-edit{max-width:none!important}
.editor-styles-wrapper .commit-app-edit [data-rich-text-placeholder]:after{opacity:.45}
.editor-styles-wrapper .commit-app-edit .block-editor-rich-text__editable{outline-offset:3px}
